YJL

Recently, I noticed there was an Disqus issue with mobile template. I wrote my own Blogger template (the template in the post is super outdated) and didn't care about mobile, although 3.5% of visitors are mobile users. Every day, there is a few posts with ?m=1 in my daily report, they had been under my radar for very long time.

Few days ago, I simply set desktop theme as mobile theme after I saw the comments were from Blogger's commenting system, so Disqus comments will show up and I don't have to update Blogger layout widget for mobile devices. Going through those XML without proper official documentation is a pain-in-ass and unfair guessing game, you will see an example later in this post.

I wasn't aware that even Disqus loaded, it didn't really work properly due to mis-configuration. On Disqus, the query part is part of identification of a thread and that would be a problem since a not-too-old-with-slug-feature blogging platform most likely wouldn't require to use something like ?p=### to identify a post which visitor is requesting.

So, for mobile users, ?m=1 would be a problem as well as some tracking query which are appended after post URLs.

If you use automatic method when you migrate to Disqus, which Disqus edits the template for you, then you should be fine. However, if you write your own template from scratch and add XML and JavaScript for Disqus by hand, you may want to double-check. I also suspect Blogger's ccTLD resolution might also cause same issue. If you live in USA and you may not even be aware of it since it's always be .blogspot.com for you unless you use custom domain as I do, then ccTLD wouldn't cause you any trouble.

Be sure to append ?m=1 to a post which has comments, check if those comments are loaded. If it says 0 comments, then it's time to fix your template.

The quickest way is to set disqus_url:

<script>
  var disqus_url = "<data:blog.canonicalUrl/>";
  if (!disqus_url.length) {
    disqus_url = "<data:blog.url/>";
  }
</script>

or simply use the following in posts loop:

<script>var disqus_url = "<data:post.canonicalUrl/>";</script>

I adopted the code from Disqus' code, Blogger's documentation has no mention of canonical link. Before I checked out Disqus' code, I used

// needs jQuery
window.disqus_url = $('link[rel=canonical]').attr('href');
// and another possible method
window.disqus_url = location.protocol + '://[THE_BLOG_DOMAIN]' + location.pathname;

I think Disqus should look up if there is a canonical in presence before it uses window.location.href:

<link rel="canonical" href="http://example.com/">

---

Just for the record, the old Disqus method's code looks like:

<!-- +disqus -->

<a class='dsq-comment-count comment-link commentslink' expr:href='data:post.canonicalUrl + &quot;#disqus_thread&quot;'>View Comments</a>

<!-- -disqus -->

<!-- +disqus -->

<div id='disqus_thread'/>
<div id='disqus_post_title' style='display:none;'><data:post.title/></div>
<div id='disqus_post_message' style='display:none;'><data:post.body/></div>
<script type='text/javascript'>
  var disqus_url = '';
  var disqus_title = document.getElementById('disqus_post_title').innerHTML;
  var disqus_message = document.getElementById('disqus_post_message').innerHTML;
</script>
<script src='http://disqus.com/forums/[DISQUS_SHORTNAME]/embed.js' type='text/javascript'></script>
<noscript>Please enable JavaScript to view the <a expr:href='&quot;http://disqus.com/?ref_noscript=[DISQUS_SHORTNAME].disqus.com&quot; + data:post.url'>comments powered by Disqus.</a></noscript>
<a class='dsq-brlink' expr:href='&quot;http://disqus.com&quot;'>blog comments powered by <span class='logo-disqus'>Disqus</span></a>

<!-- -disqus -->

<!-- +disqus -->

<b:if cond='data:blog.pageType != &quot;item&quot;'>
  <script type='text/javascript'>
    (function() {
      var links = document.getElementsByTagName('a');
      var query = '?';
      for(var i = 0; i < links.length; i++) {
        if(links[i].href.indexOf('#disqus_thread') >= 0) {
          query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
        }
      }
      document.write('<script src="http://disqus.com/forums/[DISQUS_SHORTNAME]/get_num_replies.js' + query + '" type="text/javascript"></' + 'script>');
    })();
  </script>
</b:if>

<!-- -disqus -->

The new method's code as follows, it's much cleaner, but not working for my template, it seems to have specific requirements on element IDs or that sort of things.

