Bringing G+ Comments to your Blogger blog without walling it off

We think it is awesome that +Blogger and +Google+ have started integrating more and more every day. The new commenting system brings additional engagement to any Blogger site as, if your readers are active in G+, it gets them sharing and discussing much more quickly. This will be a huge boon for those already active in G+, and might be an incentive for them to get started in Google+.

The only problem is that this new system is a bit of a "walled garden"... so we're aiming to fix that a bit.

In order for a reader to leave a comment in the new G+ commenting system they need to have a G+ account, want to post under that G+ account, and can't post an anonymous comment. For some this is fine, but not everyone wants to put up that fence around their site and their content; most want comments and don't want to force readers to use a specific type of account in order to do so. Plus some people already have other 3rd party commenting systems in place such as CommentLuv and Disqus.

So what we've done is create a toggle method to enable you to have much of the G+ functionality that the new commenting system contains, but to also keep your existing commenting system in place. We do this by replacing your existing "threaded_comments" include in your template with this new include.  Users who want to can leave comments like they currently do on your site, but G+ users can hit the G+ toggle and comment using that, as well as share it (the share button is turned on by default). All users can toggle to the G+ tab and see all of the activity that your post has had.

Quick notes on this functionality:

• It leaves your existing commenting in place; don't go to Google+ tab in your blog and enable the commenting there
• Permits all users to comment as they did previously, including non-G+ people and anonymous (if you so choose), as well as 3rd party commenting platforms
• It does NOT notify you of new comments via G+, sorry
• All images are contained in a Picasa album that I share, but you're free to change them out if you'd like
• In the code we have the width of the G+ comment box set to be 750; you can adjust this as needed
• It will NOT work on Dynamic Templates

The steps

Step 1: back up your template!

Step 2: search your template (by going to Template, then Edit HTML) for the includable "threaded_comments"; it should begin like:
<b:includable id='threaded_comments' var='post'>
and go to
</b:includable>

Step 3: replace the entire includable mentioned above with this code.

Step 4: search your template for the includable "comment_picker"; it should begin like:
<b:includable id='comment_picker' var='post'>
and go to
</b:includable>
Step 5: replace the entire includable mentioned above with this code.


Questions, comments, concerns? Leave them in the new commenting functionality below!


If it doesn't work...

You may not have JQuery libraries installed in your template. To add them copy/paste the following code and add it into your Template right before </head>:

<script language='javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'></script>