Steegle logo

Awesome Table Gadget - classic Google Sites

Display awesome tables in your Google Site with this gadget from Google Apps Script Top Contributor and Google Gadget guru Romain Vialard.

For new Google Sites make your Awesome Table get the embed URL and add to your new Google Site - see: Insert websites and Apps Scripts using iFrames

Instructions

  1. Open a Google Sheet (Google Drive Spreadsheet), or make a new one, and on the first row define titles for each column.

  2. On the second row of your Google Sheet add filters you want to display in the table.

  3. Share the Google Sheet with those who need to see it. If you want to add the table to a public site make sure you share the sheet as either Anyone with the link or Public. If you do not want the public to see the table just share with the people who you want to see it.

  4. Go to your site and edit the page where you want the gadget to appear

  5. Use the Insert menu, then More Gadgets... and then use the Add by URL link

  6. In the Add gadget by URL box enter this url http://goo.gl/ZmMP7

  7. Add the minimum required information needed for the gadget to work:

    • Spreadsheet key - the long set of numbers and letters Google Drive gives to your specific spreadsheet

    • Spreadsheet name - the name of the sheet in your spreadsheet you want to get the data from

    • Spreadsheet range - the cell range from the spreadsheet where the data lives, including the title and filter rows.

    • Number of items to display - how many rows you initially want to appear on the table, the rest will display on separate pages.

  8. If you want to use this gadget to track file downloads you can do this by:

    • In one of the cells in your spreadsheet add a column to add the HTML to link to the file and track downloads, e.g.

<a href="URL-to-your-file" onclick="ga('send', 'pageview', 'URL-to-track');">Link Text</a>

    • Where URL-to-your-file is the full web address of the file you want your viewers to download (e.g. a file uploaded to your site or in Google Drive) and URL-to-track is the partial URL you want to appear recorded in Google Analytics: for example you want your viewers to download http://www.example.com/files/download.zip so make this

    • URL-to-your-file and make

    • URL-to-track /files/download.zip

<a href="http://www.example.com/files/download.zip" onclick="ga('send', 'pageview', '/files/download.zip'])">Link Text</a>

    • In the gadget make sure you specify your Google Analytics Tracking ID in the Google Analytics tracking code box.

  1. Choose how you want the table to appear by setting the Width, Height and whether you want a title and border.

  2. Use the OK button to add the gadget to the page and the Save button to save the page and display your page with the table.

Acknowledgements

Many thanks to Romain who is a Google Apps Script Top Contributor and has worked very hard on this gadget.

Screenshots

(click for larger images)

Google Sites - Insert - More gadgets...

Google Sites - Add Gadget by URL

Awesome Table Gadget Properties

Awesome Tables Video Demonstration

Feedback

Please let us know if this article helped or if you know of of any improvements.

Keep up-to-date

Join the Sites Update Group on the Google Sites Classic Comparison to get email notifications about New Google Sites updates.

Newsletter

Subscribe to our newsletter for emails about all things Steegle.com