How to Add Google Rich Snippets to Your Web Site

If you are living in a cave or just had a baby, then you are excused.  Otherwise, I am sure you are aware of Google’s Rich Snippets…or at least have seen them in the SERPs.  Rich Snippets can be anything from an author picture, thumbnail image of a video, stars from a product or service review, list of audio files, or even the breadcrumb navigation from your website.

Tracking people’s eyes has shown that there appears to be a positive correlation between having an image next to a SERP listing and interest.  So, the bottom line is, if you want people to check out your listing on the Google search results pages…getting some images next to them is a great idea.

Rich Snippets is one of Google’s advancements that, I believe, will pay huge dividends to those who choose to be early adopters.  Not only does Google get to jazz up their SERPs, they get some additional benefits as well…

Author / Publisher Association

That’s right, part of the deal here is that Google is able to associate (or authenticate if you like) authors and publishers.  The Author Snippet (your mug shot) is provided by associating a piece of content (article, video, blog post, etc) with a Google+ profile. You link your content to your author page on your website OR you can link a piece of content or author page on a 3rd party website to your Google+ profile as well.

IF you do it right, you get the disco lights.

How Do I Get Rich Snippets Next to My Listings?

Armed with the right knowledge, you can easily add Rich Snippets to your web pages displaying your photo next to your SERP listings in just a few minutes. You need to accomplish 5 things the first time you add Rich Snippets to your website (we will cover all of them in detail below):

1. Create a Google+ Profile if you don’t have one
2. Add your website to your Google+ Profile
3. Associate your content with your author profile on your website
4. Link your author profile on your website with your Google+ profile
5. Notify Google that your website is Google Snippets enabled

Here is a breakdown of how I would attack the Rich Snippets program:

• Add Author Rich Snippets
• Add Rich Snippets to 3rd Party Websites
  • Adding Rich Snippets to Youtube Videos
  • Adding Rich Snippets to ArticlesBase
  • Adding Rich Snippets to Tumblr
  • Adding Rich Snippets to Hubpages Author Page
• Add Rich Snippets Breadcrumbs
• Add Rich Snippets for Audio Files or Podcasts

But, let’s not get ahead of ourselves.  We will start with the most important one and go from there.

 Adding Author Rich Snippets to Your Website

Sexy, right?  So, here is how we accomplish this…

Setup Google+ Profile

First, you need to setup a Google+ profile.  So, run over to the Google+ sign-up page and either associate your Google account with Google+ or create a new account.

Add Your Website to Google+

Second, we need to add your website / blog / whatever to your Google+ profile.  The way you do this is by adding yourself as a “Contributor” to your site.  So, click on the arrow next to your avatar in the upper right hand corner (when logged into Google+), then click “View Profile”, and finally click “Edit Profile.”   If you scroll a bit, you will see “Contributor to”…click on it.

Next let’s click “Add Custom Link”:

Next, we will enter the URL (aka website address) of your website:

 

The first box is what you want to have displayed on the screen (“golod.com” and “Jason on Youtube” in this picture).  Next is the URL of your website.  Click “Save.”

[content_box_light_blue width=”75%”]

IMPORTANT: I almost forgot to mention that you will need to upload a QUALITY picture of yourself.  Obviously, you are not going to have a picture displayed next to your listings if you don’t have a picture of yourself in your Google+ profile.  If you don’t have a good picture, go and take one.  Don’t go ahead without it. You don’t want to risk the Google Rich Snippets team nix’ing your acceptance into the program because your picture is crap.

[/content_box_light_blue]

Click the “Done Editing” box in the bar at the top of the screen and we can move on to the next step:

Associate Your Content with an Author Profile

Now, we need to associate your content with your Google+ profile on your website.  There are two ways to go about this:

1. You can associate your content (blog posts, articles) with an author profile on your website AND then associate your website profile with your Google+ profile (yeah, that is two separate steps…stay with me).
2. OR, you can associate an individual piece of content with your Google+ profile.

Now, you have to make the decision here.  Obviously, if you have a blog or a website that you have authored lots of articles or posts on, you are going to opt for door #1 above.  If you only have a few pieces of content or pages, you might opt for #2…but, I would not recommend it…here is why.  It would be more flexible to use the proper markup to associate each page or post with your website’s author page.  This gives you the option to expand or change things much more easily down the road should things change (and they always change, right?).

