时光的痕迹

Back

Comment System

Comment system for pages at the bottom

Waline Comment System#

The theme’s comment, read statistics, likes, and other functionalities are all provided by Waline.

Remove#

If you have some reasons to remove the comment system, or just learn how to change to other comment systems, this section might help you. But if you want to know how to configure it, you can skip this section.

Remove it by the following steps:

  1. set enable to false in src/site.config.ts.

    src/site.config.ts
    export const integ: IntegrationUserConfig = {
      // ...
      waline: {
        enable: false
      }
    }
    ts
  2. Remove dependency @waline/client:

    bun remove @waline/client
    shell
  3. Remove folder src/components/waline.

  4. Remove relative code in these layouts:

    • src/layouts/CommonPage.astro
    • src/layouts/BlogPost.astro
  5. Remove relative config like comment or view configuring for the earlier edited layouts in these files:

    • src/pages/about/index.astro
    • src/pages/links/index.astro
    • src/pages/projects/index.astro
    • Other blog post frontmatter config if exists

Deploy#

You can refer to its documentation for configuration, and it is recommended to use the Vercel + Supabase combination.

Configuration#

Then you can configure the Waline comment system in the integrationConfig.server.

src/site.config.ts
export const integ: IntegrationUserConfig = {
  // ...
  waline: {
    enable: true,
    // Server service link
    server: 'https://astro-theme-pure-waline.arthals.ink/', 
    // Refer https://waline.js.org/en/guide/features/emoji.html
    emoji: ['bmoji', 'weibo'],
    // Refer https://waline.js.org/en/reference/client/props.html
    additionalConfigs: {
      pageview: true,
      comment: true
      // ...
    }
  }
}
ts

Usage#

You can call it manually in .astro or .mdx files.

import { Comment } from '@/components/waline'

// prettier-ignore
<Comment />
jsx

Render:

Comment seems to stuck. Try to refresh?✨