Adding A Google Plus One Button To An iWeb Website

July 27th, 2011

This video tutorial will show you how you can easily add a Google Plus One (+1) button to your website in iWeb. For more SEO tips for your iWeb site, check out our SEO for iWeb Walkthrough Video Tutorial.

Video Transcript:

You might have noticed these +1 buttons next to your search results when in searching in Google. These buttons can tell Google that you like this link and essentially recommend it to all friends connected to you through Google’s new social networking service, Google+. When you plus one a link, and when someone connected to you does a similar search, any website you have +1’ed will appear at the top of the results for your friends. Your goal is to get as many people to +1 your website. In this video I am going to show you how you can add this button to your website in iWeb.

So to add a Google Plus One, first visit the Google Plus One page. You can pause this video to type in the URL you see here, or you can do a search for Google Plus One and click on the Google +1 button result.

Next, you will see a link on this page that says Get The Code. Click on that link.

On the next page, the first thing you will do is choose the size of the plus one button that you like best.  You can then select your language. Next, click on the Advanced Options button, and type in your URL, in the URL to +1 field. I have noticed that it is best to include http:// and www in this field.

Now we can highlight all of the code and copy it.

Open up your site in iWeb, and drag and drop an HTML Snippet onto the page. Paste the code that you just copied. You should now be able to see your Google Plus One button.  If you want to put the button on another page or pages of your website, then paste the code in another an HTML snippet on that page. If you want to leave the URL to your home page, you can do so, otherwise, you can add the page extension to the URL that is already typed in there.

If you paste the code and you don’t see anything at all, first, make sure you typed your URL in with http:// and www. You can also try publishing your site to the web to see if it becomes live once the site is published.

I just want to show you what happens when you either leave the URL field blank, or do not include http:// and www.

You will notice that the HTML Snippet shows up as this huge box which I am not dragging along with my mouse. I could minimize this box until it is the size of the the Plus One button, however, that can take me a while.  So just take note of these things if the button is not showing up for you.

Otherwise, that is how you add a Google Plus One button to an iWeb website. Be sure to check out our other helpful iWeb tips and tricks videos which are located in the SEO For iWeb Walkthrough Video Tutorial or our iWeb SEO blog.


6 Responses to “Adding A Google Plus One Button To An iWeb Website”

  1. Nate Says:

    I have added the +1 button to my iWeb site – it looks fine and all, but when clicked it shares the wrong link to Google+

    Instead of sharing my main URL that i enter in the +1 google code page, it shares the link to the widget itself… annoying.

    How do i resolve this?

  2. paul Says:

    We updated the video which should address this issue. Let me know if you still have problems.

  3. Debbie Says:

    I’ve added the http://www (etc) and still I get the big giant box that I can’t reduce to a small size.

    hmmm

  4. Mim Says:

    Hi! I love your stuff 🙂
    But… when I publish my iweb site to my desk top, before putting it online, I don’t see the +1 icon on the pages I put them on – they are visible in iweb but disappear when published. Any ideas?
    Thanks,
    Mim

  5. Mim Says:

    oooh, when i finally publish it using the ftp client the +1 appears, so ignore my q above – it seems to disappear when it is just published to my desktop, but reappear when published online.

  6. paul Says:

    Your browser may be blocking the connection on your local copy. As long as it works online, that is what matters.

Leave a Reply