Recently, I have switched across to using Disqus as the comments system on my blog instead of the inbuilt BlogEngine.NET comments.
Immediate benefits are:
- Threaded conversation (i.e you can reply to someone’s comment directly).
- Identify yourself with your Facebook or Twitter account (by logging in safely directly to the Facebook and Twitter sites respectively).
- If you subscribe to the comments conversation by email – you can use email to leave replies to comments on the website.
- Lets you keep track of comments you make across the blogosphere on all sites that use Disqus.
- As the owner of the site you can moderate directly from email notifications (i.e by replying with “Delete”). This makes moderation easy when out on the road.
- Generally looks sleek + many other reasons for using it (link#1, link#2, link#3).
I love comments so feel free to leave any and try the new system out!
Now, for the benefit of anyone using BlogEngine.NET who wishes to do this also, continue reading and I’ll outline the steps I took to do it:
- Create an account at http://disqus.com
- For Facebook integration, get your Facebook connect API key from http://developers.facebook.com/setup.php (you will also be asked to upload a xd_receiver.htm file to the root of your website).
- If you wish to use Akismet spam protection, use your Wordpress account API key located here http://dashboard.wordpress.com/wp-admin/profile.php (in small text at the top of the page)
- Within Disqus, under Settings –> General –> “Cross-domain Receiver URL” it describes an advantage to upload a blank.htm file to the root of your website and pointing to it.
Under Settings –> Customize, change from the new Narcissus theme to either of the Classic ones. I found that the new Narcissus theme’s Reply and Edit buttons on a comment did not work for me as they initiate a post back and the AJAX action is lost. After some FireBug debugging I found that this simply because the buttons do not contain a “return false;” on their onclick events (works fine when I manually add this in using FireBug). I have sent an email to Disqus about this but as of yet have received no reply. [Update: It seems the Narcissus theme has been updated and it works fine now, and looks sleek – I would recommend this one now].
I made the following alterations to various files in my BlogEngine instance (note that some alterations are made to core BE.NET files themselves which is going to make upgrading BE.NET more of a pain but I believed it would be easy enough to integrate again if it was documented well enough, i.e here):
- Retrieve the second code snippet from http://disqus.com/comments/universal and add it to the “Tracking script” section of the BE.NET settings tab.
- Modify /theme/MyTheme/PostView.ascx, removing any html referencing the BE.NET comment system and replacing it with:
<a rel="nofollow" href="<%=Post.PermaLink %>#disqus_thread">Comments</a>
- In the main /post.aspx change the visible property of the CommentView control to false:
<uc:CommentView ID="CommentView1" runat="server" visible="false"/>
And add the following: Yours will vary slightly, your version can be retrieved from the first snippet at http://disqus.com/comments/universal. Note the commented out disqus_developer variable, this can be uncommented to test the system on your local machine before deploying.
- Find the comments variable in /widgets/RecentPosts/widget.ascx.cs and replace the line with: While I was there, I also added a "Read more..." link that links to the archives page (which I think should be there): I do not use the RecentComments widget hence did not have to modify this - it would need to be however if it was used.
- Inside /archive.aspx.cs locate the comments.InnerHtml variable of the CreateTableRow method and replace it with: Note even though you can change what Disqus replaces the text with here by going to the Settings->Customize->Appearance Tab on your Disqus account, this is a global action across your site. Normally the archive page just has a number for the comments, not the "Comments" text itself so I had to modify my theme’s css a bit to accommodate the extra width required in this column.
That’s it :) Looks more daunting in hindsight actually. It would be much nicer if BE.NET had Disqus integrated into the standard build as an option.
Oh, and one more thing, something I have always wanted, comments on BE.NET pages. With the default BE.NET commenting system this is not possible, but with similar Disqus modifications, it is possible to have Disqus comments on your BE.NET pages also :)
Here are the steps I took to enable this:
- Add the following lines under the AdminLinks section of \page.aspx: Once again, yours will vary slightly and can be retrieved from the first snippet at http://disqus.com/comments/universal. There is a little bit of extra code here to make the comments appear only after the link is clicked (for tidyness sake). This is not necessary though.
- Add the following property to \page.aspx.cs:
And enjoy :)
Hamish