Demius主题使用文档

git submodule add https://github.com/demius782/demius themes/demius

hugo mod init github.com/your/site
echo 'module = "github.com/demius782/demius"' >> hugo.toml
hugo mod get github.com/demius782/demius

# 基础配置
baseURL = 'https://your-domain.com'
languageCode = 'zh-CN'
title = '你的博客名称'
theme = 'demius'

# 启用多语言支持
defaultContentLanguage = 'zh'
hasCJKLanguage = true

# 永久链接配置
[permalinks]
  posts = "/posts/:slug.html"

[taxonomies]
  tag = "tags"
  category = "categories"

[params]
  author = "你的名字"                      # 网站作者
  description = "网站描述"                # SEO描述
  
  # 布局配置
  homeColumns = 2                         # 首页布局：1=单列, 2=双列
  mainSections = ["posts"]                # 主内容区域
  summaryLength = 120                     # 摘要长度

# ===== 全站字体配置 =====
[params.font]
  enable = false                         # 是否启用自定义字体（true=启用，false=使用系统默认字体）
  type = "online"                        # 字体类型：online（在线字体，如Google Fonts）或 local（本地字体）
  
  # 在线字体配置（type = "online" 时使用）
  onlineUrl = ""                          # 在线字体链接（如：https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700&display=swap）
  fontFamily = ""                         # 字体名称（如：'Noto Sans SC', sans-serif）
  
  # 本地字体配置（type = "local" 时使用）
  localName = ""                          # 本地字体名称（用于font-family，如：'HarmonyOS Sans SC'）
  localPath = ""                          # 本地字体文件路径（支持woff2/woff/ttf格式，如：/fonts/HarmonyOS-Sans-SC.woff2）
  localFormat = "woff2"                   # 本地字体格式：woff2、woff 或 ttf

[params.font]
  enable = true
  type = "online"
  onlineUrl = "https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700&display=swap"
  fontFamily = "'Noto Sans SC', sans-serif"

[params.font]
  enable = true
  type = "local"
  localName = "HarmonyOS Sans SC"
  localPath = "/fonts/HarmonyOS-Sans-SC.woff2"
  localFormat = "woff2"

[menu]
  [[menu.main]]
    name = "首页"
    url = "/"
    weight = 1
    [menu.main.params]
      icon = "/img/icons/home.svg"

  [[menu.main]]
    name = "归档"
    url = "/posts/"
    weight = 2
    [menu.main.params]
      icon = "/img/icons/blog.svg"

  # 多级菜单示例
  [[menu.main]]
    name = "项目"
    identifier = "projects"
    weight = 6

  [[menu.main]]
    name = "Web开发"
    url = "/projects/web/"
    weight = 1
    parent = "projects"

[params.aside]
  # 侧栏一体化模式（v2.2.0新增）
  unifiedMode = true  # true=一体化容器，false=分割卡片
  
  # 侧栏组件宽度模式（最新新增）
  wideMode = "normal"  # 侧栏宽度模式：false或"normal"=260px（默认），"medium"=332px（中宽），true或"wide"=415px（超宽）
  
  # 左侧栏组件
  left = ["author","announcement","recent-Comments","popular-Posts","social-Media","advertisement"]
  
  # 右侧栏组件  
  right = ["toc","related-Posts","tags", "recent-Posts","categories", "archive"]

  # 组件显示控制
  showAuthor = true
  showToc = true
  showTags = true
  showRecent = true
  showCategories = true
  showArchive = true
  showPopularPosts = true
  showRelatedPosts = true
  showSocialMedia = true
  showAdvertisement = true
  showAnnouncement = true
  showLifeTime = true                    # 逆行人生时间倒计时组件（v2.8.0+）
  showDataStats = true                   # 数据统计组件（v2.8.0+）
  showHitokoto = true                   # 一言组件（v2.8.0+）
  showVisitorInfo = true                 # 访客信息组件（v2.8.0+）
  showMusic = true                       # 音乐组件（v2.8.0+）

  # 数量控制
  popularCount = 5
  recentCount = 5
  relatedCount = 5
  tagsCount = 20  # 标签云显示数量（0表示全部）

[params.aside]
  # 侧栏组件宽度模式
  wideMode = "normal"  # 可选值：
                      # - false 或 "normal"：默认宽度 260px
                      # - "medium"：中宽模式 332px
                      # - true 或 "wide"：超宽模式 415px

[params.aside.组件名]
  enableBackground = false             # 是否启用背景（默认false）
  backgroundImage = ""                 # 背景图片URL
  backgroundColor = ""                 # 背景色（支持渐变）
  backgroundSize = "cover"             # 背景图尺寸
  backgroundPosition = "center"        # 背景图位置
  backgroundRepeat = "no-repeat"       # 背景图重复
  textColor = ""                       # 文字颜色
  textShadow = false                   # 文字阴影
  overlayColor = ""                    # 遮罩层颜色
  borderRadius = ""                    # 自定义圆角

