✨ Feat: Add a custom domain setting option for Giscus, configured at params.page.comment.giscus.origin

assets/js/theme.js

@@ -854,7 +854,7 @@ class FixIt {
       const giscusConfig = this.config.comment.giscus;
       this._giscusOnSwitchTheme = this._giscusOnSwitchTheme || (() => {
         const message = { setConfig: { theme: this.isDark ? giscusConfig.darkTheme : giscusConfig.lightTheme }};
-        document.querySelector('.giscus-frame')?.contentWindow.postMessage({ giscus: message }, 'https://giscus.app');
+        document.querySelector('.giscus-frame')?.contentWindow.postMessage({ giscus: message }, giscusConfig.origin);
       });
       this.switchThemeEventSet.add(this._giscusOnSwitchTheme);
       this.giscus2parentMsg = window.addEventListener('message', (event) => {

hugo.toml

@@ -1109,6 +1109,7 @@ enableEmoji = true
         category = ""
         categoryId = ""
         mapping = ""
+        origin = "https://giscus.app" # Or set it to your self-hosted domain
         strict = "0" # FixIt NEW | 0.2.18
         term = ""
         reactionsEnabled = "1"

layouts/partials/single/comment.html

@@ -299,11 +299,12 @@
     {{- $giscus := $comment.giscus | default dict -}}
     {{- if $giscus.enable -}}
       {{- with $giscus -}}
+        {{- $commentConfig = .origin | default "https://giscus.app" | dict "origin" | dict "giscus" | merge $commentConfig -}}
         {{- $commentConfig = .lightTheme | default "light" | dict "lightTheme" | dict "giscus" | merge $commentConfig -}}
         {{- $commentConfig = .darkTheme | default "dark" | dict "darkTheme" | dict "giscus" | merge $commentConfig -}}
         <div id="giscus" class="comment">
           <script
-            src="https://giscus.app/client.js"
+            src="{{ .Origin }}/client.js"
             data-repo="{{ .Repo }}"
             data-repo-id="{{ .RepoId }}"
             data-category="{{ .Category }}"