Add GitHub discussions below episodes with Giscus (#365)

3 files changed, 46 insertions, 0 deletions

diff --git a/REFERENCE.md b/REFERENCE.md
index 5451a60..1472dd0 100644
--- a/REFERENCE.md
+++ b/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:
diff --git a/layouts/episode/single.html b/layouts/episode/single.html
index c4cb99b..569b935 100644
--- a/layouts/episode/single.html
+++ b/layouts/episode/single.html
@@ -340,6 +340,16 @@
       </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 -->
diff --git a/layouts/partials/giscus.html b/layouts/partials/giscus.html
new file mode 100644
index 0000000..050425f
--- /dev/null
+++ b/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>