Paano Gumawa ng Sidebar sa Google Sheets

Ang sidebar ay isang elemento ng user interface (isang maliit na vertical na lugar) na lumilitaw sa kaliwa o kanan ng mas malaking window o sa screen ng user upang ipakita ang kaugnay na impormasyon o isang listahan ng mga pagpipilian o opsyon sa pag-navigate.

Ang sidebar sa Google sheets ay isang user interface panel na ipinapakita sa kanang bahagi ng Google Sheets. Nagbibigay ang Google ng in-built na script editor na tinatawag na Apps Script na maaaring lumikha ng iba't ibang mga add-on at elemento para sa mga G-Suite na application. Magagamit din ito para sa pagbuo ng sarili mong mga custom na sidebar sa Google sheets.

Ipapakita sa iyo ng artikulong ito kung paano gumawa ng custom na sidebar sa Google Sheets gamit ang Google Apps Script editor.

Paggawa ng SideBar sa Google Sheets gamit ang Apps Script

Kung gusto mong gumawa ng custom na sidebar, kailangan mong ilagay at patakbuhin ang ilang code sa editor ng Apps Script. Pagkatapos ay maaari kang bumuo ng iyong sariling mga widget sa loob ng sidebar gamit ang HTML, CSS, at Javascript code.

Una, buksan ang Google sheets. Sa menu ng Google sheets, i-click ang ‘Tools’ at piliin ang ‘Script editor’.

Bubuksan nito ang editor ng Apps Script sa isang bagong tab ng iyong browser kung saan maaari mong isulat ang iyong user interface code.

Isulat ang sumusunod na code sa pahina ng Code.gs:

function onOpen() { SpreadsheetApp.getUi() .createMenu('My New Menu') .addItem('My sidebar 1', 'showSidebar') .addToUi(); } function showSidebar() { var html = HtmlService.createHtmlOutputFromFile('Sidebar') .setTitle('Calculation Sidebar'); SpreadsheetApp.getUi() .showSidebar(html); }

Sa Code.gs script code sa itaas, ang OnOpen() function ay gumagawa ng custom na menu na tinatawag na ‘My New Menu’ sa google sheets menu bar. Ang menu na iyon ay maglalaman ng menu item na tinatawag na 'My sidebar-1'. Kapag na-click mo ang menu item na ito, ang showAdminSidebar() function (ang pangalawang bahagi ng code) ay tatakbo at ang sidebar ay ipapakita sa kanang bahagi ng Google sheet window.

Susunod, kailangan naming lumikha ng HTML file sa Script editor, at pagkatapos ay sa file na ito, maaari kang lumikha ng sidebar.

Upang gawin ang HTML file, i-click ang plus (+) na icon sa tabi ng Files in Apps Script editor at piliin ang ‘HTML’.

Gagawa ito ng HTML file sa ibaba ng Code.gs. Palitan ang pangalan ng file bilang 'Sidebar'. Ang pangalang ito ay dapat na kapareho ng idinagdag sa showSidebar() function (var html = HtmlService.createHtmlOutputFromFile('Sidebar')).

Isulat ang sumusunod na code sa loob ng seksyon ng Sidebar.html file:

Ito ang aking bagong Sidebar

Ang code sa itaas ay nagpapakita ng text string na 'This is my new Sidebar' at 'Close' na button na nagsasara sa sidebar kapag na-click dito.

Pagkatapos mong isulat ang code sa itaas sa seksyon ng Sidebar.html, dapat itong maglaman ng sumusunod na code:

Ito ang aking bagong Sidebar.

Ang screenshot:

Kapag tapos ka nang maglagay ng parehong code, i-save ang proyekto sa pamamagitan ng pag-click sa icon ng save sa toolbar (tingnan ang screenshot sa ibaba). Pagkatapos ay patakbuhin ang mga function sa pamamagitan ng pag-click sa icon na 'Run'.

Patakbuhin mo man ang script dito o pipiliin mo ang custom na item ng menu sa toolbar ng Google sheets (sa unang pagkakataon), hihilingin sa iyo ng Google na pahintulutan ang script na tumakbo. Dahil nagpapatakbo ka ng custom na widget ng third-party, hihilingin ng google ang iyong pahintulot. Kapag pinahintulutan mo ang script, ipapakita nito ang sidebar sa loob ng iyong Google sheet.

Paano Pahintulutan ang Apps Script Code sa Google

Upang pahintulutan ang iyong custom na script sundin ang mga hakbang na ito:

Sa sandaling patakbuhin mo ang script, hihilingin sa iyo ng Google na piliin ang iyong google account. Pagkatapos mong piliin ito, may lalabas na maliit na pop-up, sa pag-click na iyon sa ‘Review permissions’.

Lalabas ang isa pang pop-up, dito piliin ang ‘Show Advanced’ at i-click ang ‘Go to Untitled project (unsafe)’ (Ipapakita nito ang pangalan ng iyong project).

Sa susunod na window, i-click ang 'Allow' at ipapatakbo ng google sheet ang iyong script.

Kapag nagawa mo na iyon, bumalik sa iyong Google sheet at i-refresh ito. Ang bagong custom na menu (My New Menu) ay idaragdag sa iyong Google sheet toolbar, na idinagdag namin sa pamamagitan ng Code.gs script. I-click ang ‘My New Menu’ at piliin ang menu item ‘My sidebar 1’ para ipakita ang sidebar.

Ngayon ay lalabas ang iyong custom na sidebar sa kanang bahagi ng iyong google sheet kasama ang text at ang button na idinagdag namin (tulad ng ipinapakita sa ibaba). Kapag na-click mo ang button, isasara ang sidebar.

Well, ngayon alam mo na kung paano bumuo ng iyong sariling sidebar sa Google sheets.