8.4 Set Up a Reader Comments System

A Comments system will allow us and our authors to get feedback from our readers. But it is important that it also come with a spam captcha filter, nested comments, category filters, an email subscription system and a moderation function. Currently, the top rated free comment system in the Joomla extension directory is called Akeeba Engage. This tool allows our visitors to enter comments using a simple version of the JCE editor. All comments are securely stored in our site’s database. We can choose which categories should have comments. We can also auto-close comments after a specific period of time such as 30 days after the article’s publish date. We can also manage comments from either the frontend or backend. We can optionally require CAPTCHA for guest comments, non-special users' comments or for all comments. Notifications about comments can be sent to managers and optionally the participants of a conversation using customizable email templates. We can also send email notifications to article authors and to people when their comment receives a reply. Anyone but comment managers can unsubscribe from the notifications. Here is the link:

https://extensions.joomla.org/extension/contacts-and-feedback/articles-comments/akeeba-engage/

Click on Download to download the extension. Then go to System, Install, Extensions to install the extension.

Step 1 Publish five of the Comments Plugins

Go to System, Manage, Plugins and enter Akeeba Engage in the search box to review each of the following ten plugins.

5 plugins were automatically published when we installed Akeeba Engage:

Console – Akeeba Engage. This plugin adds Akeeba Engage commands to the Joomla console application. It must remain enabled.

Content – Akeeba Engage. This displays the comments interface in articles and tells Joomla to show you the Comments options when editing categories and articles. It must remain enabled. This plugin is responsible for the following:

Display comments in articles in the public frontend.

Display comment options in categories and articles.

Display the article title in the backend comments management list.

Clear the comments cache when the article cache is being cleared.

Akeeba Engage Emails. Sends emails to comment managers and subscribed users. This plugin makes email sending possible. It needs to be enabled for any emails to be sent at all. If you disable it no emails will be sent. Click on it to open it. There are two questions set for No. It is recommended to leave both at No. By default, comment managers are only notified when an unpublished comment is submitted. Enabling this option will notify comment managers about all comments, including those which get immediately published. This option is highly discouraged on most sites. Even on personal blog sites it's typically best to use the Author notification option in the Component options or the category options instead.

User – Akeeba Engage. This deletes comments when you delete a user account which was used to comment on articles. If you unpublish this plugin you will see a lot of "User not found" errors popping up in your site's frontend. It must remain enabled.

Akeeba Engage Gravatar Integration. Displays avatar for comments using the free, third party Gravatar service. It is enabled by default. But at least initially, we will disable it. Akeeba Engage ships with a default configuration that lets it display user avatars using the third party, free of charge Gravatar service. You can configure Gravatar options by editing the plugin "Akeeba Engage – Gravatar integration". If you disable this plugin no avatars will be displayed. Initially, we will start with the Avatar plugin disabled. You can always add avatars later.

System – Akeeba Engage cache support. This tells Joomla to take into consideration Akeeba Engage's pagination when caching pages in the frontend. If you unpublish this plugin and you have caching turned on your site, guest users will only be able to see the first page of comments and think that the comments' pagination broke. When installed, this plugin is disabled. We will enable it.

Step 2 Choose where you want to make your configurations.

As with Joomla Configurations, there are three places to set configurations:

Global Configurations are set by going to Components, Akeeba Engage and clicking the Options button.

Category Configurations can be set for each Topic Category by going to the Category Settings.

Article Configurations can be set for each article by going to Article Option settings in the Article Edit screen.

