Бічна панель — це елемент інтерфейсу користувача (невелика вертикальна область), який з’являється ліворуч або праворуч від більшого вікна або на екрані користувача для відображення пов’язаної інформації або списку варіантів або параметрів навігації.
Бічна панель у таблицях Google — це панель користувальницького інтерфейсу, яка відображається праворуч від Google Таблиць. Google надає вбудований редактор сценаріїв під назвою Apps Script, який може створювати різні надбудови та елементи для програм G-Suite. Його також можна використовувати для створення власних бічних панелей у таблицях Google.
У цій статті буде показано, як створити спеціальну бічну панель у Google Таблицях за допомогою редактора Google Apps Script.
Створення бічної панелі в Google Таблицях за допомогою Apps Script
Якщо ви хочете створити спеціальну бічну панель, вам потрібно ввести та запустити певний код у редакторі Apps Script. Потім ви можете створювати власні віджети на бічній панелі, використовуючи коди HTML, CSS та Javascript.
Спочатку відкрийте таблиці Google. У меню таблиць Google натисніть «Інструменти» та виберіть «Редактор сценаріїв».
Це відкриє редактор Apps Script у новій вкладці вашого браузера, де ви можете написати код свого інтерфейсу користувача.
Напишіть наступний код на сторінці Code.gs:
function onOpen() { SpreadsheetApp.getUi() .createMenu('Моє нове меню') .addItem('Моя бічна панель 1', 'showSidebar') .addToUi(); } function showSidebar() { var html = HtmlService.createHtmlOutputFromFile('Бічна панель') .setTitle('Бічна панель обчислень'); SpreadsheetApp.getUi() .showSidebar(html); }
У наведеному вище коді сценарію Code.gs функція OnOpen() створює спеціальне меню під назвою «Моє нове меню» на панелі меню таблиць Google. Це меню міститиме пункт меню «Моя бічна панель-1». Коли ви клацнете цей пункт меню, буде запущена функція showAdminSidebar() (друга частина коду), а бічна панель відобразиться в правій частині вікна аркуша Google.
Далі нам потрібно створити файл HTML у редакторі сценаріїв, а потім за допомогою цього файлу ви зможете створити бічну панель.
Щоб створити файл HTML, клацніть значок плюса (+) поруч із файлами в редакторі Apps Script та виберіть «HTML».
Це створить файл HTML під кодом Code.gs. Перейменуйте файл як «Бічна панель». Це ім’я має збігатися з ім’ям, доданим у функцію showSidebar() (var html = HtmlService.createHtmlOutputFromFile(‘Sidebar’)).
Напишіть наступний код у розділі файлу Sidebar.html:
Це моя нова бічна панель
Наведений вище код відображає текстовий рядок «Це моя нова бічна панель» і кнопку «Закрити», яка закриває бічну панель при натисканні на неї.
Після того, як ви закінчите писати наведений вище код у розділі Sidebar.html, він повинен містити такий код:
Це моя нова бічна панель.
Скріншот:
Коли ви закінчите вводити обидва коди, збережіть проект, натиснувши піктограму збереження на панелі інструментів (див. знімок екрана нижче). Потім запустіть функції, натиснувши піктограму «Виконати».
Незалежно від того, запустите ви сценарій тут або виберете користувацький пункт меню на панелі інструментів Google таблиць (вперше), Google попросить вас надати дозвіл на запуск сценарію. Оскільки ви використовуєте віджет стороннього розробника, Google запитує вашу авторизацію. Після того, як ви авторизуєте сценарій, він відобразить бічну панель у вашому аркуші Google.
Як авторизувати код сценарію програми в Google
Щоб авторизувати свій користувацький сценарій, виконайте такі дії:
Після запуску сценарію Google попросить вас вибрати обліковий запис Google. Після того, як ви його виберете, з’явиться невелике спливаюче вікно, у якому натисніть «Переглянути дозволи».
З’явиться ще одне спливаюче вікно, тут виберіть «Показати розширені» та натисніть «Перейти до проекту без назви (небезпечно)» (у ньому буде показано назву вашого проекту).
У наступному вікні натисніть «Дозволити», і google sheet запустить ваш сценарій.
Зробивши це, поверніться до своєї таблиці Google і оновіть її. Нове спеціальне меню (Моє нове меню) буде додано до панелі інструментів аркуша Google, яку ми додали за допомогою сценарію Code.gs. Натисніть «Моє нове меню» та виберіть пункт меню «Моя бічна панель 1», щоб відобразити бічну панель.
Тепер ваша спеціальна бічна панель з’явиться праворуч на аркуші Google з текстом і кнопкою, яку ми додали (як показано нижче). Після натискання кнопки бічна панель буде закрита.
Тепер ви знаєте, як створити власну бічну панель у таблицях Google.