En sidofält är ett användargränssnittselement (ett litet vertikalt område) som visas antingen till vänster eller höger om det större fönstret eller på användarskärmen för att visa relaterad information eller en lista med val eller navigeringsalternativ.
Sidofältet i Google Sheets är en användargränssnittspanel som visas på höger sida av Google Sheets. Google tillhandahåller en inbyggd skriptredigerare som heter Apps Script som kan skapa olika tillägg och element för G-Suite-applikationer. Den kan också användas för att bygga dina egna anpassade sidofält i Google Sheets.
Den här artikeln visar hur du skapar ett anpassat sidofält i Google Kalkylark med hjälp av Google Apps Script-redigerare.
Skapa en sidofält i Google Sheets med Apps Script
Om du vill skapa ett anpassat sidofält måste du ange och köra viss kod i Apps Script-redigeraren. Sedan kan du bygga dina egna widgets i sidofältet med HTML-, CSS- och Javascript-koder.
Öppna först Google-ark. Klicka på "Verktyg" i Google-kalkylarksmenyn och välj "Skriptredigerare".
Det öppnar Apps Script-redigeraren i en ny flik i din webbläsare där du kan skriva din användargränssnittskod.
Skriv följande kod på sidan Code.gs:
function onOpen() { SpreadsheetApp.getUi() .createMenu('Min nya meny') .addItem('My sidebar 1', 'showSidebar') .addToUi(); } function showSidebar() { var html = HtmlService.createHtmlOutputFromFile('Sidebar') .setTitle('Calculation Sidebar'); SpreadsheetApp.getUi() .showSidebar(html); }
I ovanstående Code.gs-skriptkod skapar OnOpen()-funktionen en anpassad meny som heter "Min nya meny" i menyraden i Google Sheets. Den menyn kommer att innehålla ett menyalternativ som heter "My sidebar-1". När du klickar på det här menyalternativet kommer funktionen showAdminSidebar() (den andra delen av koden) att köras och sidofältet kommer att visas till höger i Google-arkfönstret.
Därefter måste vi skapa en HTML-fil i Skriptredigeraren, och sedan med den här filen kan du skapa sidofältet.
För att skapa HTML-filen klickar du på plusikonen (+) bredvid Filer i Apps Script-redigerare och väljer "HTML".
Detta skapar en HTML-fil under Code.gs. Byt namn på filen till "Sidofält". Detta namn bör vara detsamma som det som läggs till i funktionen showSidebar() (var html = HtmlService.createHtmlOutputFromFile(‘Sidebar’)).
Skriv följande kod i sektionen av filen Sidebar.html:
Det här är min nya Sidebar
Ovanstående kod visar textsträngen "Detta är min nya sidofält" och "Stäng"-knappen som stänger sidofältet när du klickar på det.
När du har skrivit koden ovan i avsnittet Sidebar.html bör den innehålla följande kod:
Det här är min nya Sidebar.
Skärmdumpen:
När du är klar med att ange båda koderna sparar du projektet genom att klicka på spara-ikonen i verktygsfältet (se skärmdumpen nedan). Kör sedan funktionerna genom att klicka på ikonen "Kör".
Oavsett om du kör skriptet här eller om du väljer det anpassade menyalternativet i Google Sheets verktygsfält (för första gången), kommer Google att be dig godkänna att skriptet körs. Eftersom du kör en anpassad widget från tredje part kommer Google att begära din auktorisering. När du godkänner skriptet kommer det att visa sidofältet i ditt Google-ark.
Hur man auktoriserar Apps Script Code i Google
Följ dessa steg för att auktorisera ditt anpassade skript:
När du har kört skriptet kommer Google att be dig välja ditt Google-konto. När du har valt det kommer ett litet popup-fönster att visas där du klickar på "Granska behörigheter".
Ett annat popup-fönster kommer att dyka upp, välj här "Visa avancerat" och klicka på "Gå till namnlöst projekt (osäkert)" (det kommer att visa ditt projektnamn).
I nästa fönster klickar du på "Tillåt" så kör Google Sheet ditt skript.
När du har gjort det, gå tillbaka till ditt Google-ark och uppdatera det. Den nya anpassade menyn (Min nya meny) kommer att läggas till i ditt Google-arkverktygsfält, som vi lade till genom Code.gs-skriptet. Klicka på "Min nya meny" och välj menyalternativet "Min sidofält 1" för att visa sidofältet.
Nu kommer ditt anpassade sidofält att dyka upp på höger sida av ditt Google-ark med texten och knappen vi lade till (som visas nedan). När du klickar på knappen stängs sidofältet.
Nåväl, nu vet du hur du bygger din egen sidofält i Google Sheets.