I have recently installed the Disqus comment plugin on my blog and so far so good.

I'd like to be able to change the style of the comment count on the main page and I'm not having much luck after some searching.

If you visit my blog, http://scotthelme.co.uk, with and without JS enabled you will see what I mean. I would like to change the style for the comment count box so that it matches how it originally was.

Can anyone point me in the right direction on what I need to change?



When JS is disabled my comment count looks like this (correct):

<a href="http://www.scotthelme.co.uk/wifi-insecurity-wpa/#comments" title="Comment on WiFi (in)Security – Even WPA can’t compensate for a weak password">
<span class="dsq-postid" rel="726 http://www.scotthelme.co.uk/?p=726">1</span></a>

When JS is enabled my comment count looks like this:

<a href="http://www.scotthelme.co.uk/wifi-insecurity-wpa/#disqus_thread" title="Comment on WiFi (in)Security – Even WPA can’t compensate for a weak password" data-disqus-identifier="726 http://www.scotthelme.co.uk/?p=726">0 Comments</a>

I'm losing the span that wraps the contents of the anchor tag and need to insert it again.

  • .comments-link you can use this class – Vikas Gautam Sep 17 '13 at 9:14
  • @Vickey thanks for the suggestion, I have updated my answer. It seems to be that the JS is changing the link. I already have a class for .comments-link but this is not the problem. – Scott Helme Sep 17 '13 at 9:26

The comment count in your theme is wrapped in <span class="comments-link">...</span>, so you can set a CSS rule in your CSS file like:

.comments-link {
 //here your rules

For future questions, please, note that questions about pure CSS, not specific to Wordpress, can be more suitable for other sites, may stackoverflow.

  • I have updated my question with some code to show the problem. I already have the .comments-link class in my CSS. The problem is that the JS seems to be changing my comment count output and removing the <span class="dsq-postid" that wraps the content. – Scott Helme Sep 17 '13 at 9:27
  • I suggested to use the class comments-link of the <span> element that wrap the link (<a> element), not the class dsq-postid of the <span> inside the link. So, it doesn't matter if the dsq-postid is gone. – cybmeta Sep 17 '13 at 9:37
  • I've visited your site with and withou javascript and <span class="dsq-postid" is always there. – cybmeta Sep 17 '13 at 10:21
  • Yes that's correct, but when JS is enabled it was removed. I've since realised this was actually my misunderstanding of exactly why the style appeared different. I simply needed to shorten the length of the text inside the comment field! PICNIC... – Scott Helme Sep 17 '13 at 10:33

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.