• Open Account
  • Premium
  • Sunday 21 December 2014

    Blogger and Google+ Comments System With Toggle

    Blogger and Google+ Comments System With Toggle

    Blogger and Google+ Comments System With Toggle
    When the google+ commenting system was not a successful since it restricted many blog visitors from commenting to their desired blogger blog resulting to bloggers having the ability to choose the commenting system that they require for their blogs, I have decided to Share this awesome commenting system for blogger which will include both Blogger and Google plus comments separated by a toggle. this widget is the best ever widget that any blogger would like to post as it is the first ever widget that will enable both Blogger and Google plus comments in one blog.

    The most negative thing about using the Google plus commenting system was that it was very less responsive to the blogger and the worst thing about this type of commenting system was that it was dependant to the blog domain and they will automatically delete when you change the blog domain meaning that your readers comments were not secure.

    This blogger and google plus commenting system can work for you both in google plus and on blogger



    Preview





    How to  install Blogger and Google+ commenting system

    • Step 1
    Log into your blogger dashboard, go to template and select edit html which will open the HTML code of your template.




    • Step 2
    Once you in the template HTML code left click anywhere on the code and the press CTRL+ F on the left to open the editors search box which will appear as show on the image below.




    • Step 3

    Copy and paste the below to the search box  and press ENTER to search


    <b:include data='post' name='post'/>




    • Step 4
    paste  the code below just after  <b:include data='post' name='post'/>


    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <style>#comments, #gplus-comments-visibility {display:none;} .comments-icons {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieUncIq2DD3yIoUFJ512pbiHWD_X482QRmQldEkTqQr-D_ZFKOmCxlWpkaikUWBkdaQkpi4vDS-9_L0ZdDnMlu5krNa3g1vzpsx0mvtFS3UavUZKwdWCIBC6wEOQMlnwHe9rJam31J9O_j/s1600/speech-bubble.png) no-repeat; font-size: 20px; font-family: &quot;Arial Narrow&quot;,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='$(&quot;#gplus-comments-visibility&quot;).slideToggle();$(&quot;#comments&quot;).hide();'><img class='gplus-icon' height='35' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSS4ro720zmUBHBFFVmusaeC2DOUVJyuDcIL0ufImmG86ElUYoRVlOfoaeNsyWrBl-6Brdj24ajKHPwh12WLxtjRRABL4WuNH25BCA9T4gJ2TaZqBpWyuylqt2k2TENs7lZAH8osCcLz1b/s1600/google-plus-logo.png' width='35'/></a> OR <a class='show-hide-comments' href='javascript:void();' onclick='$(&quot;#comments&quot;).slideToggle();$(&quot;#gplus-comments-visibility&quot;).hide();'><img class='blogger-icon' height='35' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEpOOrKz8Jn3jevBaaJ_j2XhyphenhyphencaAe9wvZ1NCyx2M-1MN7FP50EMWhvsg2UG5DJH8Dt1LUrtOd0M8irLRVwui7eO7uGV0-F1X09FicAfJNWz0zd8NyE-f_Gj7FrQ0Bp9Qu4SzC6Vi1G1RFy/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='550' expr:data-href='data:post.url'/>
    </div>      
    </b:if>



    • Step 5
    Save your template and check it out


    NB :
    The width setting of this widget is 550  but you can adjust it to the way it suits your blog , to some blogs the widget may not work because some blog templates  are not updated to using a version of jQuery  then I would  motivate that they update their templates by adding the code 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'/>




    Conclusion

    This trick is the best trick you can try for your blogger blog as it has the ability of increasing your blog readers flexibility. allowing them to comment in both google+ and blogger.
     

    Sifiso Nkwanyana

    Author & Editor

    I hope you have recieved all the information you seek and thank you once more for browsing our website we hope to hear from you soon.

    3 Comments:

    1. nice I got it on my blog , thnx

      ReplyDelete
    2. Thanks it worked out!.....but why are u not using it LOL

      ReplyDelete
      Replies
      1. Yes it works very well, I tested it on my Demo Blog.

        Delete

    Although every comment is appreciated, due to time limitations I might not be able to respond to everyone. Keep it in mind that we respect all comments by our readers but all spam comments and spam links will be deleted. Thanks for understanding!