Insert Google Product Gadgets on a Page

As part of the Google Apps product suite, Google Sites makes it very easy to embed other Google Apps products into your site. Because you are already logged in to your school Apps or your personal Google account while editing your site,Google will be able to pull any calendars, documents, spreadsheets, forms, or presentations, associated with your account.

In addition to the Apps products, you can also insert a Google Map or Picasa photos or photo albums with just a few clicks.

As always, you do not need to know any code to add these items to your site - Google has already done the coding for you with the gadgets.

You can get to any of these options by clicking on the Insert menu and browsing the gadgets listed under the Google heading.

Inserting Google files from your Google Drive

You can easily embed anything from your Google Drive in your Google account into your site including documents, presentations, spreadsheets, and forms.

When you embed something from Google Drive, any time you update something in Google Drive, the changes will be reflected on your site. This can prevent the need to update information in two places - in Drive and on your site.

For example, if you keep a course syllabus in Google Drive, it could be easier to embed that document directly into your site instead of copying and pasting the information. This way, if you ever need to make changes, the new information will automatically be updated on your site without you having to edit the site.

Note- that the files from your Google Drive will NOT inherit the visibility settings of the Google Site. E.g. if you have Google Document that is private but you want your students to also view it within your site, you need to change the sharing settings of that document and share it with each of your students or set the document's visilibity settings to Anyone with the Link.

Excellent video on how to embed a Google Doc:

To embed one of your Google Drive from your school Apps account on your page, follow these steps:

1. Make sure you are in editing mode on your page (if you see the Save or Cancel buttons, you are in editing mode, otherwise, click the Edit page button).
2. Place your cursor at the point on the page you want to insert your document/presentation/spreadsheet/form.
3. Click the Insert menu and select the Google Docs type from the menu: Document, Presentation, Spreadsheet, or Form.
4. The Insert window will display a list of all the types of Google products. The type you selected from the Insert menu will be selected and a list of the associated files will be shown on the right.

3. You can either click on the document you wish to insert, search for the document in the search box (and click Search) or paste in the web address of the Google Drive file.
4. Click Select.
5. You will then have some gadget display options to set:

1. Click Save.
2. The gadget will appear as a blank 'box' on your page. To see the gadget content, click the Save button in the top right.

Please note: Be sure that you're using the "Insert" function in order to embed objects. Cutting and pasting the embedding won't work as it will be stripped out.

You can change the settings of your Google Docs gadget at anytime, just follow these steps:

1. Make sure you are in editing mode on your page (if you see the Save or Cancel buttons, you are in editing mode, otherwise, click the Edit page button).
2. Click anywhere on the gadget box.
3. Click the Properties link that appears (look like the "gear" on the left side).

To remove a Google Docs gadget, follow these steps:

1. Make sure you are in editing mode on your page (if you see the Save or Cancel buttons, you are in editing mode, otherwise, click the Edit page button).
2. Click anywhere on the gadget box.
   1. Click on the "x" to the right of the Gadget Properties.

Your gadget will now be removed from your page.

Inserting a Google Docs Video

In a site, go to ‘Edit page,’ click on ‘Insert,’ scroll down to ‘Video,' and select ‘Docs video.' Choose a video stored in your Google Docs account from the pop up dialog.

**Make sure that your video is set to anyone with the link or public**

Inserting Google Spreadsheet Chart

Inserting a chart into a site is a helpful way to display data or information from a spreadsheet on your site. For example, you can insert an organizational chart to show your business' organizational structure or a geomap to show where your family members live.

Charts in sites display information from a Google spreadsheet. You can decide to choose between two modes Live and Snapshot to show the data.

1. Live provides you with dynamic charts. Whenever the chart is loaded in the Site, the chart will display the most recent data in the spreadsheet. This is very useful in cases when the spreadsheet data is updated manually or using a script.
2. Snapshot means just that. It’s a snapshot at a point in time, so the chart will store and display the exact same data, regardless of whether you make changes to the underlying data sheet.

To insert a chart into a site, follow these steps:

1. Open the site page you'd like to insert a chart into.
2. Click the edit page button.
3. Go to the Insert menu, and select Chart.
4. Select a spreadsheet from the list that contains the chart data you'd like to display.
5. If the spreadsheet already contains a chart, you can select the chart. This will be a snapshot of the spreadsheet chart, and the chart won't update if spreadsheet data is modified. To insert a chart that dynamically updates, open the charts editor and select the Live option.

1. If the spreadsheet doesn't already have a chart in it, enter a range of data. If you mark Live, the chart will update as spreadsheet data is modified. If you mark Snapshot, the chart won't update unless you manually do so. Learn more about creating a chart.
2. Once you've selected or created a chart, click OK.
3. On the next page, you can adjust the dimensions of the chart and change the title. When you've done so, click Save, and the chart will be inserted into the page.

