diff --git a/docs/setup/adding-a-comment-system.md b/docs/setup/adding-a-comment-system.md
index 6e557013e..045bae784 100644
--- a/docs/setup/adding-a-comment-system.md
+++ b/docs/setup/adding-a-comment-system.md
@@ -61,12 +61,15 @@ calling the `super()` function at the beginning of the block:
   <h2 id="__comments">{{ lang.t("meta.comments") }}</h2>
   <!-- Replace with generated snippet -->
 
-  <!-- Reload on palette change -->
+  <!-- Synchronize Giscus theme with palette -->
   <script>
+    var giscus = document.querySelector("script[src*=giscus]")
+
+    /* Set palette on initial load */
     var palette = __md_get("__palette")
     if (palette && typeof palette.color === "object") {
-        var giscus = document.querySelector("script[src*=giscus]")
-        giscus.setAttribute("data-theme", palette.color.scheme === "slate" ? "dark" : "light") // (1)!
+      var theme = palette.color.scheme === "slate" ? "dark" : "light"
+      giscus.setAttribute("data-theme", theme) // (1)!
     }
      
     /* Register event handlers after documented loaded */
diff --git a/material/overrides/blog.html b/material/overrides/blog.html
index ae59b4cb7..609da2588 100644
--- a/material/overrides/blog.html
+++ b/material/overrides/blog.html
@@ -6,5 +6,5 @@
   {{ super() }}
   <h2 id="__comments">{{ lang.t("meta.comments") }}</h2>
   <script src="https://giscus.app/client.js" data-repo="squidfunk/mkdocs-material" data-repo-id="MDEwOlJlcG9zaXRvcnk1MDYxNzQyOA==" data-category="_" data-category-id="DIC_kwDOAwRcVM4CAtJY" data-mapping="pathname" data-reactions-enabled="1" data-emit-metadata="1" data-theme="light" data-lang="en" crossorigin="anonymous" async></script>
-  <script>var giscus,palette=__md_get("__palette");palette&&"object"==typeof palette.color&&"slate"===palette.color.scheme&&(giscus=document.querySelector("script[src*=giscus]")).setAttribute("data-theme","dark"),document.addEventListener("DOMContentLoaded",function(){document.querySelector("[data-md-component=palette]").addEventListener("change",function(){var e=__md_get("__palette");e&&"object"==typeof e.color&&(e="slate"===e.color.scheme?"dark":"light",document.querySelector(".giscus-frame").contentWindow.postMessage({giscus:{setConfig:{theme:e}}},"https://giscus.app"))})})</script>
+  <script>var theme,giscus=document.querySelector("script[src*=giscus]"),palette=__md_get("__palette");palette&&"object"==typeof palette.color&&(theme="slate"===palette.color.scheme?"dark":"light",giscus.setAttribute("data-theme",theme)),document.addEventListener("DOMContentLoaded",function(){document.querySelector("[data-md-component=palette]").addEventListener("change",function(){var e=__md_get("__palette");e&&"object"==typeof e.color&&(e="slate"===e.color.scheme?"dark":"light",document.querySelector(".giscus-frame").contentWindow.postMessage({giscus:{setConfig:{theme:e}}},"https://giscus.app"))})})</script>
 {% endblock %}
diff --git a/src/overrides/blog.html b/src/overrides/blog.html
index 240090520..ddbd3ed80 100644
--- a/src/overrides/blog.html
+++ b/src/overrides/blog.html
@@ -44,14 +44,16 @@
   >
   </script>
 
-  <!-- Reload on palette change -->
+  <!-- Synchronize Giscus theme with palette -->
   <script>
+    var giscus = document.querySelector("script[src*=giscus]")
+
+    /* Set palette on initial load */
     var palette = __md_get("__palette")
-    if (palette && typeof palette.color === "object")
-      if (palette.color.scheme === "slate") {
-        var giscus = document.querySelector("script[src*=giscus]")
-        giscus.setAttribute("data-theme", "dark")
-      }
+    if (palette && typeof palette.color === "object") {
+      var theme = palette.color.scheme === "slate" ? "dark" : "light"
+      giscus.setAttribute("data-theme", theme)
+    }
 
     /* Register event handlers after documented loaded */
     document.addEventListener("DOMContentLoaded", function() {