August 04, 2011

Installing Disqus Comments

Disqus is a third-party comment application which can be integrated with your Typepad blog. (Unlimited, Premium, or Business Class plan required to install Disqus comments on your blog.)

Installing Disqus comments requires editing your blog using CSS and HTML code. If you are not comfortable with code, you may want to consider using Typepad Connect which can be installed quickly without the need to edit code at Settings > Comments. Typepad Connect offers threaded comments and other features similar to Disqus. See the FAQ for more details.

Installing Disqus Comments

Step 1 - Register at Disqus

Go to disqus.com and click the Sign Up button. You'll be prompted by Disqus to enter information about you and your blog. Enter the selected information and click Continue.

Step 2 - Install on Typepad

Disqus also has specific instructions for installing on Typepad which apply to most blogs using pre-made or custom themes created with the Theme Builder.

Make sure Typepad Connect is not enabled for your blog or the Disqus code will not work. At Settings > Comments, you can disable Typepad Connect.

1. Go to Design > Content. Select the Embed Your Own HTML module and click the Add This Module button. Enter the code provided by Disqus in the pop-up box and click OK. Save changes.

If you do not have the Content or 'Embed Your Own HTML' option with your design, please see one of the options below:

  • For Chroma and TweetPad Themes, go to Design > Custom Sidebar to add the Disqus code.
  • For mixed media layouts which include the recent photos module, use a Notes TypeList to add the Disqus code. At Library > TypeLists, create a Notes TypeList. Add an item to the TypeList and enter the Disqus code in the Note field. Finally, go to Design > Content to add the TypeList to your blog.
  • With Advanced Templates, the Disqus code can be added anywhere in the Individual Archives Template at Design > Templates.

2. Go to Design > Custom CSS. Please note Custom CSS is only available with Unlimited and higher plans.

In the text field, enter the CSS:

.comments-open { display:none !important; }

Click Save Changes to update your blog.

If you are using Advanced Templates, add the CSS to the Stylesheet Template at Design > Templates.

Comments Count

Comments submitted via Disqus will not be included on the comment count in the post footer unless you use Advanced Templates.

To highlight recent comments, you can place one of the Disqus widgets in your blog's sidebar using the Embed Your Own HTML module, Notes TypeList, or Custom Sidebar.

You can hide the Comments (0) in the Post Footer with some additional CSS:

.entry-comments { display:none !important; }

Installing Comments Count in Advanced Templates

When using Advanced Templates you will need to place the Disqus code, for displaying the number of comments received, just above the </body> tag. The code should be placed in any template related to posts or pages you want the comment count to appear.

Full documentation on comment counts can be found under the associated subsection in the Disqus Universal Code instructions.

When overriding the pre-existing comment counts from Typepad, replace the anchor ID, #comments, with the Disqus ID, #disqus_thread. That change will allow the Disqus count.js script to find the permalinks and replace the old comment count with the new.

Additional Information

  • All comments will be managed through your Disqus account. Comments are not stored or manageable from within your Typepad account.
  • The Comments count in the post footer does not update when new comments are received.
  • Any existing comments on your blog before you install Disqus will no longer display.
  • Any settings and features related to comments within Typepad will not apply to your Disqus comments.
  • Items added to the Block List will not be checked. Instead you will need to use the tools within your Disqus account to block unwanted comments.


Search

Need design help?

Looking to launch a new blog? Have an itch to tweak your design or layout? Want a superior banner or design custom made specifically for your blog? We've got you covered!

Typepad Services badge