Как создать боковую панель в Google Таблицах

Боковая панель - это элемент пользовательского интерфейса (небольшая вертикальная область), который появляется слева или справа от большего окна или на экране пользователя для отображения связанной информации или списка вариантов или вариантов навигации.

Боковая панель в Google Таблицах - это панель пользовательского интерфейса, которая отображается в правой части Google Таблиц. Google предоставляет встроенный редактор сценариев под названием Apps Script, который может создавать различные надстройки и элементы для приложений G-Suite. Его также можно использовать для создания собственных пользовательских боковых панелей в таблицах Google.

В этой статье вы узнаете, как создать пользовательскую боковую панель в Google Таблицах с помощью редактора скриптов Google Apps.

Создание боковой панели в Google Таблицах с помощью скрипта приложений

Если вы хотите создать настраиваемую боковую панель, вам необходимо ввести и запустить определенный код в редакторе скриптов приложений. Затем вы можете создавать свои собственные виджеты на боковой панели, используя коды HTML, CSS и Javascript.

Сначала откройте листы Google. В меню таблиц Google нажмите «Инструменты» и выберите «Редактор скриптов».

Это откроет редактор скриптов приложений на новой вкладке вашего браузера, где вы можете написать код своего пользовательского интерфейса.

Напишите следующий код на странице 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, нажмите значок плюса (+) рядом с полем «Файлы» в редакторе скриптов приложений и выберите «HTML».

Это создаст HTML-файл ниже Code.gs. Переименуйте файл в "Боковая панель". Это имя должно совпадать с именем, добавленным в функцию showSidebar () (var html = HtmlService.createHtmlOutputFromFile (‘Sidebar’)).

Напишите следующий код в разделе файла Sidebar.html:

Это моя новая боковая панель

В приведенном выше коде отображается текстовая строка «Это моя новая боковая панель» и кнопка «Закрыть», которая закрывает боковую панель при нажатии на нее.

После того, как вы закончите писать приведенный выше код в разделе Sidebar.html, он должен содержать следующий код:

Это моя новая боковая панель.

Скриншот:

Когда вы введете оба кода, сохраните проект, щелкнув значок сохранения на панели инструментов (см. Снимок экрана ниже). Затем запустите функции, щелкнув значок «Выполнить».

Независимо от того, запускаете ли вы скрипт здесь или выбираете пользовательский пункт меню на панели инструментов Google листов (впервые), Google попросит вас авторизовать скрипт для запуска. Поскольку вы используете сторонний пользовательский виджет, Google запросит у вас авторизацию. После того, как вы авторизуете скрипт, он отобразит боковую панель в вашем листе Google.

Как авторизовать код скрипта приложений в Google

Чтобы авторизовать свой собственный сценарий, выполните следующие действия:

После запуска скрипта Google попросит вас выбрать вашу учетную запись Google. После того, как вы выберете его, появится небольшое всплывающее окно, в котором нажмите «Проверить разрешения».

Появится еще одно всплывающее окно, здесь выберите «Показать дополнительные» и нажмите «Перейти к проекту без названия (небезопасно)» (там будет показано название вашего проекта).

В следующем окне нажмите «Разрешить», и лист Google запустит ваш скрипт.

Как только вы это сделаете, вернитесь к своей таблице Google и обновите ее. Новое настраиваемое меню (My New Menu) будет добавлено на панель инструментов вашей таблицы Google, которую мы добавили с помощью скрипта Code.gs. Щелкните «Мое новое меню» и выберите пункт «Моя боковая панель 1», чтобы отобразить боковую панель.

Теперь ваша настраиваемая боковая панель появится в правой части вашего листа Google с текстом и добавленной нами кнопкой (как показано ниже). Когда вы нажмете кнопку, боковая панель будет закрыта.

Что ж, теперь вы знаете, как создать свою собственную боковую панель в таблицах Google.