Jomsocial gets DISQUS'ed

In a recent project we had to implement a uniform commenting system across the site, Jomsocial included. Now obviously, Jomsocial comes with it’s own commenting system, and to make matters worse, there were already thousands of comments already present that needed to be migrated to the new platform.

We suggested the use of Disqus, which is a cloud based commenting system that easily integrates with a website. Thankfully, DISQUS provides a way to import comments from non-compatible systems by importing from a WXR file. 

So the first challenge was to generate a WXR file. Each thread in DISQUS needs to have a unique disqus_thread_id, which is usually unique per page. In case of comments for Joomla Articles, this is usually the article ID. However, since we were using DISQUS for videos, photos and even blogs, we could have easily run into an issue where a video, a photo and a blog have the same id. To overcome this, we prefixed the id with a identifier, so the ID became video.345 or photo.345 or blog.345 Neat eh ;)

Once this architectural challenge was out of the way, it was as simple as writing a script to output a WXR file, and then importing the WXR file into DISQUS. Below is how we wrote a neat little script to generate the file -

WXR Export Script

To create a WXR file for jomsocial videos, we created a disqusimport.php controller and loaded it with the code to create the WXR. Placed this controller in com_community and we were good to fire the exporter. You could of course also create a neat little CLI script to do that.

http://example.com/index.php?option=com_community& controller=disqusimport& task=export_jom_video
Running this will give you a WXR file named export.xml

Now you need to upload this file into your DISQUS account. Login and go to admin section. Then on to Discussions > Import. On this page, upload the file that was created, and within a few of hours the comments should be in your account. Similarly, the export files for photos & albums were created. You can get the code from here - https://gist.github.com/vijaykhollam/456168f52b8fe985adf0#file-export-php

Replace native Jomsocial Comments

The next step was to take out the native wall based commenting from Jomsocial and replace it with DISQUS. That was as easy as adding a few overrides, one each for videos, photos & albums. Specifically, the following files were overrides

1. components/com_community/templates/default/videos.video.php
2. components/com_community/templates/default/photos.photo.php
3. components/com_community/templates/default/photos.album.php

Included below is a link to the code that needs to be added at the bottom of these files to load the DISQUS comments. Next, you need to hide jomsocial comments on each page. We can hide jomsocial comments by overriding wall.form.php file. Code below. That’s it! Once you do these successfully, you should be able to see the existing comments for videos that already have some.

Grab the code here - https://gist.github.com/vijaykhollam/456168f52b8fe985adf0

Reference Links

https://help.disqus.com/customer/portal/articles/472150-custom-xml-import-format
https://help.disqus.com/customer/portal/articles/472098-javascript-configuration-variables