Enable comments with giscus

- Followed this guide: https://elazizi.com/posts/add-comments-section-to-your-astro-blog/
Einlar · May 25, 2024 · 9027e77 · 9027e77
1 parent f729876
commit 9027e77
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 0 deletions.
diff --git a/src/components/NoteComments.astro b/src/components/NoteComments.astro
@@ -0,0 +1,19 @@
+<section class="giscus comments mx-auto mt-10 w-full"></section>
+
+<script
+  is:inline
+  src="https://giscus.app/client.js"
+  data-repo="Einlar/goldshish-cove"
+  data-repo-id="R_kgDOL7i5lw"
+  data-category="Blog Posts Comments"
+  data-category-id="DIC_kwDOL7i5l84CfmNG"
+  data-mapping="url"
+  data-strict="0"
+  data-reactions-enabled="1"
+  data-emit-metadata="0"
+  data-input-position="bottom"
+  data-theme="noborder_gray"
+  data-lang="en"
+  data-loading="lazy"
+  crossorigin="anonymous"
+  async></script>
diff --git a/src/content/blog/goldshish-restyled.md b/src/content/blog/goldshish-restyled.md
@@ -17,3 +17,7 @@ So, I finally took the chance when I discovered that [Astro.js](https://astro.bu
 - I can finally update the content by just writing Markdown and pushing it to git! No more need to mess up with databases and stuff. This is particularly nice because I have _this terrible idea_ of starting to write blog posts about stuff I like (so probably it'll be Machine Learning & stuff). Well, I still don't know if I actually start writing posts, but surely updating this website will make it easier, right?
 
 The main caveat is that, at the moment, there is no way for users to directly upload notes, or even just add comments. It's something I would like to fix _soonish_ - but for now you can just drop me a [mail](mailto:[email protected]) if you want to upload something, or you notice that something is wrong.
+
+## Update 2024-05-25
+
+Now comments are enabled on all notes, thanks to [giscus](https://giscus.app)! You will need a GitHub account to post here.
diff --git a/src/layouts/NoteDetails.astro b/src/layouts/NoteDetails.astro
@@ -2,6 +2,7 @@
 import Datetime from "@components/Datetime";
 import Footer from "@components/Footer.astro";
 import Header from "@components/Header.astro";
+import NoteComments from "@components/NoteComments.astro";
 import ShareLinks from "@components/ShareLinks.astro";
 import { SITE } from "@config";
 import Layout from "@layouts/Layout.astro";
@@ -77,6 +78,8 @@ const layoutProps = {
 
       <ShareLinks />
     </div>
+
+    <NoteComments />
   </main>
   <Footer />
 </Layout>