# Using Isso with Hugo

**URL:** <https://discourse.gohugo.io/t/using-isso-with-hugo/40350>\
**Category:** support\
**Created:** [September 2, 2022, 11:14pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350 "2022-09-02T23:14:42Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![damien](https://avatars.discourse-cdn.com/v4/letter/d/9de053/32.png) [@damien](https://discourse.gohugo.io/u/damien)\
**Post date:** [September 2, 2022, 11:14pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/1 "2022-09-02T23:14:43Z")

</div>

Hi,

I have used Hugo for a few years now, to have a simple blog. I just installed the Isso comments system on my server and I am wondering how to embed it in Hugo.

I found this article: “Adding Isso Comments to Hugo” [Them's Good Broth! | Adding Isso Comments to Hugo](https://stiobhart.net/2017-02-24-isso-comments/) and I am wondering if it is up to date or is it any other way to embed Isso in Hugo?

Thank you.

Edit: I am using the Hyde theme [GitHub - spf13/hyde: Port of Mdo's excellent theme to Hugo](https://github.com/spf13/hyde)

---

<div class="post-metadata">

**Author:** ![idarek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/idarek/32/26229_2.png) [@idarek](https://discourse.gohugo.io/u/idarek)\
**Post date:** [September 3, 2022, 6:50am UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/2 "2022-09-03T06:50:43Z")

</div>

The article look well-written hence give it a try. It may not be relevant that is from 2017, but it may work. Come back here when you will face an issue with Hugo itself as don’t think you will get too many responses other way.

---

<div class="post-metadata">

**Author:** ![baker](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/baker/32/15845_2.png) [@baker](https://discourse.gohugo.io/u/baker)\
**Post date:** [September 3, 2022, 7:33am UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/3 "2022-09-03T07:33:57Z")

</div>

I think I did it just as described under #9 - took like 1 Minute or so.

The REAL painful part is to get ISSO installed on the server.

---

<div class="post-metadata">

**Author:** ![idarek](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/idarek/32/26229_2.png) [@idarek](https://discourse.gohugo.io/u/idarek)\
**Post date:** [September 3, 2022, 10:30am UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/4 "2022-09-03T10:30:10Z")

</div>

I found utterances simple to implement.

> **[utterances](https://utteranc.es/)**
>
> A lightweight commenting system using GitHub issues.

---

<div class="post-metadata">

**Author:** ![bwintx](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bwintx/32/10450_2.png) [@bwintx](https://discourse.gohugo.io/u/bwintx)\
**Post date:** [September 3, 2022, 12:24pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/5 "2022-09-03T12:24:35Z")

</div>

Another possibility similar to Utterances is [giscus](https://giscus.app/).

---

<div class="post-metadata">

**Author:** ![Fryboyter](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/fryboyter/32/26114_2.png) [@Fryboyter](https://discourse.gohugo.io/u/Fryboyter)\
**Post date:** [September 3, 2022, 5:30pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/6 "2022-09-03T17:30:12Z")

</div>

I am using Isso for a few years now. I installed Isso as described at [Isso — UberLab 7 documentation](https://lab.uberspace.de/guide_isso/). Isso is accessible via a subdomain.

I integrated Isso with the following code.

> **[hugo](https://codeberg.org/Fryboyter/hugo/src/branch/main/themes/GythaOgg/layouts/partials/metadata.html#L3-L5)**
>
> Files for https://fryboyter.de

> **[hugo](https://codeberg.org/Fryboyter/hugo/src/branch/main/themes/GythaOgg/layouts/partials/comments.html)**
>
> Files for https://fryboyter.de

Basically, only \<a href="{{ .Permalink }}#isso-thread"\>Comments\</a\>  
and \<section id="isso-thread" data-title="{{ .Title }}"\>\</section\> is important.

The link shows below the article title whether there are already comments on an article. The link is optional and therefore does not have to be implemented.

With the section, the input fields with which one can create a comment as well as the already existing comments are displayed under an article. For example [I/O Scheduler automatisch einstellen](https://fryboyter.de/i-o-scheduler-automatisch-einstellen/).

---

<div class="post-metadata">

**Author:** ![damien](https://avatars.discourse-cdn.com/v4/letter/d/9de053/32.png) [@damien](https://discourse.gohugo.io/u/damien)\
**Post date:** [September 3, 2022, 10:28pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/7 "2022-09-03T22:28:56Z")

</div>

Thank you, but I already installed Isso on my server, so I will use Hugo I guess 🙂 .

---

<div class="post-metadata">

**Author:** ![damien](https://avatars.discourse-cdn.com/v4/letter/d/9de053/32.png) [@damien](https://discourse.gohugo.io/u/damien)\
**Post date:** [September 3, 2022, 10:29pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/8 "2022-09-03T22:29:13Z")

</div>

Thank you.

---

<div class="post-metadata">

**Author:** ![damien](https://avatars.discourse-cdn.com/v4/letter/d/9de053/32.png) [@damien](https://discourse.gohugo.io/u/damien)\
**Post date:** [September 3, 2022, 10:34pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/9 "2022-09-03T22:34:45Z")

</div>

Thank you. I like your theme colors.

---

<div class="post-metadata">

**Author:** ![damien](https://avatars.discourse-cdn.com/v4/letter/d/9de053/32.png) [@damien](https://discourse.gohugo.io/u/damien)\
**Post date:** [September 3, 2022, 11:31pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/10 "2022-09-03T23:31:40Z")

</div>

Well, actually it was pretty easy 🙂 … Reading the first article I mentioned

> Adding Isso Comments to Hugo” [Them’s Good Broth! | Adding Isso Comments to Hugo](https://stiobhart.net/2017-02-24-isso-comments/)

scared me before I even tried…

I just added in single.html:

```auto
<div class="post-footer">
    <section id="isso-thread"></section>
    <script data-isso="https://isso.xxx.org/" src="https://isso.xxx.org/js/embed.min.js"></script>
</div>

```

 ![ZXcIOk3](https://canada1.discourse-cdn.com/flex036/uploads/gohugo/original/3X/9/2/92321a6236edfe33c4a3204e5b1830f1ee17ee55.jpeg)

Thank you all for your replies.

---

<div class="post-metadata">

**Author:** ![Fryboyter](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/fryboyter/32/26114_2.png) [@Fryboyter](https://discourse.gohugo.io/u/Fryboyter)\
**Post date:** [September 10, 2022, 4:52pm UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/11 "2022-09-10T16:52:00Z")

</div>

Thank you. Because I have almost no knowledge of graphics editing, I have kept the theme as simple as possible and tried to ensure that it is accessible to as many users as possible.

Just have a look at the CSS files and adopt what you like.

---

<div class="post-metadata">

**Author:** ![RoninTech](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/ronintech/32/17316_2.png) [@RoninTech](https://discourse.gohugo.io/u/RoninTech)\
**Post date:** [September 12, 2022, 5:35am UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/12 "2022-09-12T05:35:08Z")

</div>

[Giscus](https://giscus.app/) (_heavily inspired by utterances_) was trivial to install and has great features. Only downside is commenters need to create a Github account to comment. The way I look at it is this cuts down on a lot of spam and only people with something important to say will bother to create one (if they don’t already have it).

---

<div class="post-metadata">

**Author:** ![bwintx](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bwintx/32/10450_2.png) [@bwintx](https://discourse.gohugo.io/u/bwintx)\
**Post date:** [September 12, 2022, 11:22am UTC](https://discourse.gohugo.io/t/using-isso-with-hugo/40350/13 "2022-09-12T11:22:20Z")

</div>

There’s one more drawback: it’s a Next.js app, and thus “heavy”; one can mitigate that somewhat by:

- Using its lazy-loading option;
- Hiding it (perhaps through use of `<details>`) by default.

The combination of the two will prevent all the Next.js JS from loading unless/until the reader chooses to see the giscus instance.