Add GitHub discussions below episodes with Giscus (#365)

REFERENCE.md

@@ -9,6 +9,7 @@
     - [Feed Parameters](#feed-parameters)
     - [Favicon parameters](#favicon-parameters)
     - [Social Parameters](#social-parameters)
+    - [Giscus Parameters](#giscus-parameters)
     - [Host/Author Parameters](#hostauthor-parameters)
         - [Host Social Parameters](#host-social-parameters)
     - [Link Parameters](#link-parameters)
@@ -118,6 +119,24 @@ These are the social network parameters for your overall site. They should be se
 | `linkedin`       | No       | LinkedIn profile name. This is the part that comes after the `https://www.linkedin.com/in/` in your profile URL. | "mattstratton"       |
 | `twitch`         | No       | Twitch channel/profile for your site. This is the part that comes after `https://twitch.tv/`                     | "mattstratton"       |
 
+### Giscus Parameters
+
+As an alternative to Disqus for comments, you can leverage GitHub discussions, right below the episodes, thanks to [Giscus](https://giscus.vercel.app/). Giscus is driven by parameters under the `[params.giscus]` section.
+
+Follow the instructions at [giscus.vercel.app](https://giscus.vercel.app/) to set it up and get the value of the parameters.
+
+Example:
+
+```toml
+  [params.giscus]
+    data_repo="github-org/repo"
+    data_repo_id="MDAaBbClcG9zaXRvcnkzNTAyOTk3OTc="
+    data_category_id="MDE8Pazekd2N1c3Npb25DYXRlZ29yeTMyOTE4MDUx"
+    data_mapping="pathname"
+    data_theme="light"
+    crossorigin="anonymous"
+```
+
 ### Host/Author Parameters
 
 We use the "authors" from the configuration to list hosts in the jumbotron or sidebar. All hosts should have an entry in here. These settings should be set under `[params.authors]` and then `[params.authors.USERNAME]` for each host, for example:

layouts/episode/single.html

@@ -340,6 +340,16 @@ <h2><a href = "{{(printf "host/%s/" .File.BaseFileName) | absURL }}">{{ .Title }
       </div>
       <!-- disqus ends -->
       {{ end }}
+      {{ with .Site.Params.giscus }}
+      <!-- giscus begins -->
+      <hr />
+      <div class="row">
+        <div class="col-md-12">
+          {{ partial "giscus.html" }}
+        </div>
+      </div>
+      {{ end }}
+      <!-- giscus ends -->
 
       <div class="row">
         <!-- pager begin -->

layouts/partials/giscus.html

@@ -0,0 +1,17 @@
+<style type="text/css">
+.giscus, .giscus-frame {
+        width: 100%;
+        border: none;
+    }
+</style>    
+<script src="https://giscus.vercel.app/client.js"
+        data-repo="{{ site.Params.giscus.data_repo }}"
+        data-repo-id="{{ site.Params.giscus.data_repo_id }}"
+        data-category-id="{{ site.Params.giscus.data_category_id }}"
+        data-mapping="{{ site.Params.giscus.data_mapping }}"
+        data-theme="{{ site.Params.giscus.data_theme }}"
+        crossorigin="{{ site.Params.giscus.crossorigin }}"
+        async>
+</script>
+
+<noscript>Please enable JavaScript to view the <a href="https://giscus.vercel.app/">comments powered by Giscus.</a></noscript>