[params.aside.popular-Posts]
  enableBackground = true
  backgroundColor = "linear-gradient(135deg, #667eea 0%, #764ba2 100%)"
  textColor = "#ffffff"
  textShadow = true

[params.aside.toc]
  # 手机端目录按钮弹出内容设置
  mobilePopupMode = "sidebar"  # "sidebar"（弹出整个右侧栏）或 "toc-only"（仅弹出目录）

[params.aside.lifeTime]
  title = "逆行人生"                   # 组件标题
  enableBackground = false             # 是否启用背景图片/颜色
  backgroundImage = ""                 # 背景图片URL
  backgroundColor = ""                 # 背景色（支持渐变）
  backgroundSize = "cover"             # 背景图片尺寸
  backgroundPosition = "center"        # 背景图片位置
  backgroundRepeat = "no-repeat"       # 背景图片重复
  textColor = ""                       # 文字颜色
  textShadow = false                   # 文字阴影
  overlayColor = ""                    # 遮罩层颜色
  borderRadius = ""                    # 圆角大小

[params.aside.dataStats]
  title = "数据统计"                   # 组件标题
  enableBackground = false             # 是否启用背景图片/颜色
  backgroundImage = ""                 # 背景图片URL
  backgroundColor = ""                 # 背景色（支持渐变）
  backgroundSize = "cover"             # 背景图片尺寸
  backgroundPosition = "center"        # 背景图片位置
  backgroundRepeat = "no-repeat"       # 背景图片重复
  textColor = ""                       # 文字颜色
  textShadow = false                   # 文字阴影
  overlayColor = ""                    # 遮罩层颜色
  borderRadius = ""                    # 圆角大小
  # 数据项显示开关
  showPostsCount = true                # 文章总数
  showTagsCount = true                 # 标签数量
  showCategoriesCount = true           # 分类数量
  showRunningYear = false               # 运行年份
  showTotalWords = true                # 全站字数
  showResponseTime = true              # 响应耗时
  showLastUpdate = true                # 最后更新时间
  showCommentCount = true              # 评论数目（需要Artalk API支持）

[params.aside.hitokoto]
  title = "一言"                       # 组件标题
  enabled = true                       # 是否启用组件
  apiType = "nsmao"                    # API类型：nsmao（青桔API）或 jinrishici（今日诗词）
  showFrom = true                      # 是否显示来源
  # 青桔API配置
  nsmaoApiKey = "your-api-key"         # 青桔API密钥（只需配置key，无需secretKey）
  nsmaoApiUrl = "https://api.nsmao.net/api/history/query"  # 青桔API地址
  enableBackground = false             # 是否启用背景图片/颜色
  backgroundImage = ""                 # 背景图片URL
  backgroundColor = ""                 # 背景色（支持渐变）
  backgroundSize = "cover"             # 背景图片尺寸
  backgroundPosition = "center"        # 背景图片位置
  backgroundRepeat = "no-repeat"       # 背景图片重复
  textColor = ""                       # 文字颜色
  textShadow = false                   # 文字阴影
  overlayColor = ""                    # 遮罩层颜色
  borderRadius = ""                    # 圆角大小

[params.aside]
  showVisitorInfo = true                 # 显示开关
  right = ["toc", "visitor-info", ...]  # 添加到右侧栏

[params.aside.visitorInfo]
  title = "访客信息"                   # 组件标题
  enabled = true                       # 是否启用组件
  apiKey = "your-api-key"              # 青桔API密钥（必填，用于获取访客位置信息）
  customLat = 119.28619787672005       # 自定义纬度（站点位置，用于计算距离）
  customLng = 34.869653193786995       # 自定义经度（站点位置，用于计算距离）
  siteName = "本站"                    # 站点名称（替代"本站"显示在距离信息中）
  fontColor = "deepskyblue"            # 高亮文字颜色（位置、IP、距离等）
  showFriendsLinks = false             # 是否显示友情链接（开往、空间穿梭）
  travellingsLink = false               # 是否显示开往友链接力
  blogsClubLink = false                 # 是否显示空间穿梭,BlogsCloub友链接
  # 背景配置（与其他组件统一）
  enableBackground = false             # 是否启用背景图片/颜色
  backgroundImage = ""                 # 背景图片URL
  backgroundColor = ""                 # 背景色（支持渐变）
  backgroundSize = "cover"             # 背景图片尺寸
  backgroundPosition = "center"        # 背景图片位置
  backgroundRepeat = "no-repeat"       # 背景图片重复
  textColor = ""                       # 文字颜色
  textShadow = false                   # 文字阴影
  overlayColor = ""                    # 遮罩层颜色
  borderRadius = ""                    # 圆角大小

