Many Blogger site owners received the new Google+ Comment System pretty negatively because it forced all commenting users to create their own Google+ account before they were able to write a comment. The Google+ Comment System on Blogger was convenient to writers, but discouraged many users from continuing to comment on blogs because they simply didn't want to use Google+.
For those that did use Google Plus to make a comment, Blogger would never email you and notify you that someone left a comment; you could go days or weeks without ever realizing that you never responded to a reader.
In addition to frustrating your audience, the Google Plus Comment System on Blogspot depended upon the URL of your blog post. By changing your URLs or moving around your blog posts internally, you run the risk of losing every one of your comments that was placed using Google Plus.
Check out the DEMO
Previously, the only way to solve this problem was to disable the comment system through your account settings, thus giving up your ability to use their Google+ account. Now, there's an easy new way to have the best of both platforms. Allowing audience from G Plus as well as everyday blog readers to access all same features, you be able to engage every visitor equally. You can respond to comments while still being able to communicate with other Google+ users outside of your site and take advantage of the Google+ Comment System on Blogger
How To Use Google Plus Comment And Blogger Default Together
To make the installation as simple as possible, I used inline jQuery and CSS, but who wants can change this code later. Also, the most accessible place I found to add it would be just after . So, let's start adding it
Step 1
Login to blogger.com >> Template >> HTML. Using CTR + F search for <b:include data='post' name='post'/>.
Step 2.
Add below code, just after <b:include data='post' name='post'/>.
<b:if cond='data:blog.pageType == "item"'>
<style>#comments, #gplus-comments-visibility {display:none;} .comments-icons {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8VIr8s4tqtOmuTRlQF1AIKdV490TMXHMzcCXh8tID3okY9wzzhYj6E4nAfDkA1addmo0naMksLpR3ueKO3sJzEQtR4Aa18TuS20t8QHlfzn7ejn_oDmB8oKgSqlpXt8q_cVxDebhgnHfi/s1600/speech-bubble.png) no-repeat; font-size: 20px; font-family: "Arial Narrow",Arial,sans-serif; color: #555; font-weight: bold; padding: 18px 15px 0; height: 70px; } .comments-icons a img {vertical-align: middle;}</style>
<div class='comments-icons'>
Show Comments: <a class='show-hide-comments' href='javascript:void();' onclick='$("#gplus-comments-visibility").slideToggle();$("#comments").hide();'><img class='gplus-icon' height='35' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP8YSNf146W8GJtPAETQP71nQDXN8G7xwXIJnne146qTxIiwAlRRj5_NE0-RfwM6XN9qpuR8gKJbU6wmYjkB_GGRpoYH-tc8P24unfYxqxjW-AZm3uZXxrp21y-PuXsMbsXU6cLc4mYwTH/s1600/google-plus-logo.png' width='35'/></a> OR <a class='show-hide-comments' href='javascript:void();' onclick='$("#comments").slideToggle();$("#gplus-comments-visibility").hide();'><img class='blogger-icon' height='35' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsPpWuRRv5L1fh8C7AMdWjHubvtrY1ERhuDafXS-ldbZfeTAD9i3m74Q5EANEQQUoAxdMtGCUYOB5r3p84kDnH24EJQbHoRBip5eJQlujpE5zlbfg5obfVyTqNTqBzsHvhwMz9wD3XQ2bl/s1600/blogger-logo.png' width='35'/></a>
</div>
<div id='gplus-comments-visibility'>
<div class='g-comments' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD' data-width='600' expr:data-href='data:post.url'/>
</div>
</b:if>
Customization;
Change the code as yo want. Replace 600 with your desired width and every other changes can be self considered.
Step 3.
Please note that in order to make this work, you need to make sure that you are using a version of jQuery in your site. Otherwise, add this line just above the </head> tag using the HTML template editor:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>
Step 4.
Save your template and check it out on your blog.
Step 5.
Comment below and share to your social networks. Sharing is Caring!