Integrating Disqus with K2

posted by Kelsey 13 June 2010

One of the biggest weaknesses in the Joomla! content management system is its lack of built-in commenting. Where platforms like Wordpress are forging ahead with powerhouse new features aimed at serious content generation, Joomla! is still mired in its Mambo legacy structure. It is not, out of the box, a blogging platform.

While the shift to core Joomla! embracing MVC has allowed designers to leave behind the uniform look of previous iterations of the platform, Joomla! is still first and foremost a CMS, not a blogging platform.

There have been a raft of commenting solutions available for Joomla!, however I am increasingly of the opinion that without some level of social integration, commenting wastes the potential of wider promotion and engagement. Further, I am absolutely sick to death of having to create new user accounts at every site I visit.

If a site offers single-sign-on through social services I breathe a sigh of relief.

So when a commenting system came along that offered both single-sign-on and social integration, I was utterly thrilled.

That system is Disqus.

JoomlaWorks offer a nice Disqus plugin for Joomla!, but it doesn't integrate with K2 (their content construction) kit very well. I love K2 unashamedly. It allows me look and feel customisation that Joomla itself can't easily match. I can also create multiple templates per view, making it a much simpler publishing option for users who just need to upload one image and K2 will resize it for each view and place it according to the template.

A plugin can't match the level of customisation that I require, so I prefer to integrate the Disqus code manually. Here's how:

Note: I'm assuming that you'll be using a template override, in this instance, let's call it blog. The path to this template override would then be:

/your_home_directory/templates/your_template/html/com_k2/templates/blog/

Step 1

Create your Disqus account, setup your Facebook API key, your Akismet API key and any other options you prefer.

Step 2

Choose the 'Universal Code' option at the bottom of the install page:

Step 3

You'll see three steps to install your code. The code in Step 1 is the code that creates the comment form.

Typically, comment forms only appear on the full item, so you'll want to open item.php.

The absolute easiest place to insert the comment form code is straight after this code:

<!-- K2 Plugins: K2AfterDisplay -->

This will place it after author information, tags and any other plugins you have enabled.

If you're slightly more adventurous, you can inspect the code and determine where else you might like to place it. The K2 code is well commented and the css selectors named semantically, so it's not hard to place the code elsewhere if desired.

Step 4

Grab the Javascript code from Step 2 of the Disqus instructions and paste it into the index.php file of your template, right above the closing </body> tag.

Step 5

Step 3 of the Disqus instructions deals with placing the comment anchor. Depending on how you've setup your Disqus account, this can include the number of comments displayed and the number of social reactions. This should link to the full text of the K2 article at the start of the comment area.

Copy the code they give you:

<a href="http://example.com/my_article.html#disqus_thread">Comments</a>

Open the category_item.php file from your template overrides and paste it wherever you would like the comment anchor to appear.

Finally, change the HREF link so that the line of code now looks like this:

<a href="#disqus_thread">comments</a>

The word 'comments' will be replaced by your Disqus setup, such as '0 comments and 0 reactions'. When users click on this link, it will take them to the specific article the category item was displaying, anchored to the comment form.

If you're using a mod_k2_content template override, you can do use the same code with a slight modification:

<a href="#disqus_thread">comments</a>

Conclusion

That's it! A simple and effective way to include commenting with social integration on any K2 template.

tagged:

About the author

Kelsey

Kelsey Brookes is a professional designer, online strategist and writer.

From the late 90s Kelsey managed the multimedia and film courses at the prestigious Computer Graphics College, Sydney and eventually founded the Melbourne chapter of the college.

At the same time, Kelsey was a feature writer for Digital Media World magazine, interviewing subjects from the Australian and overseas film and production industries.

Since 1999 Kelsey has managed thinksync, providing design, online strategy and marketing services to clients around Australia.

E-mail: This e-mail address is being protected from spambots. You need JavaScript enabled to view it