Integrating Cactus Comments with Hugo.

Please first complete the “Prerequisites” and “Register Your Site” sections on the quickstart page.

Add Shortcode

HUGO, has an option to use shortcodes that provide a nice interface to hide some HTML, CSS and JavaScript.

The shortcode chat.html must be added to layouts/shortcodes/ and looks like this

<script type="text/javascript" src=""></script>
<link rel="stylesheet" href="" type="text/css">
<div id="comment-section"></div>
  node: document.getElementById("comment-section"),
  defaultHomeserverUrl: "",
  serverName: "",
  siteName: "<YOUR-SITE-NAME>",
  commentSectionId: "{{ index .Params 0 }}"

“You can see all configuration options here

Add chat to post

Adding the chat ot a post is now as simple as adding

{{< chat cactus-comments >}}

to your post, where cactus-comments is the name of the chatroom. You can decide if you want to create a new one for each post (change the name to somthing like the post title) or if you want to use only one (keep the same name).