[params.aside]
  showMusic = true                      # 显示开关
  right = ["toc", "music", ...]        # 添加到右侧栏

[params.aside.music]
  title = "音乐"                       # 组件标题
  enabled = true                       # 是否启用组件
  # 背景配置（与其他组件统一）
  enableBackground = false             # 是否启用背景图片/颜色
  backgroundImage = ""                 # 背景图片URL
  backgroundColor = ""                 # 背景色（支持渐变）
  backgroundSize = "cover"             # 背景图片尺寸
  backgroundPosition = "center"        # 背景图片位置
  backgroundRepeat = "no-repeat"       # 背景图片重复
  textColor = ""                       # 文字颜色
  textShadow = false                   # 文字阴影
  overlayColor = ""                    # 遮罩层颜色
  borderRadius = ""                    # 圆角大小
  # 音乐列表配置（使用数组表格式）
  [[params.aside.music.items]]
    name = "歌曲名称"
    artist = "歌手名称"
    url = "/audio/demo.mp3"            # 本地音频文件路径
    cover = "/img/cover.jpg"           # 封面图片（可选）
  
  [[params.aside.music.items]]
    server = "netease"                 # 音乐平台：netease/tencent/kugou/xiami/baidu
    type = "song"                      # 类型：song/playlist/album/search/artist
    id = "27583305"                    # 音乐ID或搜索关键词

# ===== 悬浮音乐播放器配置（独立配置，与侧栏音乐组件分离） =====
[params.floatMusicPlayer]
  # 是否启用悬浮音乐播放器（桌面独立小组件，位于左下角）
  enabled = true
  
  # 数据源配置：从 data/music-planet.yaml 中选择数据
  # 方式1：通过section索引选择（从0开始，支持多个索引）
  # sectionIndexes = [0, 1]  # 选择第1和第2个section的所有音乐
  
  # 方式2：通过section标题匹配选择（支持部分匹配）
  # sectionTitles = ["网易云音乐", "QQ音乐"]  # 选择标题包含这些关键词的sections
  
  # 方式3：通过section标题精确匹配选择（推荐）
  sectionTitle = "🎧 网易云音乐 · 歌单"  # 选择标题完全匹配的section（优先级最高）
  
  # 方式4：直接指定音乐项（如果设置了此项，将忽略上面的section选择方式）
  # 直接指定时会从所有sections中查找匹配的items
  # [[params.floatMusicPlayer.items]]
  #   server = "netease"
  #   type = "playlist"
  #   id = "4977885420"
  
  # 播放器选项（可选，优先级高于data/music-planet.yaml中的配置）
  # autoplay = false           # 是否自动播放
  # loop = "all"              # 循环模式：all、one、none
  # order = "list"            # 播放顺序：list、random
  # volume = 0.7              # 音量：0-1
  # listFolded = true         # 列表是否折叠
  # listMaxHeight = "340px"   # 列表最大高度
  # mini = false              # 迷你模式
  # fixed = false             # 固定模式

[params.comment]
  enable = true
  system = "artalk"

[params.comment.artalk]
  server = "https://your-artalk-server.com"
  site = "your-site-name"
  placeholder = "说点什么吧~"
  useLocal = true  # 使用本地资源

[params.analytics]
  [params.analytics.umami]
    enable = true                          # 是否启用Umami统计
    scriptUrl = "https://umami.demius.tech/script.js"  # Umami统计脚本地址
    websiteId = "your-website-id"          # 网站ID（在Umami后台创建网站后获得）
    showInDataPage = true                  # 是否在数据页面显示统计数据
    apiUrl = "https://your-api.com/"       # 统计数据API地址

[params.social]
  links = [
    { name = "GitHub", icon = "fab fa-github", url = "https://github.com/yourname", color = "#333333" },
    { name = "微博", icon = "fab fa-weibo", url = "https://weibo.com/yourprofile", color = "#e6162d" },
    { name = "邮箱", icon = "fas fa-envelope", url = "mailto:your@email.com", color = "#ea4335" },
    { name = "RSS", icon = "fas fa-rss", url = "/index.xml", color = "#ffa500" }
  ]

[params.floatButtons]
  position = "right"  # 可选: "left" 或 "right"
  showBackToTop = true
  showThemeToggle = true
  showSidebarToggle = true

[params.footer]
  beian = "粤ICP备12345678号"  # 备案信息
  custom = """
    <div class="footer-links">
      <a href="/about">关于</a>
      <a href="/privacy">隐私政策</a>
    </div>
  """

