Create a Google +1 button for an entire site

About a week ago, I posted about how Technology Bloggers now supports Google Authorship, so that writers can now claim posts as their own via linking them to their Google + profile. This article is also about the blog integrating further with Google’s growing social network: Google +.

Until recently it was not possible to create a sitewide Google +1 button, so that users could +1 your entire website; before you only used to be able to +1 the exact page you were on. However thanks to one of Google’s recent updates, it is now possible to +1 an entire site!

If you are a website/blog owner, then this article is probably going to be of particular use to you ๐Ÿ™‚

I have recently added a sitewide Google +1 button to Technology Bloggers sidebar, which sits on the sidebar, next to our other social widgets.

Social media buttonsTo get a +1 button, you need to visit the Google +1 Button customisation page. There you can choose the style of your button, how big it is and the language used. What most people probably then miss is the ‘Advanced options’ link.

Advanced Options

If you click ‘Advanced options’, you get a whole new set of options drop down. One of these options is URL to +1. Usually when you place a +1 button on your site and a user clicks it, it +1’s that exact page. However if you enter your sites URL into the box and then get the code, when a user clicks your +1 button it +1’s your entire site.

Google +1 ButtonFor more information on the URL +1’d when users click your button, please see Google’s URL configuration explanation.

Sharing

When someone clicks +1, they will also be given the option to share the content/page to their circles. Usually Google will fetch the page title, and choose a selection of text and an image from the page users are currently on, however it is now possible to customise this too by customising the +Snippet.

Scroll down the page and you are able to select the type of page users are on, is it a local business, article, book, organisation, event, review etc.? You can also choose the title, description and image of the share. If you have created a sitewide share button, usually the button will offer users to share the current page, however by customising the +Snippet, you can make it so that your chosen title, text and image are what are shared, not the one Google automatically selects.

To implement the snippets you just have to add a few meta tags or some HTML code to your page.

Problems

One small problem I have come across when implementing this on Technology Bloggers is that you can’t successfully run 2 +1 buttons on the same page. That means that if you want to have a sitewide button, so users can +1 and share your homepage, and a button on every individual page, where users can +1 and share that page, it is not entirely possible.

The code of the button determines the URL to be +1’d, so it is completely possible that you can have 2 buttons, 1 for the page and one for the site, however the problem is with the +Snippet and the sharing, as both buttons inherit the meta data, meaning that when you share the individual page, it doesn’t share data from that page, but your generic sitewide text, image and title.

It isn’t really a major fault, and with a bit of clever scripting (and a lot of time) I am sure I could get it to work the way I want it to. I am sure Google will release an update at some point which allows you to have 2 +1 buttons, one for the site and one for the page, but in the meantime, we will just have to put up with it not working exactly as we would like it to.

UPDATE: I managed to resolve the problem easier than I thought. I added the +Snippet to the theme header, however told it only to appear on the homepage. The button is designed to fetch the +Snippet from the page users are on, unless the button is designed to +1 a specific URL, in which case, it goes to that URL to fetch the +Snipped – the homepage, where the +Snippet for the entire site is.

You and +1

So what is your opinion on the +1 button, do you use it in the same way/to the same extent the ‘Like’ and ‘Follow’ buttons, or is it not as important? If you own a website or blog, will you be adding a +1 button to it, and if so do you think it is better to have a sitewide +1 or a unique URL +1 button – or both!

Technology Bloggers adopts post authorship

Until recently I haven’t been as aware as I probably should have been of the Google update, which allows authors to claim authorship of their posts in the SERPs.

I was recently talking about the blog in the (Google) Webmaster Central Help Forum, when someone suggested that we should use Google Authorship. I had heard of it before, but wasn’t 100% sure what it meant, or why we should take the time to adopt it.

So after a little research, I am here to present my findings to you ๐Ÿ™‚

What is Google Authorship?

Google Authorship is a relatively new part of search results, whereby Google shows the (Google+ profile) avatar of a person next to articles they have written in the SERPs. This means that people know who wrote something, even before they visit the page.

Google will not only give an avatar which it fetches from the writers Google+ profile, but it will also link to that persons profile. It might also provide additional information like how many circles the person is in. See the image below for more of an idea of how it looks.

Examples of authors Google+ profiles in the SERPsHow Can I Claim My Posts?

If you run your own blog, and you are the only person who ever writes on it, it is dead easy. Just add a link to your Google profile page withย ?rel=author after it, and with the text being the same name as your Google profile, to your profile, or just every page of the blog.

