Google Sites: Help and Instructions to Customize Your Site

Google+ Facebook Twitter Addthis
Basics
Gadgets
Images
Links
Web Design and Templates
Tech for Educators

Recent Posts
  • Add Pinterest Button You can add a variety of buttons, including Pinterest Pin it, using AddThis. If you haven't already, create an AddThis account before starting. Sign in to Addthis.comSelect ...
    Posted Aug 8, 2015, 12:39 PM by Julie Sharma
  • Link to Word/Excel files To link to a Word/Excel/PowerPoint file, either upload the file directly to a page as an attachment, or upload the file to Google Drive and convert it to ...
    Posted Aug 19, 2015, 8:03 PM by Julie Sharma
  • Link to iTunes To create a link to specific content on iTunes,  go to iTunes linkmaker.  search for the material you want using the search tool when you find the content you want ...
    Posted Aug 8, 2015, 12:40 PM by Julie Sharma
  • RSS feed subscription When you choose the "announcements" type for your page template (more), you can allow visitors to subscribe to your posts through an RSS reader and/or through email. The built ...
    Posted Aug 13, 2015, 7:14 PM by Julie Sharma
  • Add Twitter button You can use the gadget described here to add a variety of button types, FAQ Can I reuse one button on many pages? Once you've created the Tweet button ...
    Posted Apr 30, 2015, 8:44 PM by Julie Sharma
Showing posts 1 - 5 of 11. View more »
The gadget spec URL could not be found

Add Pinterest Button

posted Sep 19, 2012, 3:32 PM by Julie Sharma   [ updated Aug 8, 2015, 12:39 PM ]


You can add a variety of buttons, including Pinterest Pin it, using AddThis. If you haven't already, create an AddThis account before starting.
The gadget spec URL could not be found
  1. Sign in to Addthis.com
  2. Select Tools (top left)
  3. Select Newsletter Sharing Buttons
  4. Paste/type page URL of the page you're adding the button to and page title in the boxes
  5. Under Services, from Available Service select Pinterest Pin It and drag it to under Selected Services. Add or remove any other services as desired
  6. Select the text in the Get the Code section and copy it
  7. On the page you want the button while in edit mode, type PASTE HERE where you would like the buttons
  8. Select <HTML> to access HTML mode
  9. Find where you typed PASTE HERE and paste the code (copied in step 6) over the words PASTE HERE
  10. Select Update and then Save to save and view your changes.
Google+ Facebook Twitter Addthis

Link to Word/Excel files

posted Aug 25, 2012, 7:38 PM by Julie Sharma   [ updated Aug 19, 2015, 8:03 PM ]

word
To link to a Word/Excel/PowerPoint file, either upload the file directly to a page as an attachment, or upload the file to Google Drive and convert it to Google format. Then, embed the file using the the Insert > Google Drive options.

FAQs

I added a Google Drive item to my website and I can see it, but visitors say they cannot see the item. Why?
Everything stored in Google Drive, by default, is generally private so only you can access those items, so be sure you've shared the item with your website users/visitors so they can see it. 

Add a File As an Attachment to a Page 

Enable page attachments and then add downloadable, version-able files to the bottom of pages
file attached