Here are some tips and things to keep in mind:

1. When you're selecting a range of data to display in a chart, you can specify sheet names. For example, you could enter 'Sheet1!B12:F18'.
2. Anyone viewing your site can view a Snapshot chart. If you've selected Live updating for your chart, only people who have access to the spreadsheet will be able to view an updated version of the original chart.

Inserting a Google Calendar

You can embed any calendar from your school Apps calendar account on your Google Site.

This can be useful if you have set-up a class or homework calendar that you would like to include on a class site. Or if you are creating a school-wide site, it can be useful to include an academic/holiday calendar or a sports schedule calendar.

The Google Calendar gadget in Google Sites now also lets you add multiple calendars into a single gadget, so you can display a testing calendar, homework calendar, and school calendar all together.

View an example of a calendar embedded on a site- https://sites.google.com/a/aea267.k12.ia.us/schma3-duplicated/calendar-example

To embed one of your calendars from your school Apps account on your page, follow these steps:

1. Make sure you are in editing mode on your page (if you see the Save or Cancel buttons, you are in editing mode, otherwise, click the Edit page button).
2. Place your cursor at the point on the page you want to insert your document/presentation/spreadsheet/form.
3. Click the Insert menu and select the Google Calendar type from the drop down menu.
4. The Insert window will have a list of all the types of Google products. The Calendar type will already be selected from the Insert menu and a list of calendars associated with your school Apps account will appear on the right.
5. - The calendars in the list will include any of the calendars you have created or have owner access ('My calendars') or other calendars that you have added to your calendar to view ('Other calendars')

2. You can either click on the calendar you wish to insert, search for the calendar in the search box (and click Search) or paste in the web address of the Google Calendar.
3. Click Select.
4. To add another calendar to appear in the same gadget, click the Display another calendar link and select the second (or third, fourth) calendar from your calendar list.

2. Choose the options you want for your Calendar and click Save. (Width, height, view type, border, date range, etc.)

2. The gadget will appear as a blank 'box' on your page. To see the gadget content, click the Save button in the top right.

Please note: You'll need to make sure that the calendar is shared with the members of your site in order to avoid an Insufficient Privileges error.

Inserting Google Maps

Embedding a Google Map into your Google Site and sharing it with anyone at your school is easy, just follow these steps:

1. Make sure you are in editing mode on your page (if you see the Save or Cancel buttons, you are in editing mode, otherwise, click the Edit page button).
2. Click the Insert menu and select Map. A window with a map appears.
3. Type in an address or location in the search box and hit return or enter.

2. Your location appears in the map, marked with a red placemark.

2. Inside the map, there are two options you can select: map or satellite map. Click one, then click Select.
3. Please note: if you have an existing Google Map you'd like to add, simply add the link to the box below the map and click Select.
4. In the next window that appears, you can add a title to the map, choose to display a border around the map, or change its size.

2. Click Save at the bottom of the window after selecting your options.
3. The map gadget will appear as a blank 'box' on your page. Click Save again at the top of the page to save all your changes and view the map gadget.

Inserting Picasa photos or albums

You can embed an album or individual photos from Picasa. You can add a URL from any Picasa account, it does not need to be associated with your school Apps account. In fact, you can include an album from someone else entirely provided they have given you or the public access to the photo/album.

Link to Picasa Web Albums - https://picasaweb.google.com

To insert a Picasa web album on your page, follow these steps:

1. Make sure you are in editing mode on your page (if you see the Save or Cancel buttons, you are in editing mode, otherwise, click the Edit page button).
2. Click Insert and select Picasa Web slideshow.

1. Select the name of the album that you would like to display as a slideshow and click on Select

1. Select the the options for the slideshow:

1. Click Save.
2. The Picasa album gadget will appear as a blank 'box' on your page. Click Save again at the top of the page to save all your changes and view the slideshow gadget.

Edit and position gadgets on a page

After you insert a gadget on your page, a small window will appear anytime you click on the gadget while in editing mode.

The options are:

1. Properties: Modify the settings of your gadget including the main content selection (associated file/map/URL) and the display options of the gadget
2. Align: This allows you to choose if you'd like to have the gadget appear on the Left, Center, or Right side of the page.
3. Wrap: This allows you to wrap content around your gadget. By default this is turned off, but if you'd like to have text or other gadgets appear next to each other, you'll need to turn the wrap on.
4. The combination of Align and Wrap can allow you to have 2 gadgets side by side: select one gadget as aligned Left with wrap on, then another gadget aligned right with wrap on. You can drag the second so that the cursor appears alongside the first gadget. Then the gadgets will appear side by side.

Please note: If you would like gadgets to appear side by side, you will need to adjust the gadget's width setting from Properties.