Add disqus comments

assets/css/template-styles.css

@@ -430,6 +430,23 @@ caption {
     margin-top: 0.5rem;
 }
 
+/* Disqus Comments */
+#disqus-container {
+  font-size: 0.85rem;
+  border: 1px solid;
+  padding: 1.5rem;
+}
+#disqus-button {
+  width: 100%;
+}
+#disqus-comments {
+  display: none; 
+}
+#disqus-comments,
+#disqus-comments iframe {
+  max-height: 75vh !important;
+}
+
 /* Pattern lists */
 .patterns-list {
     list-style: none;

exampleSite/config.toml

@@ -4,6 +4,7 @@ defaultContentLanguage = "en"
 title = "Cupper"
 theme = "cupper-hugo-theme"
 googleAnalytics = "UA-123456789-1"
+disqusShortname = "yourdiscussshortname"
 
 [taxonomies]
   tag = "tags"

exampleSite/config.yaml

@@ -4,6 +4,7 @@ defaultContentLanguage: en
 title: Cupper
 theme: cupper-hugo-theme
 googleAnalytics: UA-123456789-1
+disqusShortname: yourdiscussshortname
 
 taxonomies:
   tag: tags

exampleSite/resources/_gen/assets/css/css/template-styles.css_c2e18c145f3470d19843d012c882b388.content

@@ -430,6 +430,20 @@ caption {
     margin-top: 0.5rem;
 }
 
+/* Disqus Comments */
+#disqus-container {
+  font-size: 0.85rem;
+  border: 1px solid;
+  padding: 1.5rem;
+  max-height: 50vh !important;
+}
+#disqus-button {
+  width: 100%;
+}
+#disqus-comments {
+  display: none; 
+}
+
 /* Pattern lists */
 .patterns-list {
     list-style: none;

layouts/partials/disqus.html

@@ -0,0 +1,13 @@
+<div id="disqus-container">
+  {{ $ctx := . }}
+  {{ with .Site.DisqusShortname }}
+    <button id="disqus-button" onclick="showComments()">Show comments</button>
+    <div id="disqus-comments">
+      {{ if eq . "yourdiscussshortname" }}
+        <p>Disqus comments are disabled.</p>
+      {{ else }}
+        {{ template "_internal/disqus.html" $ctx }}
+      {{ end }}
+    </div>
+  {{ end }}
+</div>

layouts/post/single.html

@@ -26,10 +26,10 @@
         </ul>
       </div>
     {{ end }}
-    
     {{ if ne .Params.toc false }}
       {{ partial "toc" . }}
     {{ end }}
     {{ .Content }}
   </main>
+  {{ partial "disqus.html" . }}
 {{ end }}

static/js/dom-scripts.js

@@ -131,3 +131,12 @@
     }
   });
 }());
+
+/* Disqus comments */
+function showComments() {
+  var disqusButton = document.getElementById('disqus-button');
+  disqusButton.remove(); 
+
+  var disqusComments = document.getElementById('disqus-comments');
+  disqusComments.style.display = 'block'; 
+}