March 4, 2021

Adding Comments

One of the problems with Ghost is that it doesn't support commenting natively.

There are plenty of options to add commenting from various commercial and/or ad funded services such as disqus. That is contrary to the ethos of Micronetia because those comments are no longer under your control.

There is however an alternative - commento - which is relatively simple to host yourself (commento have an option where you can pay them to host it for you).

This post explains how to add commento to your ghost blog

Notes:

  • these instructions based on this invaluable guide as well as the commento instructions (which were less useful).
  • technically this is commento++ because the original commento hasn't been updated in a few months and commento++ has a couple of useful features - especially the Moderation Settings/Pending Approvals tab - that haven't been merged into the original
  • commento integration is not currently part of the base image. When it is, this page will be updated to note the new support

To add coments you'll need a browser and an ssh session to your pi. Adding the commento service takes about 20 minutes.

SSH to your pi and change directory to /tmp (cd /tmp) then download and extract the commento files and helper scripts (curl https://micronetia.devtru.st/content/images/micronetia-comento.tgz | tar xzv)

server@micronetia:~ $ cd /tmp
server@micronetia:/tmp $ curl https://micronetia.devtru.st/content/images/micronetia-commento.tgz | tar xzv

Run the addcommento script as root providing the hostname you want to use for hosting comments (sudo bin/addcommento.sh commento.domain.com ). The hostname should be part of your domain The script first does a software update and then installs required dependencies (postgres and relatives). You should answer Y when asked "Do you want to continue? [Y/n] ". Then it creates a user called commento, a database called commento and sets up systemd to run both postgres and commento services when the pi reboots.

server@micronetia:/tmp $ sudo bin/addcommento.sh commento-example.devtru.st
Get:1 http://raspbian.raspberrypi.org/raspbian buster InRelease [15.0 kB]      
Get:2 http://archive.raspberrypi.org/debian buster InRelease [32.8 kB]         
Get:3 https://deb.nodesource.com/node_12.x buster InRelease [4,584 B]          
Get:4 http://raspbian.raspberrypi.org/raspbian buster/main armhf Packages [13.0 MB]
Get:5 http://archive.raspberrypi.org/debian buster/main armhf Packages [364 kB]
Get:6 https://deb.nodesource.com/node_12.x buster/main armhf Packages [774 B]  
Fetched 13.4 MB in 24s (552 kB/s)   
Reading package lists... Done
Building dependency tree       
Reading state information... Done
25 packages can be upgraded. Run 'apt list --upgradable' to see them.
Reading package lists... Done
Building dependency tree       
Reading state information... Done
Calculating upgrade... Done
The following packages will be upgraded:
  bind9-host dnsutils libbind9-161 libdns-export1104 libdns1104 libirs161
  libisc-export1100 libisc1100 libisccc161 libisccfg163 libldap-2.4-2
  libldap-common liblwres161 libraspberrypi-bin libraspberrypi-dev
  libraspberrypi-doc libraspberrypi0 libssl1.1 libzstd1 nodejs openssl
  raspberrypi-bootloader raspberrypi-kernel raspi-config rpi-eeprom
25 upgraded, 0 newly installed, 0 to remove and 0 not upgraded.
Need to get 140 MB of archives.
After this operation, 2,305 kB of additional disk space will be used.
Do you want to continue? [Y/n] Y
   .
   .
   .
Reading package lists... Done
Building dependency tree       
Reading state information... Done
The following additional packages will be installed:
  libllvm7 libpq5 libsensors-config libsensors5 postgresql-11
  postgresql-client-11 postgresql-client-common postgresql-common ssl-cert
  sysstat
Suggested packages:
  lm-sensors postgresql-doc postgresql-doc-11 libjson-perl openssl-blacklist
  isag
The following NEW packages will be installed:
  libllvm7 libpq5 libsensors-config libsensors5 postgresql postgresql-11
  postgresql-client-11 postgresql-client-common postgresql-common
  postgresql-contrib ssl-cert sysstat
0 upgraded, 12 newly installed, 0 to remove and 0 not upgraded.
Need to get 27.1 MB of archives.
After this operation, 105 MB of additional disk space will be used.
Do you want to continue? [Y/n] Y
   .
   .
   .
Executing: /lib/systemd/systemd-sysv-install enable postgresql
Adding user `commento' ...
Adding new group `commento' (1001) ...
Adding new user `commento' (1001) with group `commento' ...
Creating home directory `/home/commento' ...
Copying files from `/etc/skel' ...
New password: Retype new password: passwd: password updated successfully
Changing the user information for commento
Enter the new value, or press ENTER for the default
	Full Name []: 	Room Number []: 	Work Phone []: 	Home Phone []: Other []: Use of uninitialized value $answer in chop at /usr/sbin/adduser line 582.
Use of uninitialized value $answer in pattern match (m//) at /usr/sbin/adduser line 583.
Is the information correct? [Y/n] ALTER ROLE
Converting /etc/cloudflared/config.yml
Adding hostname commento-example.devtru.st, service http://localhost:8081 to /tmp/config.yml
tunnel: 31391488-d9ca-dead-beef-c4b8c8dc9b88
credentials-file: /root/.cloudflared/31391488-d9ca-dead-beef-c4b8c8dc9b88.json
ingress:
  - hostname: example.devtru.st
    service: http://localhost:2368
  - hostname: commento-example.devtru.st
    service: http://localhost:8081
  - service: http_status:404
Does this look OK? (Y/N):

After that has happened you are asked whether the new cloudflare tunnel configuration looks OK. It should look like the one above with an entry for your blog on port 2368 and one for the commento service on port 8081.

Answer Y (unless it's gone completely nuts) and the script makes the new tunnel configuration live so that visitors can see your comment domain and then asks you to go to it and sign in to create the comment adminstrator/moderator.

updateding /etc/cloudflared/config.yml
adding commento-example.devtru.st to tunnel example-tunnel
2021-03-04T08:01:13Z INF Added CNAME commento-example.devtru.st which will route to this tunnel tunnelID=31391488-d9ca-dead-beef-c4b8c8dc9b88
reloading clourflared service
Created symlink /etc/systemd/system/multi-user.target.wants/commento.service → /etc/systemd/system/commento.service.
Open a browser to https://commento-example.devtru.st/signup . 
Then create a comment administrator user and add the blog to it
Press ENTER when you have done this to stop other signups

Copy and paste the link into your broswer and fill in the account details. I recommend you use the same email and password as you have for your blog (it is likely that your browser will prompt you and/or autifill with that email/password if you saved it in the browser) but if you want to be a rebel go ahead and pick something else.

press Sign up and then login using these credentials

add your blog by clicking on +New Domain in the management page

Fill in the relevant details and click ADD DOMAIN

Note that despite the warning you can just delete the domain and add a new corrected domain if you get the url wrong. You are presented with an "Installation Guide" page which you can just leave open (don't bother copying the HTML)

Go to back the the SSH terminal session and press Enter and then start answering questions. It is OK to answer N to both choices (email and akismet) because you can run a modcommento.sh script later to add either or both.

The first choice is whether or not you want to add email connectivity. If you have set up email for your domain via something like mailgun or elastic email (devtru.st uses elastic email) then say yes and enter the details. It is worth doing this because it allws you to get emails to moderate comments and allows commenters to use a password and get it reset, but it isn't a requirement.

The second choice is whether to enable the Akismet integration to clean up spam comments. Akismet is free for non-commercial sites (though you may need to be firm and insist on not donating anything when you sign up) so this seems to me to be a good idea. It also takes about 30 seconds to sign up. When you have signed up and see the page with the akismet key copy the key to paste into the terminal session.

Do you want to setup email (Y/N): y
Enter SMTP HOST: smtp.example.com
Enter SMTP USERNAME: [email protected]
Enter SMTP PASSWORD: SeCuRePa5sW0rD!
Enter SMTP PORT: 2525
Enter SMTP FROM_ADDRESS: [email protected]    
Do you have an Akismet key to use (Y/N): y
Enter Akismet key: 123456789

Once you have answered the questions you see a systemd config file displayed and you are asked to make sure it is OK. You need to make sure that lines you care about (email, akismet) are uncommented i.e. no # at the front and have the correct information. If you typoed anything then now is a great time to go back and fix it. You should also confirm that the FORBID_NEW_OWNERS line is uncommented. See example below:

[Unit]
Description=Commento daemon service
After=network.target postgresql.service

[Service]
Type=simple
User=commento
ExecStart=/home/commento/commento-server/commento
Environment=COMMENTO_ORIGIN=https://commento-example.devtru.st
Environment=COMMENTO_PORT=8081
Environment=COMMENTO_POSTGRES=postgres://commento:[email protected]:5432/commento?sslmode=disable

# Uncomment after setting up SMTP as specified below.
Environment=COMMENTO_SMTP_HOST=smtp.example.com
[email protected]
Environment=COMMENTO_SMTP_PASSWORD=SeCuRePa5sW0rD!
Environment=COMMENTO_SMTP_PORT=2525
[email protected]

# Uncomment after creating your first user on commento.YOURBLOG.com
Environment=COMMENTO_FORBID_NEW_OWNERS=true

# Uncomment after creating Akismet acc and grabbing API Key. Paste it below.
Environment=COMMENTO_AKISMET_KEY=123456789
[Install]
WantedBy=multi-user.target
Please check the settings in the file above for accuracy
Note: if you did not enter either email or an akismet key then just press Y
Are the entries correct  (Y/N):

When you answer Y the commento service is restarted using these settings and the script ends

Now go back to the commento admin tab in your broswer. And click on "general settings". You can change the name, but more relevantly you can enable (or not) anonymous comments and email address login. I have not tried the "Single sign-on" option so I have no idea how well that works

Save changes if you made and and then go to "moderation settings". If you added an Akismet key enabled "Automatic spam filtering". Then depending on your paranoia decide what comments can be posted without moderator approval. Also, if you don't have email enabled be sure to set the email schedule as "do not email".

Once you've got those settings the way you want (at least to start, this can all be changed later) it's time to edit the ghost theme to enable comments on posts. The proper way to do this is to download the theme, edit the relevant file (post.hbs) and upload it to back to the blog - see the theme editing instructions part of this page and Ghost's comprehensive theme documentation.

However there's a quick a dirty hacky way that works with most official themes and definitely works with the default caspar theme. This is to use a script called edittheme.pl which was included what you downloaded to get commento.

You need to run that with the path to the post.hbs file, e.g.  /home/server/blog/content/themes/casper/post.hbs, and the hostname of the comments server e.g. commento-example.devtru.st. It does a really simple search and replace for a commented out comment block and reports whether it made a change or not.

If you are not using caspar then you'll need to replace the caspar part of the path with whatever theme you are using (e.g. for this blog the theme is "editorial" and the path is /home/server/blog/content/themes/Editorial-master/post.hbs)

server@micronetia:/tmp $ edittheme.pl /home/server/blog/content/themes/casper/post.hbs commento-example.devtru.st
Differences between new and old:
117c117
<             
---
>             {{!--
119,120c119
<                 <script defer src="https://commento-example.devtru.st/js/commento.js"></script>
<                 <div id="commento"></div>
---
>                 If you want to embed comments, this is a good place to do it!
121a121
>             --}}

If you made a mistake with the comment name or you don't like what it did you can revert by doing  mv /home/server/blog/content/themes/casper/post.hbs.bak /home/server/blog/content/themes/casper/post.hbs

If you want to enable comments on pages as well as posts then edit the pages.hbs file in the same way (i.e. edittheme.pl /home/server/blog/content/themes/casper/post.hbs commento-example.devtru.st )

When you've made the change to the theme, go check a blog post and confirm there is a comment box at the bottom like this

If you enabled anonymous comments then you'll see a checkbox to allow it

And if you check that box and add a comment you'll see it shows up with a pending moderation tag

You can approve it by going to the Moderation Settings/Pending Approvals tab in the commento dashboard

Alternatively you can log into the commento system on the page (click on the login link above the comment box) with the moderator email/password

Once you are logged in you see the comment and some buttons to approve (green check) or bin (red trash can) it

Once you approve it one way or the other the blog post updates automatically to show it approved.  

Comments you make while logged in as the moderator have a neat "moderator" tag

That's basically it. You have enabled comments on your blog.

Enjoy!

PS The Moderation Settings/Pending Approvals tab does not automatically update when new comments that need approval have been left. You need to go somewhere else and then go back to have it refreshed.