How to set up Commentics on Neocities

If you have a leprd.space server, you can use Commentics as a place for users to comment.

Installing Commentics

  • Log in to your cPanel Dashboard
  • Under Software, click Softaculous Apps Installer
  • On the left sidebar, open the Others category.
  • Click on Commentics.
  • Click Install Now.
  • Under Software Setup, choose the domain and directory you would like Commentics to be installed. (All this really effects is where you will log in to set everything up.)
  • Under Site Settings, choose a name for your Admin Folder. This will be reflected in the admin URL for the back-end.
  • Under Admin Account, choose a name and password for your account. Also, put in your email address.
    • Be sure to keep this information handy. Commentics will lock you out for 30 minutes if you enter the wrong password more than 5 times in a row.
  • Click the blue Install button and wait for your installation to complete.
  • Once it completes, it will link you to your admin page for Commentics. This is where you will log in and set everything up. The URL might look like “https://website.leprd.space/commentics/admin/”.

Logging into and setting up Commentics

  • Log in to your Commentics admin page.
  • The first time you log in, you will see a note at the top right of the screen that says, “The config file is writable. For security it must be read-only.” This is okay, we will fix this!
  • Click ‘completed’ to remove the checklist notification.
  • At the top of the screen, hover over Reports and click on Permissions.
  • Look for the item with the red Writable label. Make note of the file location of config.php.
  • Return to your cPanel dashboard and go to the file location noted in the previous step.
  • In your file manager, right-click on config.php and choose Change Permissions.
  • Uncheck the blue box next to Write and click Change Permissions.
  • Return to your Commentics admin area – you should see the red notification at the top right has disappeared.

Setting up your comment boxes

  • Hover over Manage and click on Sites.
  • Click on the linked add text at the top.
  • Enter the name, domain, and URL of your site. If you intend to use this with Neocities, make sure the ‘iFrame Enabled’ option is checked.
    • Note: The URL field can just be your root domain (yourwebsite.com) even if you intend on using different comment boxes on different pages.
  • Go to the page you’d like to install the comment box on. Put the following script between your <head></head> tags:
<script src="https://yourwebsite.leprd.space/commentics/embed.js"></script>
Code language: HTML, XML (xml)
  • Modify the above URL to match the same URL that your Commentics installation is at.
  • Add the following div wherever you’d like to place your comment box:
<div id="commentics"></div>
Code language: HTML, XML (xml)
  • Reload the page and your comment box should appear.

Viewing your comments in the admin area

  • Hover over Manage at the top of the admin area and click on Pages.
  • If you just created a new form, it won’t show up here until you leave a comment. So, go ahead and leave yourself a test comment, and return to this page. Refresh and your form will now show up!

Customizing your comment box

Please note that customization is the same across the board for all forms. 
  • On your Commentics admin view, hover over Settings, then Layout, and click Comments.
    • Here you can choose what should and should not appear for the comments themselves.
  • On your Commentics admin view, hover over Settings, then Layout, and click Form.
    • Here you can choose what should and should not appear on the comment form. You can choose which fields are and are not disabled here, for example.

Creating a theme for your comment box

Please note: Creating a theme requires somewhat intermediate/advanced CSS knowledge. It is recommended to use dev tools to inspect the correct CSS selectors for the theme.
  • Go to your cPanel admin area and open File Manager.
  • Navigate to the following directory:
/comments/frontend/view/
  • Create a new folder with a name of your theme:
/comments/frontend/view/my_theme/
  • Inside of your theme folder, add these two folders:
/comments/frontend/view/my_theme/stylesheet/css
  • Create a file called custom.css
  • Put all of your CSS into this file and save when done.
  • Return to your Commentics admin area.
  • Hover over Extensions and click on Themes
  • Click on the dropdown beside Frontend and choose your custom theme from the dropdown.
Note: If you do not have jQuery already linked on your webpage, it is recommended to choose CDN - jQuery from the dropdown.
  • Click the orange Update button to save your changes.

How to require approval for all comments

  • Go to your Commentics admin area.
  • Hover over Settings and click on Approval.
  • Check the box that says Approve Comments.
  • Click on the orange Update button.

How to set up email notifications for comments

  • Go to your Commentics admin area.
  • Hover over Settings and click on Administrator
  • Ensure your email address is correct.
  • Check the boxes beside the types of email notifications you’d like to receive.
  • Click the orange Update button.

Troubleshooting: page auto-scrolls to comment area

To fix this issue, download the three JS files from this link and overwrite the same three files at the following location:

/comments/frontend/view/default/javascript/
Code language: JavaScript (javascript)


Hey, thanks for reading! If you have any questions, you can leave me a comment and I always try to reply.

If you have any suggestions on how I can improve this article, please let me know!

This website is not monetized in any way. It purely exists to help others on their web-building journey. However, if you have the means to donate toward my server costs, I have a ko-fi account where I accept tips.

Leave a Comment