Laura Gibbs

Google Sheets for Content Management

Blog Post created by Laura Gibbs on Apr 30, 2017

Since I'm presenting on javsacripts this week (Laura's Widget Warehouse: Canvas-Friendly Javascripts ) I thought I would write a blog post today about the process I follow for updating a javascript widget using a spreadsheet. When I have a project that is ongoing, so that I am adding new content regularly, keeping that content in a spreadsheet is the way I know what is new and when I need to update the widget. Since I feel comfortable writing my own HTML, I actually use the spreadsheet to generate the HTML table to create the widget.

 

That all sounds more complicated than it is, and the process just take a few minutes. Here's how it works for the Growth Mindset Quotes from my students. You can see those quotes at this Padlet: Growth MindsetI've embedded it in my Growth Mindset Canvas course here:

Padlet: Exploring Growth Mindset 

 

padlet screenshot

 

My goal is to add about 10 quotes each week from my students' blogs, and then I update the widget periodically; the widget is what randomly displays these quotes in the sidebar of my class blogs. More about how/why I made the widget here:

Randomization for Content Re-Use 

 

This is the spreadsheet part of the story:

 

1. I have a spreadsheet with two content columns, one column contains the all-caps label for the quote, and the other contains the quote itself. When I paste the quotes from my students' blogs into the Padlet, I also paste them into a new row in the spreadsheet.

 

2. The spreadsheet has three columns for tracking: padlet, widget, and cat. I put "padlet" in the column as I create each new row after having pasted the quote into the Padlet. Then, later on, when I update the widget, I will fill "widget" in that column. Eventually, if I make a Growth Mindset Cat using one of the quotes, I put a "cat" in that column. I'm having fun making cats with these quotes!

 

3. Finally the spreadsheet has three columns with HTML snippets. These are what turn the quotes into HTML content in the actual table.

 

spreadsheet screenshot

 

So, when I go to update the script, I just copy-and-paste the five columns (two with content, three with HTML snippets) into the HTML file that I have in my webspace; I can just paste that in without any formatting; the extra tabs that come from the spreadsheet don't make any difference. Here's what the table looks like; it's not pretty, but that doesn't matter; no one ever sees this table — I just use it to get the content into the script:

http://widgets.lauragibbs.net/growthquotes/oustudents.html 

 

So, I then download that file, convert it with Rotate Content to a javascript, and upload the javascript (replacing the old version). 

 

Rotate Content screenshot

 

All done! The widget is updated, and my spreadsheet lets me know that all the quotes are now in the widget.

 

Using the spreadsheet is very convenient because it allows me to keep track of my workflow (Padlet, Widget, Cats) while also automatically generating the HTML table that I need to re-create the widget periodically, updating it with new quotes. :-)

 

You can see the quote randomizing widget in this Canvas course page:

Random Quotes: Exploring Growth Mindset 

 

If you have a minute, take a look at some random quotes. I find them really inspiring, and I am excited to have this widget in place at the beginning of the Fall semester so that I can start gathering student quotes to add to it right from the very beginning of the semester.

 

padlet quotes screenshot

 

Outcomes