Today is the beautiful day my little blog got Comments! If I would have known how easy it is, it would have from day one!

I was engaged in a Duplo engineering project but still found some time to write this down.

engineering

Disqus

It took me one minute to register myself a free Disqus account. Go get yourself one at https://disqus.com/

Create ‘a website’ on the platfrom and copy (or memorize) the so called “short name”.

Please take some time to check all Disqus settings. It’s nice but out of the box they enable tracking cookies and maybe you don’t want that for your visitors.

Implementation

We all speak diff so without further ado:

diff --git a/maarten.gent/config.yml b/maarten.gent/config.yml
index d49211f..b879f8b 100644
--- a/maarten.gent/config.yml
+++ b/maarten.gent/config.yml
@@ -12,6 +12,7 @@ buildExpired: false
 enableEmoji: true
 pygmentsUseClasses: true
 googleAnalytics: XXX
+disqusShortname: maarten-gent

 minify:
     disableXML: true
@@ -112,6 +113,7 @@ params:
     author: Maarten Steenhuyse
     # author: ["Me", "You"] # multiple authors

+    comments: true
     defaultTheme: auto
     # disableThemeToggle: true
     ShowShareButtons: true
diff --git a/maarten.gent/layouts/partials/comments.html b/maarten.gent/layouts/partials/comments.html
new file mode 100644
index 0000000..0b59e05
--- /dev/null
+++ b/maarten.gent/layouts/partials/comments.html
@@ -0,0 +1 @@
+{{ template "_internal/disqus.html" . }}

Simple, right?

By the way: the comments setting is added under the params section in the YAML structure. diff is language agnostic. I read about some smarter diff tools on Twitter. Maybe you are also curious, and this post has to little content, so let’s see for a minute.

Diff with language semantics

To recap: a regular diff might not show the YAML structure so you cannot simply read where what is changed just looking at the diff output.

difftastic

https://github.com/Wilfred/difftastic

Heard about this one on Twitter. Looks nice but does not solve this problem.

difftastic

yaml-diff

https://github.com/sters/yaml-diff

If you speak Go, this solves our problem: the diff shows the YAML structure in its output ("params": Map).

--- test/maarten.gent/config.yml
+++ maarten.gent/config.yml

  Map{
  	... // 3 identical entries
  	"buildExpired":           Boolean(false),
  	"buildFuture":            Boolean(false),
+ 	"disqusShortname":        String("maarten-gent"),
  	"enableEmoji":            Boolean(true),
  	"enableInlineShortcodes": Boolean(true),
  	... // 6 identical entries
  	"outputs":  Map{"home": List{String("HTML"), String("RSS"), String("JSON")}},
  	"paginate": Number(10),
  	"params": Map{
  		... // 6 identical entries
  		"ShowToc":      Boolean(true),
  		"author":       String("Maarten Steenhuyse"),
+ 		"comments":     Boolean(true),
  		"defaultTheme": String("auto"),
  		"description":  String("Some scribblings organized in a hugo generated blog"),
  		... // 6 identical entries
  	},
  	"privacy":            Map{"instagram": Map{"disabled": Boolean(false), "simple": Boolean(true)}, "twitter": Map{"disabled": Boolean(false), "enableDNT": Boolean(true), "simple": Boolean(true)}, "vimeo": Map{"disabled": Boolean(false), "simple": Boolean(true)}, "youtube": Map{"disabled": Boolean(false), "privacyEnhanced": Boolean(true)}},
  	"pygmentsUseClasses": Boolean(true),
  	... // 3 identical entries
  }

Unfortunately the tool is not fully diff compliant so you cannot get it to work with git as external diff tool for example. So I had to create a new checkout of my git tree (the from version) in a separate folder to manually diff the file of interest. You can use the git worktree command to this easily.

References