Easily Migrate Blogger / Blogspot comments to Disqus

It used to be a really simple process; click a button on Disqus admin, log into blogger, and then comments are migrated. But Disqus was left with a broken import link when Google deprecated some of their APIs. Given that it's been broken for a while, I didn't see that being fixed anytime soon.

So, I finally got some time to roll my own fix based off a bit of code I previously wrote. Now that it's been tested for a few weeks, I've decided to make it public.

This is a multi-step process but doesn't take more than a few minutes each to set up.

Exporting your existing comments

• Go to your Blogger admin and then find the settings item on the left menu.
• Under that, look for "Other settings"
• Click "Export blog" at the top.
• Save the backup file somewhere.

I don't blame you for having trouble finding it. Below is a screenshot of where to click.

Converting your comments to WXR

What you have now are comments in some God-awful XML format which you'll need to convert to Wordpress WXR format, one that Disqus can import.

You can either use my online "Blogger to Disqus comment converter" tool which uses django-disqus, or (if you don't trust me) check out the source and run it yourself.

Setting up Disqus

This part is fairly straight forward.

• Create a Disqus forum for your site.
• Go to the admin and then the Discussions tab
• Click Import
• Select the Generic tab
• Upload the converted WXR file
• While you wait, continue with the setup below.

Setting up Disqus on Blogger

Now that the import process has started, there's just one more thing left to do on your blog. While you wait for the import to complete, set up the Disqus plugin on your blogger so the old comments don't show anymore.

There is a page on Disqus that lets you quickly add the plugin to the site of your choice.

Click on this link and then:

• Click the "Add <disqus forum name> to my Blogger site" button (Step 1. You can ignore step 2 because we already did that)
• Select a blog you wish to use Disqus
• Click "Add widget"

Supporting Internet Explorer users

For those who wish to support Internet Explorer users, there is an extra step involved.

Check the source of your blog and search for "X-UA-Compatible" and check that it's using "EDGE". If it's not there or it's not showing "EDGE", Disqus has a decent tutorial written up here on how to add it into your Blogger template.

And that's the end of that! The Disqus widget on Blogger will handle the rest.

You're finally done!

Sources

• Disqus | Install instructions for Blogger
• How do I import my old comments? | DISQUS
• Updating a Blogger template to support all versions of Internet Explorer | DISQUS
• Manually adding a Disqus gadget to Blogger | DISQUS

A new coat of paint for Twig's Tech Tips!

The good old "classic" layout from blogger.com has certainly served me well since my first post on the 25th of June, 2008. Over the past 5 years, I eventually wanted more space for content as my posts and code snippets became lengthier.

After searching around for a nice free theme, I stumbled upon Ultra Theme from bloggerthemes.net. Applying a few tweaks and updates of my own to the theme, I finally think it's ready!

The main changes are:

• Obviously the colour has changed
• Wider body column
• Wider right column
• Updated blocks on RHS column
• Moved donation blurb to RHS column & semi-fixed it
• Ads actually fit in the given space now
• H4 headings are now actually different to "bolded" text
• Cleaned up some markup so it's quicker to load

I'll probably make more tweaks as I go along, but for now you can compare them side by side below.

 

ps. LOL wow, still works on IE6 (mostly)

Blogger.com: Disable country domain redirects

I'm getting annoyed at my web traffic stats being all messed up because the URLs aren't being counted properly.

People browsing from different part of the world are being redirected to their government friendly top level domains (TLD's) and it's just annoying.

This is meant to be the internet, a place where information roams free from the slow red tape of bureaucracy.

Thankfully, there's a quick fix for this and it doesn't involve any unnecessary pain.

• Firstly, log in to your blogger.com admin.
• Secondly, open up the dashboard for your blog.
• Click "Template"
• Click "Edit HTML"
• Click "Proceed"
• Select "Expand Widget Templates" at the top.
• Using your browser, search for </head>
• Just before that, paste this in:

<script type="text/javascript">
function check_redirect(your_domain) {
if (window.location.host.split('.').pop() != your_domain.split('.').pop()) {
var new_url = window.location.href;
new_url = new_url.replace(window.location.protocol + "//" + window.location.hostname, window.location.protocol + "//" + your_domain + "/ncr");
window.location.href = new_url;
}
}

check_redirect("twigstechtips.blogspot.com.au");
</script>

• Change the 2nd last line to whatever you want your domain to be. In this case, I want to enforce it so everyone visits the .au one.
• Click save.
• Test it out!

Source

• Disable Blogger Country Specific Domain Redirection

Originally I found the information from here, but from inspection it doesn't seem to cover all the domains I have been seeing in the stats such as .co.uk.

I've rewritten it a little so it does the domain detection and replacement better.

Blogger Blogspot: Template code/tag to identify a list or post detail page

Something that's been annoying me for a while is the lack of template tag definitions.

Today I gleamed the template code and found something that would help.

To identify between a listing page (a list of blog posts) and a detail page (a page dedicated to a particular post, where comments are shown), you need the following condition check.

<b:if cond='data:blog.pageType == "item"'>
  <p>This is the post item page. Put your code here</p>
</b:if>

Now, where was I again? Oh yeah, the sign-off image.

Blogger: Can't copy/paste in comment entry text boxes

For some reason, Blogger.com doesn't seem to play nice with comments on Firefox (and surprisingly not Internet Explorer). It's taken me a good while to sit down and figure out whats wrong.

There isn't much information on the net regarding this bug that I could find, and all the pages seem to link back to this one post, which basically has summed up all the symptoms I've noticed.

What a frikken annoying bug this has turned out to be.

Symptoms

• Copy/Paste doesn't work
• Right clicking on the text field shows no options Undo/Cut/Copy/Paste/Delete/Select All
• Home/End keys don't work
• Arrow keys (up, down, left, right) keys don't work
• Selecting all by pressing CTRL+A doesn't work

 
Just in case you didn't believe it

Steps to produce

• In your Blogger account settings, set the comments to "embedded below post"
• Sign out of your account
• Turn off any ad-blockers you may have
• Using Firefox, view post and enter a comment
• Try to copy or paste from the form

Affects

• Firefox 3.5.7 (at time of writing)
• All platforms

Problem?

I was wondering why ad-blocker had to be off for this to happen. After some trial and error, I found the culprit.

For some reason, a gif file loaded by Google Analytics was causing the textbox bug.

The file is loaded at:

http://www.google-analytics.com/__utm.gif?...

Where "..." is a whole bunch of tracking information that records your information.

Blocking this file specifically will stop this bug from occurring, but will probably prevent Analytics from working.

I'm still unsure why being signed in or previewing alleviates the problem.

Solution

Not too sure. I tried removing the image using jQuery but the image isn't actually part of the page, so that doesn't help.

Until Mozilla decides to get around to fixing it, you pretty much have two solutions.

On one hand you can make the comments appear in a popup, which is uber annoying.

On the other, you can stop using Google Analytics.

If you wish to keep using both, leave a message for users to either sign in or preview comments before submitting. This way, it re-enables copy/paste in the form.

If you have any other solutions, feel free to let me know!