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

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

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

كخطوة أولى، سنضيف قائمة مخصصة في جدول بيانات 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 في محرر Apps Script وأضف الكود التالي.

يستخدم جافا سكريبت 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 ستكون الطريقة فارغة إذا تم حظر النافذة بواسطة أدوات حظر النوافذ المنبثقة المضمنة في المتصفح.

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

// before
var windowFeatures = 'popup';

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

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

3. افتح الرابط من جداول بيانات Google

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

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