# 置顶徽章颜色配置
[params.pinned]
  badgeStartColor = "#FF6B6B"            # 徽章渐变起始颜色
  badgeEndColor = "#FF8E8E"              # 徽章渐变结束颜色
  badgeTextColor = "#FFFFFF"             # 徽章文字颜色
  
  # 暗色模式颜色（可选）
  badgeStartColorDark = "#FF6B6B"        # 暗色模式起始颜色
  badgeEndColorDark = "#FF8E8E"          # 暗色模式结束颜色
  badgeTextColorDark = "#FFFFFF"         # 暗色模式文字颜色

# ===== 开发者工具防护配置（保护代码安全） =====
[params.devToolsProtection]
  enabled = false                        # 是否启用开发者工具防护（true=启用，false=禁用）
  disableRightClick = true               # 是否禁用右键菜单（true=禁用，false=允许）
  disableTextSelection = false           # 是否禁用文本选择（true=禁用，false=允许）
  detectDevTools = true                  # 是否检测开发者工具打开（true=检测，false=不检测）
  devToolsThreshold = 160                # 开发者工具检测阈值（像素），当窗口尺寸差异超过此值时认为开发者工具已打开
  disableConsole = false                 # 是否禁用控制台输出（true=禁用，false=允许）
  disableDebugger = false                # 是否使用debugger阻止调试（true=启用，false=禁用）
  preventIframe = true                   # 是否阻止通过iframe打开页面（true=阻止，false=允许）
  onDevToolsOpen = "none"                 # 检测到开发者工具打开时的行为：none（无操作）、redirect（跳转）、clear（清空页面）、close（尝试关闭）、debugger（使用debugger）
  redirectUrl = "/"                      # 当onDevToolsOpen为redirect时，跳转的URL

# ===== 轮播图配置 =====
[params.carousel]
  enable = true                          # 是否启用轮播图功能
  height = 200                           # 轮播图高度(px)
  autoplay = true                        # 是否自动播放
  interval = 5000                        # 自动播放间隔(毫秒)
  direction = "horizontal"               # 切换方向：horizontal(左右) / vertical(上下)
  showOnPages = ["home"]                 # 显示页面：home(首页) / all(所有页面) / ["home", "posts"]
  transparentMode = false                 # 启用轮播图透明背景模式（true=透明效果，false=默认背景）
  transparentType = "full"              # 透明效果类型：glass（透明毛玻璃效果）或 full（全透明效果）

# 轮播图轮播项配置
# 支持两种类型：post（文章）和 image（图片）
items:
  # 文章类型轮播项
  - type: "post"
    slug: "article-slug"  # 文章的slug字段值
  
  # 图片类型轮播项
  - type: "image"
    image: "https://example.com/image.jpg"
    title: "图片标题"
    description: "图片描述"
    link: "/link/"  # 点击跳转链接（可选）

hugo new posts/文章标题.md

---
title: "文章标题"
date: 2024-01-01T10:00:00+08:00
draft: false
description: "文章描述"
cover: "/images/cover.jpg"  # 封面图片
categories: ["技术"]
tags: ["Hugo", "主题"]
toc: true  # 启用目录
---

[outputs]
  home = ["HTML", "JSON"]  # 必须启用JSON输出

[params.search]
  engine = "local"
  indexPath = "/index.json"

# Artalk配置
[params.comment.artalk]
  server = "https://your-artalk-server.com"  # Artalk后端地址
  site = "your-site-name"                   # 站点名称
  useLocal = true                            # 使用本地资源
  
  # 可选CDN配置
  cdn = [
    { name = "jsDelivr", css = "https://cdn.jsdelivr.net/npm/artalk@2.9.1/dist/Artalk.css", js = "https://cdn.jsdelivr.net/npm/artalk@2.9.1/dist/Artalk.js" }
  ]
  cdnIndex = 0

<!-- 单曲 -->
{{< music server="netease" type="song" id="27583305" >}}

<!-- 播放列表 -->
{{< music server="tencent" type="playlist" id="9602925225" >}}

<!-- 专辑 -->
{{< music server="netease" type="album" id="16937" >}}

<!-- 搜索 -->
{{< music server="netease" type="search" id="海阔天空" >}}

<!-- 歌手 -->
{{< music server="netease" type="artist" id="2118" >}}

<!-- 本地文件 -->
{{< music name="歌曲名" artist="歌手" url="/audio/demo.mp3" cover="/img/default-cover.webp" >}}

<!-- 自定义选项 -->
{{< music 
  server="netease" 
  type="song" 
  id="27583305" 
  autoplay="false" 
  theme="#FF6B6B" 
  loop="all" 
  volume="0.7" 
>}}

<!-- 预设颜色 -->
{{< color "red" >}}红色文字{{< /color >}}
{{< color "blue" >}}蓝色文字{{< /color >}}

