Embedding on a Google Site

Embedding into a Google Site is also fairly simple. There are two ways you can do this:

1. Copy/Paste iFrame directly into the HTML

Step 1: Show HTML source for your page

When you are editing your Google site, to the far right of the control menu is an "html" button for toggling directly into the html code.

Step 2: Edit HTML Pop-up

Now you should see an "Edit HTML" pop-up for entering your embed code.

Step 3: Go to the Embed Codes dialog and Copy Code

Step 3: Go to the Embed Codes dialog and Copy Code

Either click on the code in the Embed Code text box and copy or just click the Copy Code button.

Step 4: Paste the embed code into the Edit HTML pop-up.

Step 5: Update and Save

You should now be able to see a preview of your site!

Warning: your code will now be unrecognizable!!

If you go back to edit your site, Google will have messed with your code, as you can see above.  So, sometimes it's better to use the native Gadget UI instead of trying to edit the HTML (see below).

2. Insert a Google Gadget

Step 1: Go to Insert >> More Gadgets...

Step 1: Go to Insert >> More Gadgets...

Step 2: Select Include gadget (iFrame)

Step 3: Look at your Embed Codes dialog

Step 3: Look at your Embed Codes dialog

You will have to dissect the code in the Embed Code box to configure the Gadget. Copy only src section.

Step 4: Configure the Gadget

Step 4: Configure the Gadget

Click OK and Save and again you should be good to go!

0 Comments

Add your comment

E-Mail me when someone replies to this comment