feat: add 'site' & 'title' to Artalk init options

src/components/Comments.astro

@@ -13,11 +13,12 @@ const FediverseConfig = siteConfig.comments.fediverse
 interface Props {
     mastodonLink?: string;
     bskyLink?: string;
+    pageTitle?: string;
 }
 
-const { mastodonLink, bskyLink } = Astro.props;
+const { mastodonLink, bskyLink, pageTitle } = Astro.props;
 ---
-{method === 'artalk' && <Artalk />}
+{method === 'artalk' && <Artalk title={pageTitle} />}
 {method === 'giscus' && <Giscus />}
 <!-- if prerender === true is set then render from client -->
 {(method === 'fediverse' && !FediverseConfig.renderOnServer ) && <FediverseComments /> }

src/components/helper/comments/Artalk.astro

@@ -2,10 +2,13 @@
 import {siteConfig} from "../../../config";
 import 'artalk/Artalk.css';
 const ArtalkInstanceDomain = siteConfig.comments.artalk.instanceDomain
+const ArtalkInstanceSite = siteConfig.comments.artalk.site
+
+const { title = '' } = Astro.props;
 ---
 <div>
     <!-- Artalk -->
-    <div id="comments" data-path={Astro.url.pathname} data-server={ArtalkInstanceDomain}></div>
+    <div id="comments" data-path={Astro.url.pathname} data-title={title} data-server={ArtalkInstanceDomain} data-site={ArtalkInstanceSite}></div>
     <script>
         import Artalk from "artalk";
 
@@ -16,7 +19,9 @@ const ArtalkInstanceDomain = siteConfig.comments.artalk.instanceDomain
             Artalk.init({
                 el: '#comments',
                 pageKey: atkElement?.getAttribute('data-path') || window.location.pathname,
+                pageTitle: atkElement?.getAttribute('data-title') || document.title,
                 server: `https://${atkElement?.getAttribute('data-server')}`,
+                site: atkElement?.getAttribute('data-site') || 'default',
                 darkMode: "auto",
                 versionCheck: false
             });

src/config.ts

@@ -54,6 +54,7 @@ export const siteConfig = {
         type: 'artalk', // 'artalk','giscus','fediverse','email','hatsu','oom','twikoo','waline'
         artalk: {
             instanceDomain: '', // the domain of your artalk instance
+            site: '', // the site name of the current site in artalk dashboard, default is "default"
         },
         giscus: {
             // get these params from giscus.app

src/pages/blog/[...slug].astro

@@ -83,7 +83,7 @@ const cover = customFeaturedImage || matchedImage_src?.src || firstImageURL || `
         <ReplyViaEmail title={entry.data.title} email={authorInfo[0].email} />
             <br>
         <a href="/blog">&larr; {t('article.back_to_posts')}</a>
-        {!noscript && <h2>{t('article.comments')}</h2> <Comments />}
+        {!noscript && <h2>{t('article.comments')}</h2> <Comments pageTitle={entry.data.title} />}
         {!noscript &&
             <script>
                 import "katex/dist/contrib/copy-tex.js"