Some blogs (like this one) are primarily intended to provide assistance and guidance to those who need it. Other blogs may be people's thoughts and ramblings, poetry or content they've created, or any number of other things.
What they all have in common though is community, and one of the best ways to show appreciation, give feedback or make requests is via a comments section. This tutorial will help you introduce your own, fully controlled, fully self-hosted comments section called Commento. It allows for anonymous comments which can be moderated, signups for repeat users, and the latest version allows users to delete both their comments and their own user, rather than having to rely on an admin to do it.
- You need to have Docker and docker-compose installed on your machine
- You need to be able to SSH into your machine, or use CLI/terminal
- You should have your own self-hosted blog already up and running (I use Ghost) accessible at an URL such as
- You should have your own domain name with a fully functioning reverse proxy (check out my SWAG article, and I recommend Cloudflare as an incredibly feature-packed, not to mention free CDN)
proxydocker network (either called proxy or something else, this is the network you use for your reverse proxy/SWAG container to communicate with the services it acts as RP for)
Let's get started.
Set up your CDN and reverse proxy configuration
We're going to do this first, as it will save us some confusion later on.
- Access your CDN's DNS page, and create a new A or CNAME record for
commento.YOUR.DOMAIN(i.e. for me, it is commento.pointtosource.com)
- Access your reverse proxy's configuration page/files and create a new entry that points
commento.your.domainto port 8080. If you're using SWAG or another nginx non-gui method, your proxy.conf file would look something like this:
note that the above is reliant on the commento front end being on the same docker network as your proxy service, as per the prerequisites listed above, and shown in the docker-compose.yml file below
Creating the Commento++ container
I initially heard about Commento when I came across another walkthrough for Commento++. When I followed it, it unfortunately didn't work due to an issue with the latest postgres image using an authentication hash which the frontend Commento app hadn't caught up with yet. The below solves that issue.
Creating your Commento file system
- Using whatever method you prefer, navigate to your docker or compose directory, and create a
- Inside the commento folder, create another called
- Inside your commento folder, create two files, one called
docker-compose.ymland one called
if you're doing all of this from terminal/CLI, then once you've navigated to your docker directory, you can copy paste the following:
mkdir commento && cd commento && mkdir db && touch docker-compose.yml && touch .env
Populating the docker-compose.yml and .env files
- Open/edit the compose.yml file and paste in the following
- Make sure you change (or do not change) the lines where it says change is necessary
- Save the file
- Note that we are using this docker-compose file to create a new network called
commento, and that we are also relying on a previously created
proxynetwork. We are doing it in this way so that the db and front end can communicate, but we are stopping the db from having direct access to the outside world
#symbol) from the lines starting
- Open/edit your .env file and copy paste the following:
- Complete each line of the .env by adding your preferred information after the
=symbol without any spaces (e.g.
- Make sure that your
DOMAINNAMEis your root domain without any
- Save the file
- Once you've completed the above, it's time to run the following command to spin up your containers:
- After a few minutes, check out the logs for the db and the front end, and you should see that the db is ready to accept connections, and that the front end has in fact connected already
- Provided we've done everything correctly, we should be able to now access our commento instance at https://commento.your.domain
we can also access the container at http://yourmachineIP:8080, however note that this will automatically redirect to https://commento.your.domain
Setting up your Commento++ admin
When you access your commento instance, you should be presented with the following screen:
- Click the
Signupbutton at the top, and enter your credentials as you want them
- Once you have done this, we now need to recreate the container
- Access your docker compose file again, and uncomment the line
- Save the file
- Back in your terminal window, copy and paste the following to recreate the container, taking the change we just made into effect:
what we have just done is remove the ability for new admin users to be created by signing up. It does not stop other regular users for signing up
- Go back to your commento page in the browser and hit 'refresh' (you may need to log in again)
- The screen should look a little like this, but without the 'Academy' site on the left:
- Click the
+ New Domainbutton, and fill out the name and URL of the site you want to add commento to
Once you click
ADD DOMAIN you'll be through to the main part of commento, which gives you a number of admin settings you can configure, as well as showing you the html snippet to add to your site's code, which is what allows you and others to leave comments on your articles/blog posts:
- Head over to your blog's html page and paste in the universal snippet where you'd like the comment to appear. I like them at the bottom, so that's where I pasted the snippet
- Go through the rest of the settings and make choose your preferences (don't forget to hit the
SAVE CHANGESbutton before you change screens)
From now on, when you or anyone else accesses your blog or site, your comment section should appear, ready for you and them to log in or leave anonymous content.
A note on styling your Commento for your site
You'll notice in the screenshot immediately above that it directs you to a
configuration page for further reading, which includes a section about using custom css overrides:
Personally, I didn't want to create a whole stylesheet, it's not really what I do, nor is it something I can do quickly (I'm not great at this coding stuff).
I bashed into the container, and was able to find that there was a directory called
/commento/css, inside which is a stylesheet called
This was great. I tried to
nano and I tried to
vim, but they don't exist in the container. Nor does
apt, so you can't add them.
Next I tried to map the css folder to my machine, by adding the volume variable
- /commento/css:/commento/css (after having created the right folders first). The mapping was successful, but there must be a permissions something or other going on, as the folder on my machine was empty. When I bashed back into the container, the css folder was empty there too. I removed the volume mapping and recreated the container, and the
.css files returned. Ok.
Final try, I decided to map the container using a
volumes: block to create the folder within the docker file system (on a Synology this is created in the
/volume1/@docker/volumes folder. I did this by adding the following to the commento compose file:
This created a volume called
nano /volume1/@docker/volumes/commento_css/_data/commento.css into my CLI as the root user (I did a couple
ls commands in those folders to find my way) I was then able to modify the specific styles I wanted to, rather than creating a whole style sheet. In case you're wondering, I changed the text box background from white to black.