Akeeba Engage first looks at the parameters in the article being displayed. If any parameter is set to anything other than “Use Global” (that's the default setting for all options in categories and articles) this is the setting that will be used.

If there are any parameters left with the “Use Global” setting, Akeeba Engage will look into the article's category. The same thing happens there; if there's a value other than “Use Global” it's used.

If there are still any parameters left with the “Use Global” setting, Akeeba Engage will look into the parent category. This will keep going until there is no parameter left in the “Use Global” setting OR we reach the topmost category.

If at this point there are still any parameters set to “Use Global” we will use the values specified here, in the component's configuration. This configuration concept mirrors how Joomla works with article, category and the Articles component's parameters.

Step 3 Begin by setting options in Global Configurations.

Go to Components, Akeeba Engage and click on the Options button.

Maximum Comment Nesting: Comments can be nested as a a reply to another comment. By default, the maximum level is 3 levels. This means that you can have top level comments, replies to top level comments and replies to the replies. With the default maximum of 3 levels: if you try to reply to a reply of a reply (3rd level comment) your comment will also be a 3rd level comment. Its parent, i.e. the comment you are seemingly replying to, will be the reply to the top-level comment (the 2nd level comment). To avoid confusion, we will change Maximum Nesting to 2 to only allow replies to top level comments.

Number of Comments per page: By default, Akeeba Engage uses Joomla's pagination limits, as set in the Global Configuration, for comments. This option allows you to change that limit. If an article has more comments than this limit then the comments will be paginated. A pagination navigation element is shown at the bottom of the comments.

It is recommended that you set this limit at 20 comments per page. Do remember that all comments appearing on the page need to be loaded from the database first. If you select a very high number (100 or more) or “All” you may run out of PHP memory which will result in your site showing an error or a blank page.

CAPTCHA for Comments: Having comments on your site is a wonderful way to engage your audience but it also opens your site to abuse by comment spammers. Left unchecked, a comment section can rapidly descend into chaos and possibly hurt your search engine rankings. The first line of defence is a CAPTCHA. Akeeba Engage supports all CAPTCHA plugins which are compatible with Joomla. This option allows you to select which CAPTCHA plugin Akeeba Engage should use. We have already set up a Captcha tool which is shown already in this option.

Use CAPTCHA for these users: While a CAPTCHA is a powerful way to prevent comment spam it can also hinder legitimate users from submitting a comment. Akeeba Engage lets you determine which users should be shown a CAPTCHA when filing a new comment. Your options are:

Guests. This is the most lax setting. Only users who are not already logged in will be shown a CAPTCHA. We do not recommend this option.

Anyone but comment administrators. This is a balanced setting. Everyone except comment managers (users with the Edit State privilege for Akeeba Engage) will be asked to solve a CAPTCHA when submitting a comment. This is the recommended setting. This requires everyone to solve a CAPTCHA to submit a comment, unless they are a comments administrator. The idea is that the most determined spammers use bots to register user accounts and even follow the email validation link. Putting a CAPTCHA in front of them increases their cost and they are more likely to leave you alone.

Guests must accept terms. Do not enable.

Terms checkbox text. We will leave it at no for now. If it is set for yes, then enter the text which will be displayed in the checkbox the users will be required to check to post a comment. You can use full HTML. If left blank a generic text will be used (see the COM_ENGAGE_COMMENTS_FORM_LBL_ACCEPT language key).

Comment area hidden by default. Leave it set for No.

Show Please Wait. Leave it set for No. Minimum comment length. Leave it set for 0.

Maximum comment length. Leave it set for 0. This will allow any length.

New Comments: Should new comments be published by default for all topic categories? It is best to turn off publishing new comments globally as this will allow us to set which Topic categories we want to allow comments on. So set Allow new comments to No.

Comments interface. Should comments be shown at all? Set this to Hide in the component and Show only on specific categories where comments are relevant. Setting Comments interface to Hide tells Akeeba Engage to not show the comments and not allow filing any new comments unless we explicitly allow comments for a specific Category . Please note that merely hiding the comments interface does not make it impossible for comments to be filed. An advanced user can in many cases guess the correct URL to submit a comment.

Text Filtering Tab Options

Akeeba Engage comes with a well-established, independently audited library called HTML Purifier. Akeeba Engage uses HTML Purifier by default using the configuration you have set up in Joomla's Text Filters. HTML Purifier (allow minimal HTML). Strongly recommended. Only the following tags and attributes are permitted: p, b, a (with the href attribute), i, u, strong, em, small, big, span (with the style attribute), font (with the size and/or color attributes), ul, ol, li, br, img (with a combination of the src, width and height attributes), code, pre, blockquote. No other tags or attributes are permitted. So Leave the HTML purifier uses Joomla Text Filters set for No.

Step 4 Advanced Tab Options

Login Module: If you do not enable guest comments, your users will need to log in to submit a comment. Without an obvious way to do so they may assume that submitting comments is impossible. By default, Akeeba Engage will display Joomla's Login module in the comment area to prompt users to log in. You can select a different module here. The downside is that you can not configure the Login module you include here. So we will set this to “( Do not display )” and publish a custom login module in the engage-login position.

To clarify: If you select “( Do not display )“ but at the same time you have also not published any custom module in the engage-login position then the default Joomla! login module will be displayed instead. You cannot simply not display any module at all. Another option besides the ugly Login Module is to publish a Custom module with text “To submit a comment , please go to our bottom menu and register and log into our site first.” where the “register” part has a link to our site's login page. We will call the custom module Comment Notice. Hide the title. Leave it published.

Then assign it to the special module position called engage-login by typing this into the position box then press enter on your keyboard.

Other engage module positions include:

engage-before-comments

Displayed below the comments header, before the list of comments.

engage-after-comments

Displayed after the list of comments but before the pagination links (if any).

Maximum spam age. Comments marked as spam posted this many days ago will be automatically deleted. This is a convenience option so you don't have to delete spam manually. The default is 15 days. We will leave it at that.

Load custom CSS. By default, Akeeba Engage uses Bootstrap 5 CSS classes to style the comments in the frontend of your site. This setting is for sites that do not have Bootstrap 5 loaded. Since we do, leave it set for No. If and when Joomla gets rid of Bootstrap 5, then we will change it to yes.

HTML Purifier inclusion. Do not change

Step 5 Set your Comments PERMISSIONS TAB OPTIONS

Set Joomla Permissions to Control who submits comments

Akeeba Engage uses Joomla's permissions system to determine who can comment on articles, who gets to edit their own or other people's comments, change their publish status, manage spam and delete existing comments. You can manage these permissions by going into Akeeba Engage and clicking the Options button. Click on the Permissions tab. It opens at the Permissions allowed to the Public. They are not allowed to post comments.

01

The following permissions are provided for each user group:

Configure ACL & Options. Gives access to make changes on the Permissions tab of the Options page of Akeeba Engage.

Configure Options Only. GIves access to the Options page of Akeeba Engage.

Access Administration Interface. Gives access to the backend administrator interface of Akeeba Engage.

Comment. User can submit new comments or replies to existing comments.

Delete. User can delete comments filed by anyone.

Edit. User can edit comments submitted by anyone.

Edit Own. User can edit their own comment.

Edit State. User can publish, unpublish, mark as spam, or mark as non spam and publish any comment. Users with this privilege are comment managers and enjoy a special status in Akeeba Engage. Do not give readers permission to use the Edit state. Users with that privilege can mark as spam, mark as not spam, publish and unpublish any comment. Essentially, users with this privilege are comment managers.

By default, Joomla! allows creation of new items – including comments – only to users in the Author, Editor, Publisher, Manager, Administrator, and Super Administrator groups. We also want people who are Registered and logged in to submit comments. So we will set the Comment privilege to Allowed for registered members. Requiring registration leads to readers posting more polite comments. It also allows us to unregister anyone whose comments are not polite. Select who can submit and manage comments. Click on the Registered group and set the Comment privilege to Allowed. Also allow them to edit their own comments:

02

Because any user with more permissions than a registered user automatically inherit the registered group permissions, the above means that all groups including authors, editors and publishers will be able to edit and post comments.

Click on the Author group to see their permissions to see they are now allowed to comment and edit their own comments. Click on the Editors group to see that they can edit their own comments and the comments of others:

03

Click on the Publishers (front end) group to see they can do everything but delete comments.

04

Click on the Manager (backend) group to see that they can delete comments:

05

Click on the (backend) Administrator group to see that they can access the backend administrative interface.

06

Click on Tech team to see they can do everything except change the access control levels (ACL) which is something only the Super User can do:

07

We don't have to specify who can manage comments. Comment management is granted to users who are allowed the Edit State privilege. By default, this is Publisher, Manager, Administrator and Super Users. We have also given this right to the Tech Team, the Newsletter team and the Events team. But Featured Authors do not have this right. They can only post comments and edit their own comments. Click on Save & Close to close the Permissions screen.

Step 6 Create a JCE Comments Editor

We have previously configured a “Super User” version of our JCE editor for those with access to the backend of our website to create and edit articles and modules. We have also created a “default” version of our JCE editor for authors posting articles on the front end of our website. Click on the Default editor and in the Setup tab, scroll down the page to see that we have already added “registered “ users to the allowed User Groups. Because this editor will now be used for Comments, we will simplify the editing tools that these users see. Click Features and Layout. Then scroll down to the Current Editor Layout.

08

We will drag several buttons out of this layout and down to the Available Buttons bar. Here is the simple version:

09

Click on Save & Close. We have already set the JCE editor as our editor in Joomla Global Configurations. The JCE editor will first look to see who wants to use this editor. If they are a registered user they will get the simple version. If the person is a backend administrator, they will get the more complete version.

Step 7 Set Up Email Notifications
Akeeba Engage is able to send notification emails to comments administrators when their action is required and to users when they receive a reply to their comments. You can control these features by going to System, Manage, Plugins and entering Akeeba Engage in the Search box.

Then edit the “Akeeba Engage – Emails” plugin. We have previously set both of these options for no. But there are still a lot of emails that will be sent. Options about when emails are sent can be defined both in the Component options and the respective option overrides in each category and article.

Akeeba Engage comes with a default configuration which will send emails under certain conditions. For example, comment managers will receive an email when a user files a comment that is either unpublished by default or detected as spam (see Spam protection below). Moreover, when a user submits a comment in reply to another comment the author of the comment being replied to will receive an email notification. The emails are sent with rich HTML templates. You can edit the email templates by going to Components, Akeeba Engage and clicking on the Email Templates tab.

10

There are three buttons on this page.

Mail Templates takes you directly to Joomla's Mail Templates page.

Install or Update installs new email templates and updates existing ones if they've changed. User-modified email templates for are left intact.

Reset will reset the email templates to factory defaults. This is the nuclear option. It removes all of the email templates for Akeeba Engage, including any user-modified email templates. Then it installs all of the Akeeba Engage email templates afresh. Only use this button if you think you've damaged something in your database. Otherwise use Joomla's Mail Templates page to reset each email's subject and body to the default using the buttons provided in Joomla's interface.

Click on the Mail Templates Blue button: This takes you to the Joomla Email Templates page. You can reach this same pagee by going to Systems, Templates, Mail Templates. Here you will see five Akeeba Engage default email templates:

11

Click on the first email template which asks comment managers to moderate a new unpublished comment.

12

You can see that these are relatively easy to customize. Click Close.

Step 8 Configure a Category to allow comments

We currently have our Comments Component to not allow any comments. We will now override this setting by changing these settings for a single category. We recommend starting with a single category and testing it for awhile. Go to Content, Categories. We will set up comments for our Business category. Click the Comments tab.

Set Comments Interface to Show.

Set New Comments to Published.

Summary on Featured display. For now, set it to Hide.

Summary on Blog display. For now, set it to Hide.

Summary on Newsflash module. For now, set it to Hide.

Comments ordering. Comments are ordered by date and nesting level, in this order. This option determines how the comments should be ordered by date. Ascending means that the oldest comment is first. Descending means that the newest comment is first. It's strongly recommended that you use Ascending.

Close comments after this many days. If this is 0 comments are never close automatically. Any non-zero setting means that comments will be automatically closed this many days after an article was first published. A setting of 365 means that comments are allowed only during the first year since the comment was published.

Allow new comments. Set it for Yes.

Close Comments after this many days. Set it for 30 days.

Notify author. Set it for yes.

Notify users. Set it for yes.

Click on Save & Close to apply your changes.

Step 9 Log into the front end of your site and make a comment

Also log in again as a different member and reply to the comment. We want to see if the author of the article is notified and if the reader making the comment is notified of a reply to their comment. We also want to see if setting up comments for a parent category provide the comments area for child categories. In our case, the answer was yes.

Here is what the comment area looks like below the article.

13

Type in a comment. Then fill in the Captcha. Then click Save. The reply was Your comment was posted successfully.

14

Log out and then log in as a different person to make a reply.

15

I got emails notifying me of the comment and the reply because I am the author. However, I did not get an email about the reply to my first comment as a reader.

Step 10 Comment Management
Go to Components, Akeeba Engage. You should see a couple of comments listed with the newest comment first. The list includes all comments filed by all users in all categories. Click Filter Options to see three different filters. You will also see a Sort Table by drop down with lots of options:

16

Select an article and then click on the Actions drop down:

17

Comment List Toolbar buttons

The toolbar at the top of the page offers the following administrative functions. Each function applies to all comments selected in the list below.

Actions. The actions drop–down menu offers the following 5 options:

Publish. Publishes the comment. The comment will be visible to everyone. Note that we have set comments to be automatically published.

Unpublish. Unpublishes the comment. The comment will be hidden for everyone except comment managers.

Possible spam. Marks the comment as spam. The comment is hidden for everyone except comment managers.

Spam and Delete: This will delete the comment from the database.

Not Spam and Publish. Only applies for comments already marked as possible spam. It publishes the comment. Moreover, it informs the Akeeba Engage anti-spam plugins that this comment is definitely not spam.

There are also three standalone toolbar buttons

Delete. Deletes the comment.

WARNING! Deleting a comment, either directly or with the Spam and Delete button, will delete the selected comment and all of its replies and their replies etc. Basically, it deletes the entire comment thread under the comment you are deleting. Akeeba Engage will warn you before doing so. Once a comment thread is deleted it cannot be restored!

Email templates. Displays information about the Email templates used by Akeeba Engage when sending email messages to comment administrators and people who have submitted comments.

Options. Redirects you to the component's Options page.

FILTER OPTIONS

Right above the list there's the standard Joomla! filters button. This allows us to limit the comments displayed. Use the filters to narrow down a search for specific comments. As shown in the image above, there are three filters:

— Select Status — is a drop down. You can limit the display by the status of the comment: published, unpublished or (possible) spam.

The two date fields, Since and To allow you to narrow down your search using specific limits for the Posted On date and time (when a comment was submitted). If both Since and To are set: display all matching comments submitted between Since and To, inclusive. If only Since is set: display all matching comments submitted on or after the Since date and time.If only To is set: display all matching comments submitted on or before the To date and time.

SEARCH BOX
To the left of the Filter button is the Search box. Search will match the comment text or the name or email address of the person submitting a comment. You can prefix your search string to look for specific information instead:

user: Display the comments submitted by someone whose name or email address partially matches the text entered after the prefix.

title: Display the comments submitted for a content item whose title partially matches the text entered after the prefix.

LIST ELEMENTS
Each row of the list represents a comment.The checkmark at the leftmost column allows you to select comments. The Author column shows information about the user who submitted the comment. You can see their avatar, if available. Next to the avatar there might be an icon. An icon of two people represents a guest comment. An icon of a single person represents a comment submitted by a logged in user. A star represents a comment submitted by a comments administrator. Next to the icon you can see the full name of the person who submitted the comment. Below that you will see their email address. Below that you can see if they filed the comment from a mobile or desktop device. Below that is the IP address from which the comment was filed. If you see something that looks like junk characters select the comment and click on Spam and Delete. Finally there is a magnifying glass button on that last line. Clicking on it will filter the comments by that IP address.

The Comment column shows you a summary of the submitted comment. If the comment is a reply to another comment the top line will show which comment it is in reply to.

If you click the name of the person the comment is in reply to a new tab will open in your browser showing the comment in its full context in the public frontend of your site. One the same line there's an Edit link which shows you the Edit page for that comment.

Below this you can find the comment text. There's a button to display the entire comment in a modal dialog. Right below you can see the title of the article the comment was submitted on. The line below shows you how many comments in total have been submitted on that content item.

Next to it there's the “Filter by content” button which lets you display only the comments submitted on this article. If filtering is already enabled this changes to “Remove filter by Content”; clicking it removes the article filter and you will see comments from all articles again.

Finally, the View content link will display the article in the frontend of your site.

The Posted on column shows you the date and time the comment was submitted.

Finally, the Enabled column shows you the publish status of the comment (published, unpublished or spam).

Editing a comment

Editing a comment allows you to change the following fields:

  • Enabled. The publish state of the comment.
  • Name. The name of the person submitting the comment. Only applies for guest comments.
  • Email address. The email address of the person submitting the comment. Only applies for guest comments.
  • Posted on. When was the comment posted.
  • IP address. The IP address of the person submitting the comment.
  • User Agent string. The User Agent string of the browser used to submit the comment.
  • Modified Date. Not editable. The date and time someone edited the comment.
  • Modified By. Not editable. The user who last edited the comment.
  • Comment. The comment itself, using your preferred HTML editor.

Please note that the IP address and User Agent string are saved with the comment for spam prevention reasons.

Comment System Security Precautions
Any user-submitted HTML document can be a security problem. A malicious user may try to embed malicious content (e.g. an SVG crafted in a way to cause JavaScript to be executed on the victim's computer. It, therefore, imperative that you do NOT allow untrusted users to submit potentially malicious content. Our commenting system has several tools to protect against malicious code. The first tool is the filtering tool supplied by Akeeba. It will strip nearly all bad code. Second, the Joomla comes with filtering functions to prevent most malicious code. Joomla text filters prevent Guests and Registered users from inserting HTML or other code in their comments. All comments for these two groups are automatically converted into plain text. Third, the JCE editor not only strips bad code but also is set with with limited functionality for commenters. Fourth, it is easy to monitor comments – for example by limiting comments to just a short period of time after an article is published. Together, this tools do a good job of protecting our News website from hackers.

Customize the appearance of our Comments area:
The term “Leave your comment” has a font size that is way too big. To fix this, add the following to your user.css file:

.my-3 {margin-top: 2rem !important;}

.h1 {font-size: 20px !important; color: #000055;}

Now that we have fixed up the initial problems, feel free to add comments to more categories of articles on your News website.

Congratulations! Your Community News website now has a secure and easy to use commenting system.

What’s Next?
This concludes are articles on Author Submissions and Reader Comments. In our next series of articles, we will review how to promote your Community News website using tools such as a Newsletter component and Events calendar.