Google Integration Course

System Preferences

Very soon we hope to have some news for you about Google integration with FrogLearn, but if you can wait and want to embed a Google folder, you can already do this using the HTML widget.

 

Step 1

 

Create a folder in Google.   Set the sharing settings to the level you wish.   If you do not set the access to Anyone with a link, you should probably include a link on your Frog page to your Google SSO in order to allow users to quickly gain access.

Add the files you want to view to this folder (their sharing settings will be set to the same as the folder) unless you change them

 

Step 2

Copy the web address of the folder.

 

Capture1.PNG

Step 3

 

In your Frog page, add in an HTML widget HTML.pngand add in the following code:

<iframe frameborder="0" style="width:660px; height:220px; overflow-x:hidden;" src="your_modified_url" ></iframe>

 

The code required for your_modified_url is not the web address of your folder.  We need to modify it slightly.  We want the unique ID at the end of the web address.  In the example I'm using, it's the section in red:

 

https://drive.google.com/drive/u/0/folders/0B4-LF_moG8y7Ty1EREtSNkMyNXM

 

We need to modify the following address, adding the code to the section id=

 

https://drive.google.com/embeddedfolderview?hl=en&amp;id=0B4-LF_moG8y7Ty1EREtSNkMyNXM#list

 

So, our end result looks like:

 

<iframe frameborder="0" style="width:660px; height:220px; overflow-x:hidden;" src="https://drive.google.com/embeddedfolderview?hl=en&amp;id=0B4-LF_moG8y7Ty1EREtSNkMyNXM#list" ></iframe>