Embed Google Drive Folders

Sometimes there are things that I just assume no one else will want to use but I’m beginning to realise some of them might be useful. This is one of those.

For this to work you need to have a google account (free), FrogLearn (not free) and the HTML widget enabled on your platform (free – just call service desk to enable it).

Step one – Load Google drive and create a folder (this folder needs to be shared so that others can see the contents)

Step two – Add your files to the folder (an obvious step but if there are no files in the folder you won’t know if it’s working or not)

Step 3 – Find the folder iD (from the main Google drive overview find the folder then click the ‘i’ that appears when you hover over it. At the end of the url you will find the id. Copy everything after id=)

Step four – Add your folder id to this embed code replacing the ‘ADD ID HERE’ text

<iframe src=”https://drive.google.com/embeddedfolderview?id=ADD ID HERE#list” width=”“100%” height=”400″ frameborder=”0″></iframe>

Step 5 –Add a HTML widget to a Frog site or dashboard and paste the code above into the box in the content panel (to load the content panel click edit, add the widget to the page and click on the widget)

Step 6 – Save and exit edit mode.

Bonus step – To change to a grid view of the folder, change the #list part of the code above to #grid


You may also like...

2 Responses

Leave a Reply

Your email address will not be published. Required fields are marked *