Skip to content

Instantly share code, notes, and snippets.

@kurtkaiser
Created February 13, 2019 21:00
Show Gist options
  • Save kurtkaiser/981ebfd23554b9d50d38a2df0fd0e489 to your computer and use it in GitHub Desktop.
Save kurtkaiser/981ebfd23554b9d50d38a2df0fd0e489 to your computer and use it in GitHub Desktop.
This code creates a sidebar in Google Apps Script, I wrote it as part of a tutorial video I filmed.
// Kurt Kaiser
// kurtkaiser.us
// Pretty Sidebar
// All rights reserved, 2019
function onOpen() {
var ui = SpreadsheetApp.getUi();
ui.createMenu('Tadah')
.addItem('Show Sidebar', 'showSidebar')
.addToUi();
}
function showSidebar(){
var html = HtmlService.createHtmlOutputFromFile('Sidebar');
SpreadsheetApp.getUi().showSidebar(html);
}
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: lightgreen;
}
div {
width: 90%;
border-style: double;
border-width: 2px;
border-color: blue;
margin-top: 5px;
/*right left set to auto centers content */
margin-left: auto;
margin-right: auto;
padding: 3px;
background-color: lightblue;
}
h1 {
text-align: center;
}
</style>
</head>
<body>
<div>
<h1> Hello World</h1>
</div>
<div>
<p> This is information the user should know. Right user? You should know this stuff by now. You do? Great.
This is information the user should know. Right user? You should know this stuff by now. You do? Great.</p>
</div>
<div>
<h1> Sidebar Video</h1>
</div>
<div>
<p> This is information the user should know. Right user? You should know this stuff by now. You do? Great.
This is information the user should know. Right user? You should know this stuff by now. You do? Great.</p>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment