Monday, October 29, 2012

How to Apply/Remove Disqus 2012 and Avoid Comments Count Override

Monday, October 29, 2012

As discussed previously about adding comments counter below post title on blogger and other platforms. I recently decided to use Disqus but faced an issue related to overriding of comments count. By default Disqus adds comments count below post body but since I was using comments counter below post title already, immediately after implementing Disqus on blogger it started showing me two comments counter one below post title and the other below post body. I tried to remove the code of comments count but it disappeared both of them.

I think I am the first who has learned this to do it on blogger blog because I searched the whole web but could not find any tweak to resolve the override issue of Disqus comments counts. But I was not disappointed what I did that I tried to understand the code and implemented it as I thought. Luckily for me it worked like a charm. One thing I would like to request here that DO NOT COPY IT please as it would really hurt me.

There are two parts and we have to do it one by one. So here is the simply tweak that will help you to remove the comment count of Disqus and keep the one that you need already on your blog.


As always Sign in to your Blogger Account, Go to Dashboard, Layout, Edit HTML, Expand Widget Templates. Make sure you backup your template and save a copy of it.

How to Fix the Override Issue of Disqus 2012 Comment Counter on Blogger

Find <div class='post-header'> and put following code immediately after it.

<!-- Disqus Comment Count Start-->

<div style='float:right'>
<a class='dsq-comment-count comment-link commentslink' style='background: no-repeat scroll top left;padding-left:25px;font-weight: bold;font-size:12px; bold;font:Veranda'
expr:href='data:post.url + &quot;#disqus_thread&quot;'/></div>
<!--Disqus Comment Count End-->

<font style='background:transparent no-repeat scroll top left;padding-left:0px;font-weight: bold;font-size:12px;'><data:post.dateHeader/></font> 
<span class='post-comment-link' style='Float:right;'>
               </span>

Customization for Disqus 2012 Comment Counter

Notice you can also make it float left or right or even center. You can change the font family, font color, font size, you can make it bold or keep it simple and if you wish you can attach an image with it as well.

How to remove Disqus with 2012 Features Comment Counter on Blogger

Once you are complete done with above part, go ahead and remove the comments counter that came with the disqus template by simply following steps mentioned below.

In default layout: Go to Dashboard - Design - Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

In new layout: Go to Dashboard ('House' symbol) - Template - Customize - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

.post-comment-link {

display: none !important; }
}

Related Posts Plugin for WordPress, Blogger...