7

I have a blog with Blogger. I used Disqus before and there are a lot of comments on that. However now I want to use Google+ comments on Blogger because I use Google+ a lot. But I cannot find a solution to use both on Blogger at the same time.

I found other solutions to use both Blogger default comments and Google+ comments but not Disqus. How can I do that?

  • Are you talking about your own Blogger blog, or using your Disqus/Google+ account on other people's blogs? – Vidar S. Ramdal Oct 21 '14 at 9:57
  • @VidarS.Ramdal I am talking about my own blogger. – einverne Oct 21 '14 at 12:33
1

Install Disqus to Blogger as you normally would:

  1. Login to Disqus
  2. Add Disqus To Your Site
  3. Register site and add the provided widget code to your Blogger site.

Then, add Google+ commenting to Blogger by editing two multiline sections of the HTML template:

  1. Blogger ➜ Dashboard ➜ Template ➜ Html editor
  2. Replace the code block of

      <b:includable id='comment_picker' var='post'>...</b:includable>
    

    with

        <b:includable id='comment_picker' var='post'>
      <b:if cond='data:post.forceIframeComments'>
        <b:include data='post' name='iframe_comments'/>
        <b:if cond='data:post.showThreadedComments'>
          <b:include data='post' name='threaded_comments'/>
        <b:else/>
          <b:include data='post' name='comments'/>
        </b:if>
      <b:else/>
        <b:if cond='data:post.commentSource == 1'>
          <b:include data='post' name='iframe_comments'/>
        <b:else/>
          <b:if cond='data:post.showThreadedComments'>
            <b:include data='post' name='threaded_comments'/>
          <b:else/>
            <b:include data='post' name='threaded_comments'/>
          </b:if>
        </b:if>
      </b:if>
    </b:includable>
    
  3. Replace the code block of

      <b:includable id='threaded_comments' var='post'>...</b:includable>
    

    with

    <b:includable id='threaded_comments' var='post'>
    <div id='comment-header'>
      <img class='comment-on' id='comments-norm' src='http://3.bp.blogspot.com/-S3w45s75Yio/Uoe5OPXkFjI/AAAAAAAADcA/vmtzeVI2wFg/s50/disqus-social-icon-blue-transparent.png' title='view Blogger comments'/>
      <div class='choice'>Comment With Your Choice</div>
    <image id='comments-gplus' src='http://lh6.googleusercontent.com/-wnTb7SHAGEE/UXVi6xoHXAI/AAAAAAAAILY/6vx5Em5w8MI/s50/plus_off.png' title='view Google+ comments'/>
    </div>
    <div id='comment-zone'>
      <div class='comments' id='comments'>
        <a name='comments'/>
        <h4><data:post.commentLabelFull/>:</h4>
    
        <div class='comments-content'>
          <b:if cond='data:post.embedCommentForm'>
            <b:include data='post' name='threaded_comment_js'/>
          </b:if>
          <div id='comment-holder'>
             <data:post.commentHtml/>
          </div>
        </div>
    
        <p class='comment-footer'>
          <b:if cond='data:post.allowNewComments'>
            <b:include data='post' name='threaded-comment-form'/>
          <b:else/>
            <data:post.noNewCommentsText/>
          </b:if>
        </p>
    
        <b:if cond='data:showCmtPopup'>
          <div id='comment-popup'>
            <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
            </iframe>
          </div>
        </b:if>
    
        <div id='backlinks-container'>
        <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
           <b:if cond='data:post.showBacklinks'>
             <b:include data='post' name='backlinks'/>
           </b:if>
        </div>
        </div>
      </div>
      <div id='gcontainer'><div id='gcomments'/></div>
    <script src='http://apis.google.com/js/plusone.js'/>
    <script>
    gapi.comments.render('gcomments', {
        href: window.location,
        width: '750',
        first_party_property: 'BLOGGER',
        view_type: 'FILTERED_POSTMOD'
    });
    $('#comments-norm').click(function(){
     // switch to normal comments displaying
     $('#gcontainer').css('display','none');
     $('#comments').css('display','block');
     $('#comments-norm').addClass('comment-on');
     $('#comments-gplus').removeClass('comment-on');
     $('#comments-norm').attr('src','http://3.bp.blogspot.com/-S3w45s75Yio/Uoe5OPXkFjI/AAAAAAAADcA/vmtzeVI2wFg/s50/disqus-social-icon-blue-transparent.png');
     $('#comments-gplus').attr('src','http://lh6.googleusercontent.com/-wnTb7SHAGEE/UXVi6xoHXAI/AAAAAAAAILY/6vx5Em5w8MI/s50/plus_off.png');
    });
    $('#comments-gplus').click(function(){
     // switch to google plus comments displaying
     $('#comments').css('display','none');
     $('#gcontainer').css('display','block');
     $('#comments-norm').removeClass('comment-on');
     $('#comments-gplus').addClass('comment-on');
     $('#comments-norm').attr('src','http://2.bp.blogspot.com/-31izM0JEWCs/Uoe6Uf7eqoI/AAAAAAAADcI/AC8mXw1gUcg/s50/disqus-social-icon-dark-transparent.png');
     $('#comments-gplus').attr('src','http://lh3.googleusercontent.com/-oNlD347wl3k/UXVi7AiBdHI/AAAAAAAAILc/NxAyb8fwEfI/s50/plus_on.png');
    });
    $('#comments-norm').hover(
     // switch to normal comments displaying
     function(){
      if (!$('#comments-norm').hasClass('comment-on')){ $('#comments-norm').attr('src','http://3.bp.blogspot.com/-S3w45s75Yio/Uoe5OPXkFjI/AAAAAAAADcA/vmtzeVI2wFg/s50/disqus-social-icon-blue-transparent.png');} 
     },  function(){
      if (!$('#comments-norm').hasClass('comment-on')){ $('#comments-norm').attr('src','http://2.bp.blogspot.com/-31izM0JEWCs/Uoe6Uf7eqoI/AAAAAAAADcI/AC8mXw1gUcg/s50/disqus-social-icon-dark-transparent.png');} 
     }
    );
    $('#comments-gplus').hover(
     // switch to gplus comments displaying
     function(){
      if (!$('#comments-gplus').hasClass('comment-on')){ $('#comments-gplus').attr('src','http://lh3.googleusercontent.com/-oNlD347wl3k/UXVi7AiBdHI/AAAAAAAAILc/NxAyb8fwEfI/s50/plus_on.png');} 
     },  function(){
      if (!$('#comments-gplus').hasClass('comment-on')){ $('#comments-gplus').attr('src','http://lh6.googleusercontent.com/-wnTb7SHAGEE/UXVi6xoHXAI/AAAAAAAAILY/6vx5Em5w8MI/s50/plus_off.png');} 
     }
    
    
    );</script>
    </div>
    </b:includable>
    
  4. Save template.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.