<!-- 自定义颜色 -->
{{< color "#FF5733" >}}自定义颜色{{< /color >}}

<!-- 主题色 -->
{{< color "primary" >}}主题色{{< /color >}}

{{< reply-visible id="unique-id" >}}
评论后才能看到的内容
{{< /reply-visible >}}

{{< collapse "点击展开" >}}
折叠的内容
{{< /collapse >}}

<!-- 默认展开 -->
{{< collapse "标题" "open" >}}
默认展开的内容
{{< /collapse >}}

{{< timeline >}}

{{< timeline-item "2025-10-25" "标题" "success" "star" >}}
时间线内容
{{< /timeline-item >}}

{{< timeline-item "2025-10-20" "标题2" "info" "check" >}}
更多内容
{{< /timeline-item >}}

{{< /timeline >}}

{{< tabs id="demo" tabs="选项卡1,选项卡2" >}}

{{< tab index="1" >}}
第一个选项卡的内容
{{< /tab >}}

{{< tab index="2" >}}
第二个选项卡的内容
{{< /tab >}}

{{< /tabs >}}

{{< gallery >}}
{{</* gallery-item 
  image="/img/photo1.jpg"
  caption="照片说明1"
>}}
{{< /gallery-item >}}

{{< gallery-item 
  image="/img/photo2.jpg"
  caption="照片说明2"
>}}
{{< /gallery-item >}}
{{< /gallery >}}

---
title: "加密文章"
password: "myPassword"
passwordHint: "自定义提示（可选）"
---
文章内容...

{{< encrypt password="pwd" hint="提示" >}}
加密内容
{{< /encrypt >}}

[params.encryption]
  enable = true
  fullHint = "🔒 此文章已加密，请输入密码查看完整内容"
  partialHint = "🔐 此部分内容已加密，请输入密码查看"
  wrongPasswordHint = "❌ 密码错误，请重试"
  
  # 全文加密弹窗样式配置（v2.7.1+）
  popupTextColor = "#ffffff"              # 全文加密弹窗文字和图标颜色（默认白色）
  popupBackgroundColor = ""               # 全文加密弹窗背景色（支持单色或渐变，如："#667eea" 或 "linear-gradient(135deg, #667eea 0%, #764ba2 100%)"）
  popupBackgroundImage = "/img/bj.jpg"    # 全文加密弹窗背景图路径（留空则不使用背景图）
  
  # 部分加密弹窗样式配置（独立设置，互不影响）（v2.7.1+）
  partialPopupTextColor = "#ffffff"             # 部分加密弹窗文字和图标颜色（留空则使用默认主题色）
  partialPopupBackgroundColor = "linear-gradient(135deg, #667eea 0%, #764ba2 100%)"  # 部分加密弹窗背景色（支持单色或渐变，留空则使用默认背景）
  partialPopupBackgroundImage = ""       # 部分加密弹窗背景图路径（留空则不使用背景图）

<!-- B站视频 -->
{{< video "https://www.bilibili.com/video/BV1xx411c7mu" >}}

<!-- YouTube视频 -->
{{< video "https://www.youtube.com/watch?v=dQw4w9WgXcQ" >}}

<!-- 本地视频 -->
{{< video "/video/demo.mp4" >}}

<!-- 基础用法 -->
{{< button href="https://example.com" text="访问示例" >}}
{{< button href="/posts/" >}}查看文章{{< /button >}}

<!-- 带图标和样式 -->
{{< button href="#" icon="fas fa-download" color="success" >}}下载文件{{< /button >}}
{{< button href="#" color="primary" size="large" >}}大按钮{{< /button >}}
{{< button href="#" color="danger" outline="true" >}}危险按钮{{< /button >}}

<!-- 块级按钮 -->
{{< button href="#" color="primary" block="true" >}}块级按钮{{< /button >}}

<!-- 新窗口打开 -->
{{< button href="https://example.com" target="_blank" rel="noopener" color="info" >}}外部链接{{< /button >}}

[params.footer]
  # 自定义内容
  custom = """
    <div class="footer-links">
      <a href="/about">关于</a>
      <a href="/sitemap.xml">网站地图</a>
    </div>
  """
  
  # 运行时间显示
  [params.footer.runningTime]
    enable = true
    startDate = "2024-01-01"  # 建站日期
    prefix = "本站已运行"       # 前缀文字

[params.friendsCircle]
  # 数据源配置（全部从预生成JSON获取）
  preGeneratedJsonUrl = "/all.json"  # 预生成的JSON数据源URL
  
  # 显示配置
  initialDisplayCount = 10           # 初始显示卡片数量
  loadMoreCount = 10                 # 每次加载更多显示的卡片数量
  
  # 文章显示规则（按时间筛选）
  defaultArticleDays = 3             # 默认显示最近N天内的文章
  
  # 分组专属时间配置（可选，优先级高于 defaultArticleDays）
  [[params.friendsCircle.groupArticleDays]]
    name = "博客组织"                # 分组名称（支持模糊匹配）
    days = 20                        # 显示最近N天内的文章

[params.friendsCircle]
  # 文章卡片背景色模式配置
  cardColorMode = "random"          # transparent(透明) / random(随机彩色) / custom(自定义颜色)
  cardCustomColor = "#f5f5f5"       # 自定义背景色（当cardColorMode="custom"时生效）

[params.friendsCircle]
  # 分组选项卡背景色模式配置
  tabColorMode = "random"           # default(默认样式) / random(随机彩色) / custom(自定义颜色)
  tabCustomColor = "#667eea"        # 自定义背景色（当tabColorMode="custom"时生效）

[params.friendsCircle]
  # 默认显示最近N天内的文章（所有分组通用）
  defaultArticleDays = 3
  
  # 分组专属时间配置（可选，优先级高于 defaultArticleDays）
  [[params.friendsCircle.groupArticleDays]]
    name = "博客组织"      # 分组名称（支持模糊匹配）
    days = 20              # 显示最近20天内的文章
  
  # 可以添加更多分组配置
  [[params.friendsCircle.groupArticleDays]]
    name = "技术博客"
    days = 7               # 显示最近7天内的文章
  
  # 背景色配置（v2.7.9+）
  cardColorMode = "random"          # 文章卡片背景色模式
  cardCustomColor = "#f5f5f5"       # 自定义背景色（custom模式）
  tabColorMode = "random"           # 分组选项卡背景色模式
  tabCustomColor = "#667eea"        # 自定义背景色（custom模式）

# ===== 弹窗公告配置 =====
[params.popup]
  enable = true                            # 是否启用弹窗公告功能
  zIndex = 10000                           # 弹窗层级（确保在最上层）

# 弹窗公告数据配置
# 支持多个弹窗，按顺序显示

- id: "popup-1"                    # 弹窗唯一标识
  enable: true                      # 是否启用此弹窗
  title: "欢迎访问"                  # 弹窗标题
  content: |                        # 弹窗内容（支持HTML）
    <p>欢迎来到我的博客！</p>
    <p>这里是我的技术分享和日常记录。</p>
  mode: "modal"                     # 弹出模式：modal（模态框）、toast（提示框）、banner（横幅）
  position: "center"                # 位置：center（居中）、top（顶部）、bottom（底部）、top-left、top-right、bottom-left、bottom-right
  width: "500px"                    # 弹窗宽度（modal模式有效）
  height: "auto"                    # 弹窗高度（modal模式有效，auto为自适应）
  showCloseButton: true             # 是否显示关闭按钮
  showOverlay: true                  # 是否显示遮罩层（modal模式有效）
  closeOnOverlayClick: true         # 点击遮罩层是否关闭（modal模式有效）
  closeOnEscape: true               # 按ESC键是否关闭
  autoClose: false                  # 是否自动关闭（false为不自动关闭，数字为毫秒数）
  delay: 0                          # 延迟显示时间（毫秒）
  cookieName: "popup_1_closed"      # Cookie名称（用于记录关闭状态）
  cookieExpire: 7                   # Cookie过期天数（0为会话级，关闭浏览器后失效）
  showOnce: true                    # 是否只显示一次（基于Cookie）
  customCSS: ""                     # 自定义CSS样式
  customJS: ""                      # 自定义JavaScript代码
  showOnPages:                      # 显示页面类型（all=所有页面，home=首页，posts=文章页，pages=其他页面）
    - "all"

- id: "welcome-popup"
  enable: true
  title: "欢迎访问"
  content: |
    <p>欢迎来到我的博客！</p>
    <p>这里是我的技术分享和日常记录。</p>
  mode: "modal"
  position: "center"
  width: "500px"
  showCloseButton: true
  showOverlay: true
  closeOnOverlayClick: true
  closeOnEscape: true
  autoClose: false
  delay: 0
  cookieName: "welcome_popup_closed"
  cookieExpire: 7
  showOnce: true
  showOnPages:
    - "all"

- id: "notification-toast"
  enable: true
  title: "通知"
  content: |
    <p>Demius主题已更新</p>
  mode: "toast"
  position: "top-right"
  width: "300px"
  showCloseButton: true
  showOverlay: false
  autoClose: 5000
  delay: 1000
  showOnPages:
    - "all"

- id: "maintenance-banner"
  enable: true
  title: "重要公告"
  content: |
    <p>网站维护通知：将于今晚22:00-24:00进行系统维护</p>
  mode: "banner"
  position: "top"
  width: "100%"
  showCloseButton: true
  cookieName: "maintenance_banner_closed"
  cookieExpire: 1
  customCSS: |
    .popup-banner {
      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
      color: white;
    }
  showOnPages:
    - "all"

# ===== 顶部公告栏配置 =====
[params.topAnnouncement]
  enable = true                            # 是否启用顶部公告栏
  mode = "custom"                          # 显示模式：custom（自定义文字）或 shuoshuo（说说轮播）
  height = 40                              # 公告栏高度(px)
  stickyWithHeader = true                  # 是否与导航栏一起固定（true=导航栏固定时公告栏也固定，false=公告栏不固定）
  
  # 自定义文字模式配置
  [params.topAnnouncement.custom]
    text = "欢迎来到我的博客！"              # 公告文字内容（支持HTML）
    link = ""                               # 点击跳转链接（可选，留空则不跳转）
    linkText = ""                           # 链接文字（可选）
  
  # 说说轮播模式配置
  [params.topAnnouncement.shuoshuo]
    apiUrl = "https://mm.demius.tech/api/memo/list"  # 说说API地址
    count = 3                               # 轮播显示几条说说（1-5条）
    interval = 5000                         # 轮播切换间隔(毫秒)
    transitionDuration = 500               # 轮播切换动画持续时间(毫秒，建议200-1000)
    showAvatar = true                       # 是否显示头像
    showTime = true                         # 是否显示时间
    cacheDuration = 1800000                 # 缓存时间(毫秒，30分钟=1800000)
    clickable = true                        # 是否可点击跳转到说说页面（true=可点击，false=不可点击）
    shuoshuoPageUrl = "/shuoshuo/"         # 说说页面URL（用于跳转）

[params.topAnnouncement]
  enable = true
  mode = "custom"
  height = 40
  stickyWithHeader = true
  
  [params.topAnnouncement.custom]
    text = "🎉 欢迎访问我的博客！"
    link = "/about"
    linkText = "了解更多"

[params.topAnnouncement]
  enable = true
  mode = "shuoshuo"
  height = 40
  stickyWithHeader = true
  
  [params.topAnnouncement.shuoshuo]
    apiUrl = "https://mm.demius.tech/api/memo/list"
    count = 3
    interval = 5000
    transitionDuration = 1000
    showAvatar = true
    showTime = true
    clickable = true
    shuoshuoPageUrl = "/shuoshuo/"

[params.topAnnouncement]
  enable = true
  mode = "custom"
  stickyWithHeader = false  # 公告栏不固定，随页面滚动
  
  [params.topAnnouncement.custom]
    text = "重要公告：网站维护中"

# ===== 文章链接卡片和跳转中转配置 =====
[params.linkCard]
  enable = true                             # 是否启用链接卡片功能
  cardMode = "external"                     # 卡片显示模式：none（不显示）、all（所有链接）、internal（仅内部链接）、external（仅外部链接）
  openInNewTab = true                       # 链接是否在新标签页打开（true=新标签页，false=当前页面）
  showArticleInfo = true                    # 是否显示文章信息（仅内部链接有效）
  showArticleTitle = true                   # 是否显示文章标题（仅内部链接有效）
  showArticleDate = true                    # 是否显示文章日期（仅内部链接有效）
  showArticleSummary = true                 # 是否显示文章摘要（仅内部链接有效）
  redirectPage = true                       # 是否启用跳转中转页（外部链接通过中转页跳转）
  
  # 跳转中转页配置
  [params.linkCard.redirect]
    pagePath = "/go/"                       # 跳转中转页路径（相对于站点根目录）
    countdown = 3                           # 倒计时时间（秒），0表示不自动跳转
    showCountdown = true                    # 是否显示倒计时
    showButton = true                       # 是否显示立即跳转按钮
    safeMessage = "😃 💡倒计时结束自动跳转，也可自行点击跳转，请注意您的账号和财产安全"  # 安全提示信息
  
  # 替换白名单（匹配的链接不会被替换为卡片或跳转页）
  replaceWhitelist = [
    # "https://example\\.com/.*",           # 正则表达式示例
    # "https://trusted-site\\.com"          # 字符串匹配示例
  ]
  
  # 页面白名单（仅在这些页面处理链接）
  pageWhitelist = [
    # "/posts/.*",                          # 仅文章页
    ".*"                                    # 所有页面
  ]
  
  # 元素白名单（仅在这些元素内处理链接）
  elementWhitelist = [
    ".post-content"                        # 文章内容区域
    # "#article-container"                  # 其他容器示例
  ]
  
  # 跳转白名单（匹配的链接使用跳转页但显示为安全）
  redirectWhitelist = [
    # "https://zhihu\\.com/.*",             # 知乎链接示例
    # "https://.*\\.github\\.io/.*"         # GitHub Pages示例
  ]

[params.linkCard]
  enable = true
  cardMode = "external"                     # 仅外部链接显示卡片
  openInNewTab = true
  redirectPage = true                       # 启用跳转中转页

[params.linkCard]
  enable = true
  cardMode = "all"                          # 所有链接显示卡片
  showArticleInfo = true
  showArticleTitle = true
  showArticleDate = true
  showArticleSummary = true
  redirectPage = false                      # 不启用跳转中转页

[params.linkCard]
  enable = true
  cardMode = "external"
  redirectPage = true
  
  # 替换白名单：这些链接不会被处理
  replaceWhitelist = [
    "https://trusted-site\\.com/.*",       # 信任的网站
    "https://example\\.com"                 # 示例网站
  ]
  
  # 页面白名单：仅在这些页面处理链接
  pageWhitelist = [
    "/posts/.*"                             # 仅文章页
  ]
  
  # 元素白名单：仅在这些元素内处理链接
  elementWhitelist = [
    ".post-content",                        # 文章内容区域
    "#article-container"                     # 文章容器
  ]

# ===== 背景粒子特效配置 =====
# 参考 BeaconNav 主题实现，支持背景粒子特效
[params.particleEffect]
  enable = false                         # 是否启用背景粒子特效（true=启用，false=禁用）
  count = 80                            # 粒子数量（建议范围：50-150，数量越多性能消耗越大）
  color = ""                             # 粒子颜色（留空则根据主题自动适配：暗色模式白色，亮色模式黑色）
                                        # 格式：rgba(255, 255, 255, 0.5) 或 #ffffff
  lineColor = ""                         # 连线颜色（留空则根据主题自动适配）
                                        # 格式：rgba(255, 255, 255, 0.1) 或 #ffffff
  lineDistance = 150                     # 连线距离（像素，粒子之间距离小于此值时会连线）
  speed = 0.5                            # 粒子移动速度（建议范围：0.1-2.0）
  radius = 1.5                           # 粒子半径（像素）
  interactive = true                     # 是否启用鼠标交互（true=鼠标移动时粒子会响应，false=不响应）
  zIndex = 0                             # 层级（0=最底层背景，数值越大越靠前）

[params.particleEffect]
  enable = true                          # 一键开启
  count = 80                             # 默认粒子数量
  # color 和 lineColor 留空，自动适配主题

[params.particleEffect]
  enable = true
  count = 100                            # 增加粒子数量
  color = "rgba(79, 195, 247, 0.5)"     # 自定义粒子颜色（蓝色）
  lineColor = "rgba(79, 195, 247, 0.1)"  # 自定义连线颜色
  speed = 0.8                            # 加快移动速度
  interactive = true                     # 启用鼠标交互

[params.particleEffect]
  enable = true
  count = 50                             # 减少粒子数量，提升性能
  speed = 0.3                            # 降低移动速度
  interactive = false                    # 禁用鼠标交互，减少计算

---
title: "数据统计"
date: 2025-01-27T20:00:00+08:00
type: "data"
layout: "data"
comments: false
slug: "data"
---

欢迎来到数据统计页面！

[params.data]
  showTotalWords = true                  # 全站字数
  showTotalPosts = true                  # 全站文章数
  showResponseTime = true                # 响应耗时
  showLastUpdate = true                 # 最后更新时间
  showCommentCount = true                # 评论数目（需要Artalk API支持）

/* 自定义样式 */
:root {
  --primary-color: #你的主色;
  --accent-color: #你的强调色;
}

/* 覆盖主题样式 */
.your-custom-class {
  /* 你的样式 */
}

// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
  // 你的自定义逻辑
});

[params.images]
  avatar = "/img/avatar.png"             # 作者头像
  defaultCover = "/img/default-cover.jpg" # 默认封面
  fallbackImage = "/img/404.jpg"         # 备用图片
  favicon = "/img/favicon.ico"           # 网站图标
  logo = "/img/logo.png"                 # 网站LOGO

[related]
  threshold = 80
  includeNewer = true
  toLower = true
  
  [[related.indices]]
    name = "tags"
    weight = 100
    
  [[related.indices]]
    name = "categories"
    weight = 80

[markup]
  [markup.tableOfContents]
    startLevel = 2    # 从h2开始
    endLevel = 6      # 到h6结束
    ordered = false   # 不显示序号

hugo --minify

name: Deploy to GitHub Pages

on:
  push:
    branches: [ main ]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
        with:
          submodules: true
          fetch-depth: 0
      
      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: 'latest'
          extended: true
      
      - name: Build
        run: hugo --minify
      
      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./public