How to fix the “Cannot read property ‘appendChild’ of null” error when using Disqus and Squarespace 5

Normally I write articles about improving software quality, but this one is just to help some poor soul out there that struggled with this issue for 1+ hours like I did.  If you’re not using squarespace or disqus, this article won’t be of interest to you.  Feel free to skip it, I won’t be offended.

I was working on friend’s squarespace 5 blog and trying to set up disqus comments on it.  First I want to address a point of confusion in their documentation.  It says

Scroll down to Edit Footer and paste the following code in the text field…

Instead of “Edit Footer” they should have said “Edit Website Footer”.

After I added the disqus code, I noticed that I could see the comments for some articles, but not others.  I checked the JavaScript console and noticed this error in the log whenever the comments would not load:

After a lot of effort, I figured out how to fix this issue: If you turn the comments off in squarespace, disqus will give you this error and not load properly.  To fix the issue, you need to check this checkbox named “Enable Comments”:

Capture

I suppose this may very well be behaving as designed.  I think what’s going on is that enabling comments creates some HTML in the post that disqus looks for to latch on to.  If it can’t find that HTML, it errors.  Unfortunately, this error is not very informative and I assumed something was broken.  It took me a while to figure out that I need to enable squarespace comments for disqus comments to work correctly.

I hope this saves someone else a lot of time in the future.

Join the email list for bonus content.

Leave a Reply

Your email address will not be published. Required fields are marked *