Creating an Author Page on Your Website

If you use WordPress, please see my (upcoming) post on how to add an author page to your WordPress blog.  For the rest of you, here is how you can add an author page.  Most of you already have an “About” page on your website…if you do, you can skip to the next paragraph.  If you are still reading along, then you will need to create a page on your website that will be an author “bio” for you.  You can put whatever you like on the page.  The key for right now is that the page exists.

Create the Author “Relationship”

Now that you have your author page, we are going to let the world know that you are the author.  Well, the reality is there is going to be next to nobody that will see what we are about to do…but, the search engine bots will.  We are going to use the rel=”author” attribute to let the search engines know that your author page tells them who created all of this junk.  So, if you have an “About” link on your navigation bar (you should, btw), we are going to add a rel=”author” attribute to the anchor tag.

On my blog, I have an “About Jason” link on every page as it is located right at the top in my main navigation menu.  If we take a look at the html anchor tag for my navigation bar, you will see this for the “About Jason” link:

<a rel=”author” href=”http://new.golod.com/jason/“>About Jason</a>

As you can see, the anchor tag has some additional info in there…  rel=”author” is making an association that every page that I am the author of this website.  If you add this to every page on your site, you should be fine according to option 2 of the Google Rich Snippets Authorship page.  However, I actually do what both steps on that page indicate….for a couple of reasons:

1. I wanted to make sure it worked
2. I want to give people a chance to read more about me should they find something I wrote interesting. My profile doesn’t have anything super-awesome in it right now, but I can add it in the future if I would like.

So, you will need to add a byline like “Posted by” or “Written by” or “Author: ” to your articles or posts. Of course, you will add your name after the byline and link your name to your author profile page on your website.

Link Your Author Page to Google+

Stick with me, I know this is tedious.

Now, we are going to want to add a link from your website’s author page to your Google+ profile.  We accomplish this by adding another attribute to your Google+ profile link.  In my case, my Google+ profile url looks like this:

https://plus.google.com/105529091549806108461/about

According to Google, you can simply append (add for you illiterates) ?rel=me to the end of the URL.  But, I have had issues with the Rich Snippets Testing Tool recognizing that method.  Instead, I simply add it as an attribute in the anchor tag as we did above.   So, we get something that looks like this:

<a rel=”me” href=”https://plus.google.com/105529091549806108461/”>Jason Golod</a>

In this example, the numbers are unique to my profile. You will want to go to your profile page, copy the URL and paste it accordingly.  The key is that you add the rel=”me” attribute to the anchor tag.

The Rich Snippets Testing Tool

OK, so we only have one step left.  But, we have to make sure it is all working properly.  So, let’s head over to the Rich Snippets Testing Tool and verify that your markup is correct.

1. Copy the URL of your author profile on YOUR website.
2. Go to the Rich Snippets Testing Tool
3. Paste the URL  and click submit

You should see something like this:

If you see your mug instead of mine, move to the next paragraph.  If you don’t, be sure you have done all of the following:

1. Created a Google+ profile complete with your picture
2. Linked TO your website FROM Google+ as a Contributor to link
3. Linked TO your Google+ profile from your website’s author page with the rel=”me” attribute

If you have and it still doesn’t work for you, leave a comment below and we will get you straightened out.

For those of you in the front of the class, now we are going to copy a URL from a blog post or article you have written on your website and past that into the tool.  You should see something similar as before.  The title of the page will likely change, but the important thing is that your mug is showing up to the right.  If there are any major errors, you will see that below the listing, but if your picture is there, you are a happy camper.  Now we can move to step 5.

Telling Google You Are Rich Snippets Ready

They don’t make this page easy to find, but here you go:

https://spreadsheets.google.com/spreadsheet/viewform?formkey=dHdCLVRwcTlvOWFKQXhNbEgtbE10QVE6MQ

Go to that page and fill out the form.  In a couple of weeks your mug will start showing up.  Google needs to re-crawl all of your pages after they “flip the switch” before it will show up for a particular page.

Hope this helped.