Add Comments to Any Website in Less Than 5 Minutes

Hi Everyone,

In today's Instructable, we will look into Disqus and how it can be added as a comments platform to any site. In particular, we will look at how to properly set it up with Laravel.

• $50 off shared hosting
• Other hosting option

When running a blog, a common way to get visitor feedback is to add comments to your site where visitors will be able to add their opinions or suggestions. If you are a developer, you can definitely build such a system but almost always that will be a difficult option to maintain.

Instead, my recommendation is that you use some of the services offered by a lot of companies where you can add the comments as an external script. Based on the features it offers, I choose Disqus.

To install Disqus on your site, you will first need an account. Once you register or login you will need to click on the gear icon, next to your profile picture and choose the “Add Disqus To Site” menu option.

This will open up a page explaining what Disqus can offer and at the bottom, there is a button called “Get Started”. With a click on that and selecting that you want to add Disqus on your site, you will be presented with a form where you will need to enter the site name for which you will add the comments and choose the category where it belongs.

Clicking on “Create Site” will bring you to the subscription plan selection options from where I chose the basic free option but you can select as you prefer.

Depending on the type of site that you own, if you see your platform on the list, you will need to follow the instructions differently than this. My site is built with Laravel and since Laravel is not on the list we will install Disqus using the “Universal Code” that is on the bottom of the page.

This universal code consists of a piece of HTML and Javascript that will load the comments module on every page that it is added to. On my site, I have a common view file that displays my blog posts and it is only there that I want to display the option for people to add comments. This is entirely up to you to decide where you want the comments to be shown.

I’m adding mine at the bottom of the article page, just below the display of the tags for it, so I’ve copied and pasted the code after the article container.

The code has a section that is commented out, and we first need to remove the comments form it and then we need to edit the two variables that are set inside. In order for Disqus to be able to identify our pages and load the comments just for that page, the two variables that we need to set are the page URL and a unique identifier for the page.

For Laravel, you can get the current URL of the page by calling in the Request facade and its “url()” method. This will return the full URL of the current request as a string that we will then print out in the JavaScript configuration section for Disqus. For the post, I’m using Canvas as the CMS so every time I create a new article, the CMS will give a unique ID to it. We can use this ID to set as the unique identifier for Disqus.

I saved the file and immediately went to test it out, but to my surprise, the comments did not work.

I did check the console for any errors and sure enough, I found out that I forgot to add parentheses to the printing of the strings, so the code was trying to read the URL as a variable which it obviously didn’t exist.

I’ve now added the single quotation marks around the two printed variables and I was happily greeted with the Disqus comments form when I refreshed the page.

For now, this should be a good solution as I don’t really expect too many comments on the site. It only took 5 minutes to implement and I don't need to worry about handling spam.

If you want to see more similar content in the future or any of my other projects than be sure to subscribe and I’ll see you in the next one!