تقنية

كيفية فتح موقع ويب في نافذة جديدة من قائمة Google Sheets


دعنا نقول أنك قمت ببناء إضافة لأوراق Google التي تضيف عنصر قائمة جديد إلى واجهة مستخدم Sheets. ترغب الآن في إضافة خيار في القائمة ، عند النقر فوق ، سيقوم المستخدم بإعادة توجيه المستخدم إلى موقع الويب الخاص بك دون أن يضطر المستخدم إلى النقر فوق أي زر آخر.

على سبيل المثال ، في ورقة Google التجريبية هذه ، لدينا قائمة أولياء الأمور والقائد الفرعي الذي يفتح موقع الويب الأساسي في النافذة الجديدة.

أوراق Google URL مفتوحة

كخطوة أولى ، سنضيف قائمة مخصصة في ورقة Google ونستدعيها من onOpen وظيفة حتى تتوفر القائمة دائمًا عندما يفتح المستخدم ورقة Google.

const onOpen = () => {
  const ui = SpreadsheetApp.getUi();
  const parentMenu = ui.createMenu('👩🏻‍💼  Digital Inspiration');
  parentMenu.addItem('Visit our website', 'openWebsite');
  parentMenu.addToUi();
};

2. أضف HTML لإعادة توجيه الموقع

إنشاء ملف جديد url.html في محرر البرنامج النصي للتطبيقات وأضف الكود التالي.

يستخدم JavaScript window.open طريقة لفتح عنوان URL في نافذة جديدة لأننا قمنا بتعيين الهدف _blank.

<!DOCTYPE html>
<html>
  <body>
    <a href="<?= url; ?>" target="_blank">Click here</a> to open the webpage.
  </body>
  <script>
    var windowReference = window.open('<?= url; ?>', '_blank');
    if (windowReference !== null) {
      google.script.host.close();
    }
  </script>
</html>

إذا كنت ترغب في فتح موقع الويب في نافذة منبثقة ثابتة الحجم ، بدلاً من نافذة جديدة ، فسيتم كتابة الوظيفة على النحو التالي:

<script>
  var windowFeatures = 'popup';
  var windowReference = window.open('<?= url; ?>', 'scriptWindow', windowFeatures);
  if (windowReference !== null) {
    google.script.host.close();
  }
</script>

قيمة الإرجاع window.open ستكون الطريقة لاغية إذا تم حظر النافذة بواسطة حاصرات المنبثقة المدمجة للمتصفح.

يمكن وضع المنبثقة في أي مكان على البرنامج النصي وتغيير حجمه إلى ارتفاع وعرض محدد عن طريق تعديل متغير ميزات النافذة على النحو التالي:

// before
var windowFeatures = 'popup';

// after
var windowFeatures = 'left=100,top=100,width=320,height=320';

يرجى الاطلاع على مستندات MDN لأفضل الممارسات حول حل بعض مشاكل قابلية الاستخدام المتعلقة بروابط فتح نافذة ثانوية.

بعد ذلك ، سنكتب وظيفة البرنامج النصي للتطبيقات التي سيتم استدعاؤها من القائمة وإطلاق موقع الويب في نافذة / علامة تبويب جديدة.

const openWebsite = () => {
  const htmlTemplate = HtmlService.createTemplateFromFile('url.html');
  htmlTemplate.url = 'https://digitalinspiration.com/';
  const htmlOutput = htmlTemplate.evaluate().setHeight(50).setWidth(200);
  const ui = SpreadsheetApp.getUi();
  ui.showModelessDialog(htmlOutput, 'Open Website');
  Utilities.sleep(2000);
};

من الضروري إضافة ملف sleep العمل مع فتح النافذة قد يستغرق ثانية أو اثنتين. لو sleep تم حذفه ، سيفتح حوار جدول البيانات ويغلق على الفور دون إطلاق الموقع.



Source link

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *

زر الذهاب إلى الأعلى