Pull data from a Google Spreadsheet to Hype

Elements
4

First the spread sheet entries need to be like this

42
Screen Shot 2018-03-13 at 01.27.42.JPG1162×236 31.1 KB

1, Go to file->publish to web.

2, Publish the doc.

Ignore any new link you get.

Use the ID in the original link (NOT the Publiish to web one )in the javascript code to get the json.

So an example of one like yours would be.

After publishing (NOT SHARING)

I have the original link from the address bar.

https://docs.google.com/spreadsheets/d/1sOyd9OXBmAmUkMThzuyIVDNkWfFoS-F_1wOeSyeQ8Oo/edit#gid=0

We take the ID “1sOyd9OXBmAmUkMThzuyIVDNkWfFoS-F_1wOeSyeQ8Oo” and use it in the code like this:

"https://spreadsheets.google.com/feeds/list/1sOyd9OXBmAmUkMThzuyIVDNkWfFoS-F_1wOeSyeQ8Oo/od6/public/values?alt=json"

The code

    $.getJSON("https://spreadsheets.google.com/feeds/list/1sOyd9OXBmAmUkMThzuyIVDNkWfFoS-F_1wOeSyeQ8Oo/od6/public/values?alt=json", function(data) { 
console.log( data); //You can see all entries and there item codes// 
// --> 
 
 	console.log(data.feed.entry[0].gsx$heading.$t );
  console.log(data.feed.entry[0].gsx$subheading.$t );
  console.log(data.feed.entry[0].gsx$cta.$t );
  
  
  var heading = hypeDocument.getElementById('heading').innerHTML = data.feed.entry[0].gsx$heading.$t
  var subheading = hypeDocument.getElementById('subheading').innerHTML = data.feed.entry[0].gsx$subheading.$t
   var cta = hypeDocument.getElementById('cta').innerHTML = data.feed.entry[0].gsx$cta.$t
  });

580x500-gsheet_MHv1.hype.zip (52.7 KB)

7 Likes