The code would look something like this:

<a href="https://plus.google.com/114686389155717038852?rel=author" rel="author" title="Christopher Roberts on Google+">Christopher Roberts</a>

What if I Run or Am Part of a Multi-Author Blog?

If you are part of a blog with multiple authors, it can get a bit more complicated. Basically, the admin needs to make sure that there is no sitewide Google+ profile link, as that could mess things up. Each individual author will need to either link to their Google+ profile with the tag rel=”author” on every post they write, or link to their profile page on every page they write with the tag rel=”author” and then on their profile page link to their Google+ profile with rel=”me”.

It may sound a bit complicated, but it does make sense. If you don’t own a site, don’t worry about it. If you do and need some help, ask me in the comments, or send me a message ๐Ÿ™‚

How Do I Claim Authorship of My Posts on Technology Bloggers?

Recently I have been very busy tweaking bits of WordPress’s code, in order to make it as easy as possible for you to claim authorship of the posts you write on Technology Bloggers.

There are three really simple tasks you need to complete. The first is to go to your Google+ profile ‘About’ page and under ‘Contributes to’ add Technology Bloggers – https://www.technologybloggers.org. The second step is to copy your Google+ profile URL and paste it into the ‘Google+ Profile URL’ box on your WordPress admin profile page. Finally in the box below (‘Google+ Name’) add your name as it appears on your Google+ profile. That is it! The blog does the rest of the work for you, and adds a link to your Google+ profile to your writer profile page.

Screenshot Technology Bloggers Admin Profile - Google Authorship

A screenshot of the data you need to fill in on your profile, in order to claim authorship of your posts on Technology Bloggers.

If you don’t have a Google+ profile page, your link will just direct to your WordPress profile page. Not sure what I mean? Don’t worry, if you don’t have one, nothing bad will happen!

I have updated the post guidelines to include a section about how to link to your profile, however this article probably has a more detailed explanation!

A Final Word About rel=”author” and rel=”me”

If you are still confused about rel=”author” and rel=”me”, look at it this way: rel=”author” lets search engines know that the URL with that tag in is pointing to your author profile, be that WordPress, Google+, about.me or another; rel=”me” lets search engines that the URL with that tag in is another website/profile/blog etc. that is yours.

To see the Google Authorship in action you will have to wait a while for Google to index the pages and register the authorship. To check that your code is working okay and that Google can find your authorship, try using Google’s Rich Snippets Testing Tool.

For more information on Google Authorship, please check out Google’s help article on it.

Tips on website design

A notepad and a pencilWeb redesigns can be a huge undertaking. There are many things to keep in mind as you approach redesigning your or another website. Here are some of the basics of good web design to help keep your focus where it belongs.

User Experience

At the forefront of any web redesign should be the overall user experience desired. How do you want people to interact with your website? What do you want them to take away from your website? These are just a few starter questions to ask yourself as you go about planning the redesign. The easiest thing to do in order to answer these questions is to think about what you like about your favourite websites and what you dislike.

Design Aesthetics

The best designs are often the simplest designs, and keeping things clean is more inviting than a cluttered page. Cohesiveness in design throughout the site is key here. The content delineates one page from the next; not a whole new pallet of colours. Clean, modern designs are also easier for the user, making them more likely to interact with information you have posted, whether through a blog post or messaging forums.

Ditch the Gimmicks

This is not the time to go overboard and incorporate everything you have learned in your experience with web design and cram it all into one page. Ditch the shadow boxes and the splash pages, and make your page more inviting by making it easy for users to use and interact with the site.

SEO Friendliness

Incorporating aspects of SEO into your site’s design and content is very easy to do, but it has to be done right. Everyone wants their web page to ping higher on search engine results, which is easily achievable. Just make sure you are not taking away from the site content at the same time.

Check the Coding

Finally launching the web page after a redesign can be both an exciting and nerve-racking experience. After all the work that was put in to choosing the colours and overall aesthetic look, as well as the content, you want the launch to go off without a hitch. Nothing dashes the excitement of a site launch than to spend most of launch day fixing broken codes. Before you make it public, check your coding. Then double check it just to be sure.

User experience, above all, is the most important element. Having a website that users can easily use will keep users visiting your site regularly and will keep new traffic flowing in regularly. Keep the user experience in mind, and all the other necessary elements for good web design will fall easily into place.

Looking for a professional company for effective yet affordable Web Design? Please check out Snap’s website design.ย  Also don’t forget to advertise your offline business with advertising flags.