<b:includable id="main">
  <script type="text/javascript">
    var disqus_shortname = '[DISQUS_SHORTNAME]';
    var disqus_blogger_current_url = "<data:blog.canonicalUrl/>";
    if (!disqus_blogger_current_url.length) {
      disqus_blogger_current_url = "<data:blog.url/>";
    }
    var disqus_blogger_homepage_url = "<data:blog.homepageUrl/>";
    var disqus_blogger_canonical_homepage_url = "<data:blog.canonicalHomepageUrl/>";
  </script>
  <b:if cond="data:blog.pageType == &quot;item&quot;">
    <style type="text/css">
      #comments {display:none;}
    </style>
    <script type="text/javascript">
      (function() {
        var bloggerjs = document.createElement('script');
        bloggerjs.type = 'text/javascript';
        bloggerjs.async = true;
        bloggerjs.src = 'http://'+disqus_shortname+'.disqus.com/blogger_item.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(bloggerjs);
      })();
    </script>
  </b:if>
    <style type="text/css">
      .post-comment-link { visibility: hidden; }
    </style>
    <script type="text/javascript">
    (function() {
      var bloggerjs = document.createElement('script');
      bloggerjs.type = 'text/javascript';
      bloggerjs.async = true;
      bloggerjs.src = 'http://'+disqus_shortname+'.disqus.com/blogger_index.js';
      (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(bloggerjs);
    })();
    </script>
</b:includable>

I had put a link to Dynamic Views (simply append /view/ in URL) on top navigation for a very long time. Dynamic Views isn't too bad as an alternative way to view a blog, if you have a nice computer, it's kind of resource hug in my opinion. Anyhow, I'd like readers to have option to choose when it's in arm's reach already.

But two days ago, I noticed it now shows comments and a comment form. I may be wrong since I don't use Dynamic Views, but I don't recall they were in Dynamic Views before, a popup window or something was the way to access comments before.

I went to change Comment Location to Hide, I thought it did what it meant, hiding the comments. And it did hide the comments section, but it also disallowed commenting. This caused my blog showing no comment section for almost two days until I just found out moments ago.

Why I mention disallow when it seems to be implied as you choose to hide comments? Because I use Disqus and I enable the comment synchronization, so the comments will be posted back to Blogger's comment system from Disqus' for backup purpose.

The first problem is it hides not only the comments but also the comments in normal Blogger layout, it's a simple template design issue. I can bypass it, but the problem is the Hide means Disallow, so Disqus can no longer synchronize back the comments. I have no choice to turn it back on, if I want to backup comments.

Why in the first place I do not want comments to show up in Dynamic Views? Because I can only make comments synchronize back to Blogger, not the other way around, or duplex. Therefore, I must not allow regular readers to have chance to access Blogger comment form.

If you want to suggest why not just enable Disqus in Dynamic Views? Because we can't, maybe in future. Dynamic Views is a unique interface and I totally agreed with that, but it should be little more flexible on option on/off.

There may be a way to get around, I think you can add Disqus embed code in each post to have it, I saw some project for having Gist embedded in Dynamic Views. However, it's utterly impractical as how much effort you must to put in for Disqus to show up.

I tried to add a message to Comment Form Message to ask people not to comment in Dynamic Views, that setting doesn't work for Dynamic Views, same as Embedded/Full page/Popup window, comments always embedded in the post.

Anyway, since I have no control for comment section in Dynamic Views, I decided to take that link down, even though people can still append /view/ to access it.

I have to say, I hardly see any blogs use Dynamic Views. Not even Google's blogs. It seems Blogger team developed a product doesn't gain much utilization. Much same to Blogger Stats, but in the value bloggers give to it. The worst part is not the lack of customization, but no option to turn them off completely.

I recently discovered you can have special @mentions in Disqus comments while I was reading comments on some website. Here is a screenshot of an example I made with comments on my post:


I like this feature, though it might not be very helpful to me, because that's same reason why I only discovered this by accident almost one year later. I am sure some of you who have commented on Disqus system hadn't yet known about this feature.

The reason of being unknown to me is I reply to the comment with threading, the major feature I need. Since I directly reply to the comment, my comment will be placed below the comment with indentation. It is crystal clear that whom I am talking to. I don't even need to write down the commenter's name, I only need to refer to the person as you. Hence, I never knew about this and I had unsubscribed from Disqus' blog long ago until the comment with that @mentions I just read.

If Blogger's old flat commenting system had this feature, I probably wouldn't need to switch to Disqus. As I mentioned in previous post, threading is an important feature to me.

Although @mentions does not have much significances in threading system, but it's always to have a good feature like this. You may still need to refer to multiple previous commenter.

Another good add-on on this feature is the email alert, you will receive a notification when you get mentioned. This may be helpful when you forget to subscribe to the discussions (I am not entirely sure if there is an auto-subscription when you comment). You can turn if off in your profile settings:


I always like blogs or websites which use Disqus rather than the original or other third-party commenting systems. One reason is people can read all of my Disqus comments across websites in one place, although I don't like the designs of in-page pop profile frame or the profile page on Disqus. I often read someone's profile to see what they were talking. It is a good way to decide whether a commenter actually is a spammer or not.

The other reason is, again, the threading, that's default to all websites which uses Disqus and I love that very much.

I have thought about moving back to Blogger's commenting system many times, after all, Disqus is an external system. It may be gone one day, nothing last forever that I've learned over the years. If that's Blogger, then it really doesn't matter since your blog would be gone with Blogger. But if it's an external system, when their data is gone, your blog is still available but people will see holes, missing pieces like when your image hosting service has gone.

Disqus comments sync-back feature may help the issue a bit, but when threaded comments become flattened comments, they doesn't read as clear as before, confusion would be added among the comments.

However it seems that more and more impossible for me to do so. I am really stuck with Disqus, ain't I? But I am not complaining at all, I will keep using Disqus like a bajillian of years only if I can live that long.