Embed a Word File in a Webpage

  1. Upload the file to Google Drive
  2. Convert the file to Google format (Word files become Documents, Excel files become Spreadsheets, PowerPoints become Presentations)
  3. Share the file with those will be accessing your site (if your site is public, make the file public on the web, too)
  4. Sign in to your Google Site at sites.google.com
  5. Select the pencil (top right) to access edit mode for the site
  6. Select <HTML> to edit the html
    Insert &gt; Drive &gt; Documents
  7. Select Insert > Drive and then choose the type of file (Word files became Documents, Excel files became Spreadsheets, PowerPoints became Presentations
  8. Select the item to insert and click Select
  9. Choose whether to have a border and/or include a title; set height and (optional) width. If you're not sure what options to select, leave the options as they are; you can always come back and change these settings. Select Save.
  10. Select Save (top right) to save and view changes
  11. To modify settings, while in edit mode, select the Drive item (which in edit mode appears as a gray box) and then select the gear icon from the toolbar that appears. That will open the same options from step 9. Change options as desired and select Save and then Save again to view changes.

The gadget spec URL could not be found

Add a Link to a File

Alternatively, you could simply make text (or an image) on your website a link to the file stored in Google Drive. As above, upload the file to Google Drive (Be sure the sharing/visibility options are set correctly), and then get the link to share the file
  1. Select the pencil to edit the site
  2. Type the text you want to be the hyperlink (for example, "See the .doc file here")
  3. Select/highlight that text
  4. Click on the link icon in the toolbar
  5. In the pop up box, click on Web address (on the left)
  6. Paste the sharing link for the file (copied above) into the Link to the URL box
  7. Select OK 
  8. Select Save to save and view changes 
Google+ Facebook Twitter Addthis

Link to iTunes

posted Apr 7, 2012, 7:24 AM by Julie Sharma   [ updated Aug 8, 2015, 12:40 PM ]


iTunes download button
To create a link to specific content on iTunes, 
  1. go to iTunes linkmaker
  2. search for the material you want using the search tool
  3. when you find the content you want to link to, click on "Album Link" or "Song Link" or "Video Link" etc. on the right side
  4. in the box the appears, choose and click on the circle next to "small button" "large button" or "text only" (note: when you click on each choice, you will see a sample in bottom of box of what your link will look like. The button pictured above is the "large button" choice)
    The gadget spec URL could not be found
  5. copy the the text from the box, something like this:

    <a href="http://itunes.apple.com/us/album/strauss-ariadne-auf-naxos/id62435959?uo=4" target="itunes_store"><img src="http://r.mzstatic.com/images/web/linkmaker/badge_itunes-lrg.gif" alt="Strauss: Ariadne Auf Naxos - Edita Gruberova, Gewandhausorchester Leipzig, Jessye Norman, Julia Varady, Kurt Masur, Olaf Bär & Paul Frey" style="border: 0;"/></a>

  6. go to the Google Site where you want to have the link and be sure you are signed in
  7. click on the pencil
  8. in the section of the page where you want the link, type  PASTE ITUNES LINK HERE
  9. click on <HTML> (while in that same section of page)
  10. search the html for "PASTE ITUNES LINK HERE"
  11. remove the PASTE ITUNES LINK HERE and paste over it the content you copied in step 5
  12. click "Update"
  13. click "Save" to save and view changes
  14. test your new link to be sure it works as you wanted

View Related Posts


Facebook Twitter Google+ Addthis

RSS feed subscription

posted Apr 4, 2012, 5:56 AM by Julie Sharma   [ updated Aug 13, 2015, 7:14 PM ]


When you choose the "announcements" type for your page template (more), you can allow visitors to subscribe to your posts through an RSS reader and/or through email.
The built-in "Subscribe to posts" option works in some browser settings but not all, so you can add email and/or RSS feed options* to allow access to more visitors. (However, as of 6/9/2012, you cannot get rid of the built-in "Subscribe to posts" button from public sites).

Note

If you are creating a site through a Google Apps domain (if you see a/domainname in the URL of your site, you are on a domain), you may receive an error around step 8. This is especially true if your domain set up doesn't allow required services like Google Feedburner. If you receive this error, test the default "subscribe to posts"; you might find that the default button works for you. Find more information here.

Alternatively, instead of Feedburner, try using MailChimp's RSS Feed to email; create a free account, copy the your webpage's feed URL (step 6 below), and then in MailChimp, create a new Campaign > RSS-Driven Campaign.

The gadget spec URL could not be found

Start:

First, set up the feed (for both RSS reader and email)
  1. be sure you are signed in to Google Sites
     
  2. go to your webpage that is announcements style
     
  3. find the section of your page with the new post button and "subscribe to posts" link (note: this option may only be visible once your site is public)

  4. subscribe to posts screenshot
  5. click on "Subscribe to posts" 
     
  6. a tab/window should open (note: the page might say "Page not found", but that's fine--you simply need the address/URL), and the webpage's address should be the webpage's address with .xml at the end, for example 

    https://sites.google.com/site/siteshelphowtos/google-sites-instructions/Basics/posts.xml

  7. copy that URL but DO NOT COPY https://  So you should copy something like this:

    sites.google.com/site/siteshelphowtos/google-sites-instructions/Basics/posts.xml

  8. in a separate window/tab go to Google Feedburner (as it's also a Google product, you should be automatically signed in (you should see your google email in top-right corner))
     
  9. in the box marked "Burn a feed right this instant" paste the URL from step 6 (without the https:// or http://) and click next
     
  10. on the following screen, you can alter the "Feed Title" (be sure it has a name you will remember so you know which webpage it is associated with) or simply click "Next"
     
  11. on the following page, click on "Skip directly to feed management" (in small letters by "Next")
     
  12. follow the steps below to set up subscription through   and/or 

The gadget spec URL could not be found

RSS reader

  1. complete steps 1-11 above
     
  2. on your Feedburner page, in the top row of navigation tabs, click on "Publicize"
     
  3. on the left side, click on "Chicklet Chooser"
     
  4. scroll to the bottom of the page and copy the code in box marked "Copy the HTML below for use in your own page templates:" the text should look something like this:

    <a href="http://feeds.feedburner.com/google/HUZf" title="Subscribe to my feed" rel="alternate" type="application/rss+xml"><img src="http://www.feedburner.com/fb/images/pub/feed-icon32x32.png" alt="" style="border:0"/></a><a href="http://feeds.feedburner.com/google/HUZf" title="Subscribe to my feed" rel="alternate" type="application/rss+xml">Subscribe in a reader</a>

  5. return to the announcements-style page on your website where you want the "Subscribe to posts" link to appear
     
  6. click on the pencil  edit screen pencil to edit the page (top, near-center)
     
  7. in the place on your page where you want the subscribe link, type "PASTE HERE"
     
  8. click on <HTML>
     
  9. search through the HTML for the "PASTE HERE" (to help, use ctrl F   or command F  to find PASTE HERE quickly in the html)
     
  10. remove the "PASTE HERE" text and paste the code (copied in step 4) instead
     
  11. click on "Preview" to view the change (return to the HTML to make changes as necessary)
     
  12. when finished with html, click "Update"
     
  13. in regular (WYSIWYG) edit mode, make any additional changes to placement of subscribe button
     
  14. when finished, click "Save" to save and view changes
     
  15. to test the link, click on it (not in edit mode)

Email

  1. complete steps 1-11 above 
     
  2. be sure you are signed into Google Feedburner, and on your Feedburn homepage, click on the name of the feed you want to add an email subscription link for
     
  3. in the top row of navigation tabs, click on "Publicize"
     
  4. on the left side, click on "Email Subscriptions"
     
  5. near the bottom (in the light-red area) click on "Activate" (if you don't see "Activate," be sure the highlighted tab on the left says "Subscription Management"--if it does and you don't see "Activate," the feed is already active)
     
  6. scroll down to the area marked "Subscription Link Code" 
     
  7. copy the content in the box. It should look similar to this:

    <a href="http://feedburner.google.com/fb/a/mailverify?uri=google/HUZf&amp;loc=en_US">Subscribe to Posts by Email</a>

  8. return to the announcements-style page on your website where you want the "Subscribe to posts" link to appear
     
  9. click on the pencil edit screen pencil to edit the page (top, near-center)
     
  10. in the place on your page where you want the subscribe link, type "PASTE HERE"
     
  11. click on <HTML>
     
  12. search through the HTML for the "PASTE HERE" (to help, use ctrl F   or command F  to find PASTE HERE quickly in the html)
     
  13. remove the "PASTE HERE" text and paste the code (copied in step 7) instead*

    *note: if you want the rss feed image to appear with the email subscription option, add the yellow-highlighted code to your code before the "Subscribe to Posts by email," resulting in something similar to this code:

    <a href="http://feedburner.google.com/fb/a/mailverify?uri=google/HUZf&amp;loc=en_US"> <img src="http://www.feedburner.com/fb/images/pub/feed-icon32x32.png" alt="" style="border:0"/> Subscribe to Posts by Email</a>

  14. click on "Preview" to view the change (return to the HTML to make changes as necessary)
     
  15. when finished with html, click "Update"
     
  16. in regular (WYSIWYG) edit mode, make any additional changes to placement of subscribe button
     
  17. when finished, click "Save" to save and view changes
     
  18. to test the link, click on it (not in edit mode)
Facebook Google+ Twitter Addthis


Add Twitter button

posted Mar 27, 2012, 9:16 PM by Julie Sharma   [ updated Apr 30, 2015, 8:44 PM ]


You can use the gadget described here to add a variety of button types,

FAQ

Can I reuse one button on many pages?
Once you've created the Tweet button for one page, you can copy and paste it on to other pages. Just change Your Page URL (step 8.1) for each new page.
including Tweet with a counter. If there's already a button on your page-perhaps from a template-, you can remove it before adding this custom button.
  1. click on the pencil  to edit the page (top, near-center) to edit the page
  2. put your cursor in the place you want the like button
  3. click on Insert
  4. click on ... More gadgets
  5. on the left side, click on Add gadget by URL
  6. then, in the box marked "Enter the URL for a gadget you want to add," remove any existing text and paste in 

    http://tinyurl.com/add1button

  7. click Add
  8. in the Add this gadget to your page box, 
    1. change Your Page URL to the page you're adding the gadget to
    2. change Your Title and Your Description
    3. set Back Color of gadget (i.e., to match the color of your page)
    4. for Button type, choose Tweet
    5. at the bottom, uncheck Include a border around gadget and Display title on gadget

      Optionally,

    6. change AddThis.com User ID

  9. click Ok
  10. click Save to save and view changes
The gadget spec URL could not be found
Google+ Facebook Twitter Addthis

Add button to Linkedin profile

posted Mar 27, 2012, 8:47 PM by Julie Sharma   [ updated Aug 8, 2015, 12:11 PM ]


linked in

Easily add a button to your Linkedin profile with this gadget. (If there's already a button on your page--perhaps from a template--you can remove it before adding this custom button).

The gadget spec URL could not be found

  1. image of insert menuclick on the pencil edit screen pencil to edit the page (top, near-center) to edit the page
  2. put your cursor in the place you want the like button
  3. click on Insert 
  4. click on ... More gadgets
  5. on the left side, click on Add gadget by URL
  6. then, in the box to the right, paste the url below in red (note: remove any text already in the box before adding this url)

    http://tinyurl.com/addlinkedinbutton

  7. click Addimage of add gadget by url
  8. in the Add this gadget to your page box, 
    1. change Linkedin Profile URL to the url of your public Linkedin Profile; to find this 
      1. sign in to your Linkedin account
      2. access your settings
      3. edit public profile
      4. under You public profile URL, copy your current url
    2. at the bottom, uncheck Include a border around gadget and Display title on gadget
  9. click Ok
  10. click  Save  to save and view changes
Google+ Facebook Twitter Addthis

Add Google +1 button

posted Mar 27, 2012, 8:41 PM by Julie Sharma   [ updated Aug 8, 2015, 12:14 PM ]


google+
You can easily an a Google + button to your site:
  1. click on the pencil (top, near-center) to edit the page 
  2. click on "Insert" 
  3. click on +1 button 
  4. click on "Save" to save and view changes
The gadget spec URL could not be found

If the +1 button is not an option:

  1. click on the pencil (top, near-center) to edit the page 
  2. put your cursor on the section (left column, right, etc.) of the website you want the button 
  3. click on <HTML> (in the row of commands above the content area. *For more on html, see HTML basics
  4. copy the entire gray-background section, below, and paste it into the html in the location you want the button (note: if you are not familiar with html, it can be difficult to determine where to paste the code. If you're not sure, just paste it at the very top. Then after the button is created, you can copy and paste to move the button exactly where you want it in non-html edit mode) 

    <img src="/site/sites/system/app/images/cleardot.gif" type="plusone" props="align:right;showCount:true;size:medium;wrap:true;" class="sites-placeholder-plusone-medium-count" style="display:inline;float:right;margin:5px 0 5px 20px;">

  5. click on "Update" 
  6. edit alignment and text-wrap options in the tool bar or click on the properties gear icon to change the button's size options 
  7. click "Save" to save and view changes 
*note: once you've created a +1 button for one page, you can copy and paste it into other pages

View Related Posts


Facebook Twitter Google+ Addthis

Add Facebook Like button

posted Mar 27, 2012, 8:38 PM by Julie Sharma   [ updated Aug 8, 2015, 12:12 PM ]


FAQ

I had a Facebook Like button, but it doesn't work anymore. There's an error when I try to use it. What's wrong?
The Like button functionality recently changed, so if you had previously added a Facebook button that worked, it might not work as expected anymore. 
You can add a  share button (along with other social media sharing buttons), which allows visitors to post your webpage on their Facebook page. Through addthis.com, you can even get analytics for the button's use. Here's how: 

Set up the button:

  1. go to www.addthis.com and create an account
  2. once you've created an account and signed in, click on Tools at the top
  3. in the Share Tools section, find Newsletter Sharing Buttons and click Setup
  4. return to the page of your Google Site where you want to put the Facebook button and copy the URL of that page, for example http://sites.google.com/site/mysite/mypage
  5. return to addthis.com and in the Page URL to share box, paste the URL copied in step 4
  6. in Page Title, type the title of the page (from step 4) 
  7. select the size buttons you'd like and drag or reorder any of the Services (only those in Selected Services will be added as buttons to your page)
    The gadget spec URL could not be found

  8. Scrolls down the the Get The Code box and copy the code, for example
    <!-- Go to www.addthis.com/dashboard to generate a new set of sharing buttons -->

    <a href="https://api.addthis.com/oexchange/0.8/forward/google_
    plusone_share/offer?url=https%3A%2F%2Fsites.google.com%2Fsite%2Fsiteshelphowtos
    &pubid=ra-5023h3hkk23&ct=1&title=pagetitle&pco=tbxnj-1.0" target="_blank">
    <img src="https://cache.addthiscdn.com/icons/v2/thumbs/16x16/goo
    gle_plusone_share.png" border="0" alt="Google+"/></a>
  9. return to your Google Site and on the page your want to add the button, click the pencil to edit the page
  10. click on <HTML>
  11. in the top of the html, paste the code copied in step 7
  12. click Update
  13. while in edit mode, you can drag and drop the buttons if you want to move them elsewhere on the page. 
  14. if you don't want the additional buttons, just click on each and then click the X that appears in the popup toolbar:
    image of popup toolbar when clicking on addthis button in edit mode

  15. click Save to save and view changes

The gadget spec URL could not be found

View Analytics 

  1. return to www.addthis.com
  2. sign in
  3. click on Analytics
Google+ Facebook Twitter Addthis

Images as links

posted Mar 26, 2012, 6:46 AM by Julie Sharma   [ updated Mar 21, 2015, 11:33 AM ]


For this tutorial, see the topic under "Images" Images as Links.
Google+ Facebook Twitter Addthis

Link to section on different page

posted Mar 25, 2012, 8:28 PM by Julie Sharma   [ updated Aug 8, 2015, 12:46 PM ]


link
There are 2 steps to making a link to a specific section or part of a page: insert anchor and insert link

*note you need to access and manipulate the html markup to do this. For more on html, see HTML basics
    The gadget spec URL could not be found

    Create Anchor

    1. beginning on the page you want to link to, click on the pencil to edit the page (top, near-center) 
    2. place cursor where you want the anchor (in other words, if you want an anchor link to go to the top of the page, put your cursor in the top most area of your page) 
    3. click on <HTML> (*For more on html, see HTML basics
    4. in the section of the html where you want to link to, add the following:

      <a name="nameofsection"></a>

      replacing nameofsection with an easy-to-remember term for this section. For example, the -top- links connect to anchor text with a name "top," so the first section of my html for this page begins with
      <a name="top"></a>

    5. click "Update" 
    6. copy the URL of the page

      Create Link to Anchor

      1. go to the page where you want to add the link and click on the pencil to edit the page (top, near-center) 
      2. add the text you want the link to display (for example, on this page I use -top- as a link to the top of page, so for this step, I would enter -top-) 
      3. select the text that you want to be the link 
      4. click on "Insert" (top left) 
      5. click on "Link" 
      6. on the left side, click on "Web address" 
      7. paste the URL (copied above in step 6 of Create Anchor) in the "Link to this URL" box 
      8. at the end of the URL add # 
      9. after # add the nameofsection term from step 4 of Create Anchor above (for example, to go to top of my homepage, the "Link to this URL box" would say

        https://sites.google.com/site/siteshelphowtos/home/#top

        *remember, use exactly the same name you gave the anchor in the steps above or the link won't work

      10. click Ok 
      11. click Save to save change 
      12. test the link by clicking on it to assure it goes to the correct place 
      *note: when you click on a link that goes to an anchor link (like the -top- link on this page), the web address should change to reflect the anchor--in other words, you'll probably see a # at the end of your URL with the name of your anchor after it)

      View Related Posts


      Facebook Twitter Google+ Addthis

      1-10 of 11