Pasek boczny to element interfejsu użytkownika (mały pionowy obszar), który pojawia się po lewej lub prawej stronie większego okna lub na ekranie użytkownika w celu wyświetlenia powiązanych informacji lub listy wyborów lub opcji nawigacji.
Pasek boczny w Arkuszach Google to panel interfejsu użytkownika wyświetlany po prawej stronie Arkuszy Google. Google udostępnia wbudowany edytor skryptów o nazwie Apps Script, który może tworzyć różne dodatki i elementy do aplikacji G-Suite. Może być również używany do tworzenia własnych niestandardowych pasków bocznych w arkuszach Google.
Z tego artykułu dowiesz się, jak utworzyć niestandardowy pasek boczny w Arkuszach Google za pomocą edytora skryptów Google Apps.
Tworzenie paska bocznego w Arkuszach Google za pomocą Apps Script
Jeśli chcesz utworzyć niestandardowy pasek boczny, musisz wprowadzić i uruchomić określony kod w edytorze Apps Script. Następnie możesz tworzyć własne widżety na pasku bocznym za pomocą kodów HTML, CSS i JavaScript.
Najpierw otwórz arkusze Google. W menu Arkuszy Google kliknij „Narzędzia” i wybierz „Edytor skryptów”.
Spowoduje to otwarcie edytora Apps Script w nowej karcie przeglądarki, w której możesz wpisać kod interfejsu użytkownika.
Napisz następujący kod na stronie Code.gs:
function onOpen() { SpreadsheetApp.getUi() .createMenu('Moje nowe menu') .addItem('Mój pasek boczny 1', 'showSidebar') .addToUi(); } function showSidebar() { var html = HtmlService.createHtmlOutputFromFile('Pasek boczny') .setTitle('Pasek boczny obliczeń'); Arkusz kalkulacyjnyApp.getUi() .showSidebar(html); }
W powyższym kodzie skryptu Code.gs funkcja OnOpen() tworzy niestandardowe menu o nazwie „Moje nowe menu” na pasku menu arkuszy Google. To menu będzie zawierało pozycję menu o nazwie „Mój pasek boczny-1”. Po kliknięciu tego elementu menu zostanie uruchomiona funkcja showAdminSidebar() (druga część kodu), a pasek boczny zostanie wyświetlony po prawej stronie okna arkusza Google.
Następnie musimy utworzyć plik HTML w edytorze skryptów, a następnie za pomocą tego pliku możesz utworzyć pasek boczny.
Aby utworzyć plik HTML, kliknij ikonę plusa (+) obok pozycji Pliki w edytorze Apps Script i wybierz „HTML”.
Spowoduje to utworzenie pliku HTML poniżej Code.gs. Zmień nazwę pliku na „Pasek boczny”. Ta nazwa powinna być taka sama jak ta dodana w funkcji showSidebar() (var html = HtmlService.createHtmlOutputFromFile('Sidebar')).
Napisz następujący kod w sekcji pliku Sidebar.html:
To jest mój nowy pasek boczny
Powyższy kod wyświetla ciąg tekstowy „To jest mój nowy pasek boczny” i przycisk „Zamknij”, który zamyka pasek boczny po kliknięciu.
Po zakończeniu pisania powyższego kodu w sekcji Sidebar.html powinien on zawierać następujący kod:
To jest mój nowy pasek boczny.
Zrzut ekranu:
Gdy skończysz wpisywać oba kody, zapisz projekt, klikając ikonę zapisywania na pasku narzędzi (patrz zrzut ekranu poniżej). Następnie uruchom funkcje, klikając ikonę „Uruchom”.
Niezależnie od tego, czy uruchomisz skrypt tutaj, czy wybierzesz element niestandardowego menu na pasku narzędzi arkuszy Google (po raz pierwszy), Google poprosi Cię o autoryzację uruchomienia skryptu. Ponieważ używasz niestandardowego widżetu innej firmy, Google poprosi o Twoją autoryzację. Po autoryzacji skryptu zostanie wyświetlony pasek boczny w arkuszu Google.
Jak autoryzować kod skryptu aplikacji w Google
Aby autoryzować swój skrypt niestandardowy, wykonaj następujące kroki:
Po uruchomieniu skryptu Google poprosi Cię o wybranie konta Google. Po jego wybraniu pojawi się małe wyskakujące okienko, w którym kliknij „Przejrzyj uprawnienia”.
Pojawi się kolejne wyskakujące okienko, tutaj wybierz „Pokaż zaawansowane” i kliknij „Przejdź do projektu bez tytułu (niebezpieczny)” (pokaże nazwę twojego projektu).
W następnym oknie kliknij „Zezwól”, a arkusz google uruchomi Twój skrypt.
Gdy to zrobisz, wróć do arkusza Google i odśwież go. Nowe niestandardowe menu (Moje nowe menu) zostanie dodane do paska narzędzi arkusza Google, który dodaliśmy za pomocą skryptu Code.gs. Kliknij „Moje nowe menu” i wybierz element menu „Mój pasek boczny 1”, aby wyświetlić pasek boczny.
Teraz Twój niestandardowy pasek boczny pojawi się po prawej stronie arkusza Google z tekstem i przyciskiem, który dodaliśmy (jak pokazano poniżej). Po kliknięciu przycisku pasek boczny zostanie zamknięty.
Cóż, teraz wiesz, jak zbudować własny pasek boczny w arkuszach Google.