refactor: load giscus only with function

Former-commit-id: a2f531b7311d485c284121a05ff917be843e54f9

3 files changed, 27 insertions, 39 deletions

diff --git a/layouts/partials/components/comment.html b/layouts/partials/components/comment.html
index 3d7495c0..ce240e45 100644
--- a/layouts/partials/components/comment.html
+++ b/layouts/partials/components/comment.html
@@ -29,20 +29,6 @@
       {{ if eq .Site.Language.Lang "zh" }}
       <p style="text-align:center">你也可以加入本站的 <a href="https://t.me/teaparty418" target="_blank">Telegram 群组</a>参与讨论</p>
       {{ end }}
-      <script src="https://giscus.app/client.js"
-          data-repo="{{ .Site.Params.giscus.repo }}"
-          data-repo-id="{{ .Site.Params.giscus.repoId }}"
-          data-category="{{ .Site.Params.giscus.category }}"
-          data-category-id="{{ .Site.Params.giscus.categoryId }}"
-          data-mapping="{{ .Site.Params.giscus.mapping }}"
-          data-strict="{{ .Site.Params.giscus.strict }}"
-          data-reactions-enabled="{{ .Site.Params.giscus.reactionsEnabled }}"
-          data-emit-metadata="{{ .Site.Params.giscus.emitMetadata }}"
-          data-input-position="{{ .Site.Params.giscus.inputPosition }}"
-          data-theme="{{ .Site.Params.giscus.theme }}"
-          data-lang="{{ T "lang" }}"
-          crossorigin="anonymous"
-          async>
-      </script>
+      <script>loadGiscus()</script>
   </div>
 {{ end }}
diff --git a/layouts/partials/head/headscript.html b/layouts/partials/head/headscript.html
index 7c8d6237..84767bd5 100644
--- a/layouts/partials/head/headscript.html
+++ b/layouts/partials/head/headscript.html
@@ -52,6 +52,32 @@ function initCalHeatmap() {
   });
 }
 
+/* === giscus === */
+function loadGiscus() {
+  const giscusContainer = document.querySelector('.giscus'); // Make sure this matches your Giscus container class
+  const giscusScript = document.getElementById('giscus-script');
+  if (giscusContainer && !giscusScript) {
+      const script = document.createElement('script');
+      script.id = "giscus-script";
+      script.src = 'https://giscus.app/client.js';
+      script.setAttribute('data-repo', '{{ .Site.Params.giscus.repo }}');
+      script.setAttribute('data-repo-id', '{{ .Site.Params.giscus.repoId }}');
+      script.setAttribute('data-category', '{{ .Site.Params.giscus.category }}');
+      script.setAttribute('data-category-id', '{{ .Site.Params.giscus.categoryId }}');
+      script.setAttribute('data-mapping', '{{ .Site.Params.giscus.mapping }}');
+      script.setAttribute('data-strict', '{{ .Site.Params.giscus.strict }}');
+      script.setAttribute('data-reactions-enabled', '{{ .Site.Params.giscus.reactionsEnabled }}');
+      script.setAttribute('data-emit-metadata', '{{ .Site.Params.giscus.emitMetadata }}');
+      script.setAttribute('data-input-position', '{{ .Site.Params.giscus.inputPosition }}');
+      script.setAttribute('data-theme', '{{ .Site.Params.giscus.theme }}');
+      script.setAttribute('data-lang', '{{ T "lang" }}');
+      script.crossOrigin = 'anonymous';
+      script.async = true;
+
+      document.body.appendChild(script);
+  }
+}
+
 /* == Pagefind === */
 function initPagefind() {
   new PagefindUI({ element: "#search", showSubResults: true });
diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html
index 956e88f5..7757e0c0 100644
--- a/layouts/partials/scripts.html
+++ b/layouts/partials/scripts.html
@@ -25,30 +25,6 @@ loadToc();
 /* === littlefoot === */
 littlefoot.littlefoot(littlefootOptions)
 
-/* === giscus === */
-function loadGiscus() {
-  const giscusContainer = document.querySelector('.giscus'); // Make sure this matches your Giscus container class
-  if (giscusContainer) {
-      const script = document.createElement('script');
-      script.src = 'https://giscus.app/client.js';
-      script.setAttribute('data-repo', '{{ .Site.Params.giscus.repo }}');
-      script.setAttribute('data-repo-id', '{{ .Site.Params.giscus.repoId }}');
-      script.setAttribute('data-category', '{{ .Site.Params.giscus.category }}');
-      script.setAttribute('data-category-id', '{{ .Site.Params.giscus.categoryId }}');
-      script.setAttribute('data-mapping', '{{ .Site.Params.giscus.mapping }}');
-      script.setAttribute('data-strict', '{{ .Site.Params.giscus.strict }}');
-      script.setAttribute('data-reactions-enabled', '{{ .Site.Params.giscus.reactionsEnabled }}');
-      script.setAttribute('data-emit-metadata', '{{ .Site.Params.giscus.emitMetadata }}');
-      script.setAttribute('data-input-position', '{{ .Site.Params.giscus.inputPosition }}');
-      script.setAttribute('data-theme', '{{ .Site.Params.giscus.theme }}');
-      script.setAttribute('data-lang', '{{ T "lang" }}');
-      script.crossOrigin = 'anonymous';
-      script.async = true;
-
-      giscusContainer.appendChild(script);
-  }
-}
-
 /* === swup === */
 const swup = new Swup({
   linkSelector: 'a[href]:not(.no-swup)'