embedding a google doc on weebly

14
Embedding a Google Doc On Weebly In the Weebly editor, drag an “EMBED CODE” tile (also known as widget) to where you want your work to be displayed on the page.

Upload: vandung

Post on 14-Feb-2017

243 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Embedding a Google Doc On Weebly

Embedding a Google Doc On Weebly        In the Weebly editor, drag an “EMBED CODE” tile (also known as widget) to where you want your work to be displayed on the page.   

  

Page 2: Embedding a Google Doc On Weebly

  From there, go to the file you want to display in your google drive.  

Page 3: Embedding a Google Doc On Weebly

  Right click on it, mouse over “Open With” in the drop down menu, and select (See list below)  

● In the case of a power points use google slides,   

● Docs and PDFs use google docs (The embed code it gives you can be problematic there is more on this at later) 

 ● Spreadsheets use Google Sheets (The embed code it gives you can be problematic 

there is more on this at later)  

Page 4: Embedding a Google Doc On Weebly

  With the file open in google doc click on “File” and in the dropdown menu click on “Publish to web”   

Page 5: Embedding a Google Doc On Weebly

  When the “Publish to Web” box appears in the middle of the screen, click on the “Embed” tab, from there you have a few options based on the file type, with a power point presentation you have the option to change the size and play speed of the display.  

Page 6: Embedding a Google Doc On Weebly

  Click Publish and “OK” the confirmation.  

Page 7: Embedding a Google Doc On Weebly

   After that a box full of code (gibberish) will appear on the “Publish to the Web” box.  Copy that text.   

Page 8: Embedding a Google Doc On Weebly

    

  

Page 9: Embedding a Google Doc On Weebly

Go back to your weebly page (with the embed code widget placed on the page) click on the box (it may say “Click to set custom HTML”) and, in the box that appears, click on the blue “Edit Custom HTML.”   

  Paste the text (code) that you got from the earlier google drive “Publish to the Web” steps.  

Page 10: Embedding a Google Doc On Weebly

  Click off (deselect) the box and your document should appear!!!  

Page 11: Embedding a Google Doc On Weebly

  Problem? Does your document look like this?  

Page 12: Embedding a Google Doc On Weebly

  Easy Fix!  Click on the “Edit Custome HTML” buton again then at the end of the code replace ></iframe> with this code   

● frameborder="0" width="960" height="1240" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe> 

 

Page 13: Embedding a Google Doc On Weebly

 Like this.

  Deselect and there you go!  

Page 14: Embedding a Google Doc On Weebly