31 January 2012

Troubleshooting Blogger’s threaded comments

Earlier this month introduced a long-awaited feature, native threaded comments – with only one level, but still pretty nice to delimit conversations. The instructions sounded easy enough, just a couple of settings to change and the new reply system should kick in. Unfortunately in practice both myself and many other have stumbled across a couple of problems…

If you have Blogger’s commenting feature enabled, “Blog Feed” set to “Full”, and are using “Embedded” comments, then you’re ready to start a discussion with your readers. To check, or change your feed settings, select: “Settings” > “Other” >, and then “Full” from the “Allow Blog Feed” dropdown.

No ‘reply’ button

The first thing I noticed after switching my comments from a pop-up window to embedded was, well, nothing. Meaning the comment form was unchanged, with no new buttons anywhere. I kind of expected something like this because I made several changes to the template and that can prevent centralized code updates from Blogger to install properly. It turned out that was relatively easy to solve: you could either reset the widget templates as suggested on the help forums or – if you have many customizations that would get lost this way – manually go through the template and update the missing pieces of code as explained on the Blogger Developers Network blog. But after doing that I discovered other issues, like:

‘Reply’ button not working

So I got it to show up, but now nothing happened when clicking on the ‘Reply’ button! It looked like there was a missing script and I spent a considerable amount of time trying to track down the source of this problem. First I tried to replace the blog template with a completely new one, which I thought would have the proper updated code – that turned out not to be the case. I compared the source code of an article on my blog to others where the replies were working correctly and I discovered there was indeed a script missing for me:

<script defer='defer' src='//www.blogblog.com/dynamicviews/acacef8b5f7a566b/js/comments.js' type='text/javascript'></script>

This is incidentally the reason why threaded comments were working if I switched to one of the dynamic templates, but not on the older themes. But that wasn’t a proper solution, because I don’t want to switch to a dynamic template just to have replies for comments.

Finally I set up a test blog just to get access to a correct template – replies were working on a freshly created blog. I compared the two templates and discovered several differences, but none of them related to the comment system. Just as I was about to give up on the whole idea of threaded comments for my blog, I discovered a Google Group dedicated to Blogger developers and I posted about my issues there. Now, a week later, I noticed that the replies are finally working for me and the script above is loaded on pages containing comments. I hope the Blogger team has solved a bug and applied the fix to other blogs as well. So, if you previously had problems with the ‘reply’ function now would be the time to test it again, possibly after applying the solutions from the previous section.

Posts with comments not loading in Internet Explorer

Another bug I noticed ever since turning threaded comments on is that blog posts with comments wouldn't load in Internet Explorer 9 anymore – probably a script conflict again. Now, after the replies are working properly in other browsers I looked into this problem again; here are some of the conclusions:

  • The bug only affects the ‘IE9 standards’ mode, so viewers coming from older versions would see the blog loading correctly;
  • My test blog also loads fine, which prompted another observation and a temporary solution. Since I use CSS pretty extensively to style elements on my blog, I have manually edited the template so that the blog would load in ‘IE9 standards’ mode by default – more specifically I added the following code line to the very first section of the template holding meta information:
    <META content='IE=9,chrome=1' http-equiv='X-UA-Compatible'/>
    If you haven’t made any changes to the IE rendering mode, the Blogger default setting will not cause any issues, as it’s optimized for IE7. Or if you have, remove the line above and replace it with this one:
    <meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
  • If you prefer to keep the compatibility with IE9, there is another solution I discovered by comparing the template with the test blog: replace the 'defer' argument on the script mentioned above with 'async'. This is probably an IE-related bug, as the two arguments are not that different. In order to do this you will have to edit the HTML template with ‘Expand Widget Templates’ checked; search for 'defer' – there should only be two occurrences – and replace the two with 'async'. The result should look like this:
    <script async='async' src='//www.blogblog.com/dynamicviews/acacef8b5f7a566b/js/comments.js' type='text/javascript'></script>

Now that I’ve covered the problems I’ve encountered, there is one other thing I don’t like about the implementation: the comment text uses the <blockquote> tag instead of the usual paragraphs. On one hand this choice is not semantic, since comments are original pieces of content, not quotes from other works – or they should be at least – on the other it breaks the design for people who added custom CSS styles to blockquotes – such as myself. I reported my views on this on the same group for Blogger developers and hopefully it will be fixed as well.

0 comments:

Post a Comment