搭建博客 - Hugo + PaperMod

baseURL: "https://yourBlogDomain.com/" # 博客域名
paginate: 10 # 首页每页显示的文章数
theme: hugo-PaperMod-7.0

enableRobotsTXT: true # 允许爬虫抓取到搜索引擎，建议 true
hasCJKLanguage: true # 自动检测是否包含 中文日文韩文 如果文章中使用了很多中文引号的话可以开启
buildDrafts: false # 这个选项控制是否在构建站点时包括标记为草稿的内容
buildFuture: false # 这个选项控制是否在构建站点时包括未来发布日期的内容。
buildExpired: false # 这个选项控制是否在构建站点时包括过期的内容。将其设置为 false 意味着在生产环境中不会包括过期的文章。这可以确保你的站点只显示最新和相关的内容
minify:
  disableXML: true # true 将禁用 XML 站点地图的生成。如果你不需要 XML 站点地图,这可以减少构建时间
  minifyOutput: true # true 会压缩 HTML、CSS 和 JavaScript 文件,从而减小页面的文件大小,提高页面加载速度

params:
  env: production # to enable google analytics, opengraph, twitter-cards and schema.
  keywords: [
      keywords1,
      keywords2,
      keywords3,
    ] # 首页的关键词
  displayFullLangName: true
  label: # 左上角图标
    icon: "img/favicon.gif" # 图片路径：/static/img
    iconHeight: 35

  images: ["<link or path of image for opengraph, twitter-cards>"]
  DateFormat: "2006-01-02" # 将时间格式修改为国内常用格式
  defaultTheme: auto # dark, light
  disableThemeToggle: false
  ShowReadingTime: true # 阅读文章时间
  ShowShareButtons: false # 文章底部的分享按钮
  ShowPostNavLinks: true
  ShowBreadCrumbs: true # 显示面包屑导航
  ShowCodeCopyButtons: true
  ShowWordCount: true
  ShowRssButtonInSectionTermList: true
  UseHugoToc: true
  disableSpecial1stPost: false
  disableScrollToTop: false
  comments: true # 文章评论
  hidemeta: false
  hideSummary: true # 隐藏文章摘要
  showtoc: true # 显示文章目录
  tocopen: true # 默认打开文章目录

  assets:
    # disableHLJS: true # to disable highlight.js
    # disableFingerprinting: true
    favicon: "img/favicon.gif" # 图片路径：/static/img 
    favicon16x16: "img/favicon.gif"
    favicon32x32: "img/favicon.gif"
    apple_touch_icon: "img/favicon.gif"
    safari_pinned_tab: "img/favicon.gif"

  cover:
    hidden: true # hide everywhere but not in structured data
    hiddenInList: true # hide on list pages and home
    hiddenInSingle: true # hide on single page

  # for search
  # https://fusejs.io/api/options.html
  fuseOpts:
    isCaseSensitive: false
    shouldSort: true
    location: 0
    distance: 1000
    threshold: 0.4
    minMatchCharLength: 0
    limit: 10 # refer: https://www.fusejs.io/api/methods.html#search
    keys: ["title", "permalink", "summary", "content"]

# Read: https://github.com/adityatelange/hugo-PaperMod/wiki/FAQs#using-hugos-syntax-highlighter-chroma
pygmentsUseClasses: true
markup:
  highlight:
    # noClasses: false
    anchorLineNos: true
    codeFences: true
    guessSyntax: true # 猜测语法，这个功能建议设置为 true, 如果你没有设置要显示的语言则会自动匹配
    lineNos: true # 是否显示行号
    style: monokai

# 多语言配置
defaultContentLanguage: en # 默认语言为英文
defaultContentLanguageInSubdir: false # 默认语言也使用子目录（如 /en/）
languages:
  en: # 英文语言配置
    title: Rickey's blog
    description: "I sincerely document this because life is worth it."
    weight: 2
    languageCode: en-us
    languageName: "English"
    params:
      author: Rickey # 文章中默认显示的作者名字
      social: true
      # 首页博主简介
      profileMode:
        enabled: true
        title: "Rickey Gong"
        subtitle: "I sincerely document this because life is worth it."
        imageUrl: "avatar.png" # 图片需要放到static文件夹下
        imageWidth: 120
        imageHeight: 120
        imageTitle: "Welcome to Rickey's blog"
        buttons:
          - name: Posts
            url: posts
          - name: Archives
            url: archives
          - name: Links
            url: friends
          - name: Please have a coffee
            url: donate
      # 社交平台小图标，参考：https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-icons/
      socialIcons:
        - name: github
          url: "https://github.com/rickeygong/"
        - name: email
          url: "mailto:donghai.gong@outlook.com"
        - name: rss
          url: /index.xml/
        - name: bilibili
          url: "https://space.bilibili.com/14020906"
        - name: linkedin
          url: "https://linkedin.com/in/donghai-gong-11a74b225"
    # 菜单顺序（英文）
    # Search，Posts，Categories，Archives，Tags，About，Links，RSS
    # weight 是权重的意思，从 1~8 表示右上角菜单按钮的顺序（从左往右）
    menu:
      main:
        - identifier: search
          name: Search
          url: /search/
          weight: 1
        - identifier: posts
          name: Posts
          url: /posts/
          weight: 2
        - identifier: categories
          name: Categories
          url: /categories/
          weight: 3
        - identifier: archives
          name: Archives
          url: /archives/
          weight: 4
        - identifier: tags
          name: Tags
          url: /tags/
          weight: 5
        - identifier: about
          name: About
          url: /about/
          weight: 6
        - identifier: friends
          name: Links
          url: /friends/
          weight: 7
        - identifier: rss
          name: RSS
          url: index.xml
          weight: 8

  zh: # 中文语言配置
    title: 龚东海的博客
    description: "我真诚地记录着，因为生活值得"
    weight: 1
    languageCode: zh-cn
    languageName: "简体中文"
    params:
      author: 龚东海 # 文章中默认显示的作者名字
      social: true
      # 首页博主简介
      profileMode:
        enabled: true
        title: "龚东海"
        subtitle: "我真诚地记录着，因为生活值得。"
        imageUrl: "avatar.png" # 图片需要放到static文件夹下
        imageWidth: 120
        imageHeight: 120
        imageTitle: "欢迎来到龚东海的博客"
        buttons:
          - name: 文章
            url: posts
          - name: 归档
            url: archives
          - name: 友链
            url: friends
          - name: 请喝咖啡
            url: donate
      # 社交平台小图标，参考：https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-icons/
      socialIcons:
        - name: github
          url: "https://github.com/rickeygong/"
        - name: email
          url: "mailto:donghai.gong@outlook.com"
        - name: rss
          url: /index.xml/
        - name: bilibili
          url: "https://space.bilibili.com/14020906"
        - name: linkedin
          url: "https://linkedin.com/in/donghai-gong-11a74b225"
    # 菜单顺序（中文）
    # 搜索，文章，分类，归档，标签，关于，友情链接，RSS
    menu:
      main:
        - identifier: search
          name: 搜索
          url: /search/
          weight: 1
        - identifier: posts
          name: 文章
          url: /posts/
          weight: 2
        - identifier: categories
          name: 分类
          url: /categories/
          weight: 3
        - identifier: archives
          name: 归档
          url: /archives/
          weight: 4
        - identifier: tags
          name: 标签
          url: /tags/
          weight: 5
        - identifier: about
          name: 关于
          url: /about/
          weight: 6
        - identifier: friends
          name: 友情链接
          url: /friends/
          weight: 7
        - identifier: rss
          name: RSS
          url: index.xml
          weight: 8

# ----- [Begin]. 搜索配置 -----
outputs:
  home:
    - HTML
    - RSS
    - JSON
# ----- [End]. 搜索配置 -----

<style>
    .friendurl {
        text-decoration: none !important;
        color: var(--primary) !important;
        box-shadow: none !important;
    }

    .myfriend {
        width: 56px !important;
        height: 56px !important;
        border-radius: 50% !important;
        padding: 2px;
        margin-top: 20px !important;
        margin-left: 14px !important;
        background-color: #fff;
    }

    .frienddiv {
        overflow: auto;
        height: 100px;
        width: 49%;
        display: inline-block !important;
        border-radius: 5px;
        background: none;

        -webkit-transition: box-shadow 0.4s ease, transform 0.4s ease;
        -moz-transition: box-shadow 0.4s ease, transform 0.4s ease;
        -o-transition: box-shadow 0.4s ease, transform 0.4s ease;

        transition: box-shadow 0.4s ease, transform 0.4s ease;
    }

    .frienddiv:hover {
        background: var(--code-bg);
        transition: box-shadow 1s ease, transform 1s ease;
    }

    .dark .frienddiv:hover {
        background: var(--code-bg);
        transition: box-shadow 1s ease, transform 1s ease;
    }

    .frienddiv:hover .frienddivleft img {
        transition: 0.9s !important;
        transform: rotate(360deg) !important;
    }

    .frienddivleft {
        width: 92px;
        float: left;
        margin-right: -5px;
    }

    .frienddivright {
        margin-top: 18px;
        margin-right: 18px;
    }

    .friendname {
        text-overflow: ellipsis;
        font-size: 100%;
        margin-bottom: 5px;
        color: var(--primary);
    }

    .friendinfo {
        text-overflow: ellipsis;
        font-size: 70%;
        color: var(--primary);
    }

    @media screen and (max-width: 600px) {
        .friendinfo {
            display: none;
        }

        .frienddivleft {
            width: 84px;
            margin: auto;
        }

        .frienddivright {
            height: 100%;
            margin: auto;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .friendname {
            font-size: 18px;
        }
    }

    .site-friend-link-image {
        border-radius: 50% !important;
    }

    .site-friend:hover img {
        transition: 0.9s !important;
        transform: rotate(360deg) !important;
    }
</style>

{{- if .IsNamedParams -}}
<a target="_blank" href={{ .Get "url" }} title={{if .Get "title" }} {{.Get "title" }} {{else}} {{.Get "name" }} {{end}}
    class="friendurl">
    <div class="frienddiv">
        <div class="frienddivleft">
            <img class="myfriend" src={{ .Get "logo" }} />
        </div>
        <div class="frienddivright">
            <div class="friendname">{{- .Get "name" -}}</div>
            <div class="friendinfo">{{- .Get "word" -}}</div>
        </div>
    </div>
</a>
{{- end }}

{{- $headers := findRE "<h[1-6].*?>(.|\n])+?</h[1-6]>" .Content -}}
    {{- $has_headers := ge (len $headers) 1 -}}
    {{- if $has_headers -}}
    <aside id="toc-container" class="toc-container wide">
        <div class="toc">
            <details {{if (.Param "TocOpen" ) }} open{{ end }}>
                <summary accesskey="c" title="(Alt + C)">
                    <span class="details">{{- i18n "toc" | default "Table of Contents" }}</span>
                </summary>

                <div class="inner">
                    {{- $largest := 6 -}}
                    {{- range $headers -}}
                    {{- $headerLevel := index (findRE "[1-6]" . 1) 0 -}}
                    {{- $headerLevel := len (seq $headerLevel) -}}
                    {{- if lt $headerLevel $largest -}}
                    {{- $largest = $headerLevel -}}
                    {{- end -}}
                    {{- end -}}

                    {{- $firstHeaderLevel := len (seq (index (findRE "[1-6]" (index $headers 0) 1) 0)) -}}

                    {{- $.Scratch.Set "bareul" slice -}}
                    <ul>
                        {{- range seq (sub $firstHeaderLevel $largest) -}}
                        <ul>
                            {{- $.Scratch.Add "bareul" (sub (add $largest .) 1) -}}
                            {{- end -}}
                            {{- range $i, $header := $headers -}}
                            {{- $headerLevel := index (findRE "[1-6]" . 1) 0 -}}
                            {{- $headerLevel := len (seq $headerLevel) -}}

                            {{/* get id="xyz" */}}
                            {{- $id := index (findRE "(id=\"(.*?)\")" $header 9) 0 }}

                            {{- /* strip id="" to leave xyz, no way to get regex capturing groups in hugo */ -}}
                            {{- $cleanedID := replace (replace $id "id=\"" "") "\"" "" }}
                            {{- $header := replaceRE "<h[1-6].*?>((.|\n])+?)</h[1-6]>" "$1" $header -}}

                                {{- if ne $i 0 -}}
                                {{- $prevHeaderLevel := index (findRE "[1-6]" (index $headers (sub $i 1)) 1) 0 -}}
                                {{- $prevHeaderLevel := len (seq $prevHeaderLevel) -}}
                                {{- if gt $headerLevel $prevHeaderLevel -}}
                                {{- range seq $prevHeaderLevel (sub $headerLevel 1) -}}
                                <ul>
                                    {{/* the first should not be recorded */}}
                                    {{- if ne $prevHeaderLevel . -}}
                                    {{- $.Scratch.Add "bareul" . -}}
                                    {{- end -}}
                                    {{- end -}}
                                    {{- else -}}
                                    </li>
                                    {{- if lt $headerLevel $prevHeaderLevel -}}
                                    {{- range seq (sub $prevHeaderLevel 1) -1 $headerLevel -}}
                                    {{- if in ($.Scratch.Get "bareul") . -}}
                                </ul>
                                {{/* manually do pop item */}}
                                {{- $tmp := $.Scratch.Get "bareul" -}}
                                {{- $.Scratch.Delete "bareul" -}}
                                {{- $.Scratch.Set "bareul" slice}}
                                {{- range seq (sub (len $tmp) 1) -}}
                                {{- $.Scratch.Add "bareul" (index $tmp (sub . 1)) -}}
                                {{- end -}}
                                {{- else -}}
                        </ul>
                        </li>
                        {{- end -}}
                        {{- end -}}
                        {{- end -}}
                        {{- end }}
                        <li>
                            <a href="#{{- $cleanedID -}}" aria-label="{{- $header | plainify -}}">{{- $header | safeHTML
                                -}}</a>
                            {{- else }}
                        <li>
                            <a href="#{{- $cleanedID -}}" aria-label="{{- $header | plainify -}}">{{- $header | safeHTML
                                -}}</a>
                            {{- end -}}
                            {{- end -}}
                            <!-- {{- $firstHeaderLevel := len (seq (index (findRE "[1-6]" (index $headers 0) 1) 0)) -}} -->
                            {{- $firstHeaderLevel := $largest }}
                            {{- $lastHeaderLevel := len (seq (index (findRE "[1-6]" (index $headers (sub (len $headers)
                            1)) 1) 0)) }}
                        </li>
                        {{- range seq (sub $lastHeaderLevel $firstHeaderLevel) -}}
                        {{- if in ($.Scratch.Get "bareul") (add . $firstHeaderLevel) }}
                    </ul>
                    {{- else }}
                    </ul>
                    </li>
                    {{- end -}}
                    {{- end }}
                    </ul>
                </div>
            </details>
        </div>
    </aside>
    <script>
        let activeElement;
        let elements;
        window.addEventListener('DOMContentLoaded', function (event) {
            checkTocPosition();

            elements = document.querySelectorAll('h1[id],h2[id],h3[id],h4[id],h5[id],h6[id]');
            // Make the first header active
            activeElement = elements[0];
            const id = encodeURI(activeElement.getAttribute('id')).toLowerCase();
            document.querySelector(`.inner ul li a[href="#${id}"]`).classList.add('active');
        }, false);

        window.addEventListener('resize', function (event) {
            checkTocPosition();
        }, false);

        window.addEventListener('scroll', () => {
            // Check if there is an object in the top half of the screen or keep the last item active
            activeElement = Array.from(elements).find((element) => {
                if ((getOffsetTop(element) - window.pageYOffset) > 0 &&
                    (getOffsetTop(element) - window.pageYOffset) < window.innerHeight / 2) {
                    return element;
                }
            }) || activeElement

            elements.forEach(element => {
                const id = encodeURI(element.getAttribute('id')).toLowerCase();
                if (element === activeElement) {
                    document.querySelector(`.inner ul li a[href="#${id}"]`).classList.add('active');
                } else {
                    document.querySelector(`.inner ul li a[href="#${id}"]`).classList.remove('active');
                }
            })
        }, false);

        const main = parseInt(getComputedStyle(document.body).getPropertyValue('--article-width'), 10);
        const toc = parseInt(getComputedStyle(document.body).getPropertyValue('--toc-width'), 10);
        const gap = parseInt(getComputedStyle(document.body).getPropertyValue('--gap'), 10);

        function checkTocPosition() {
            const width = document.body.scrollWidth;

            if (width - main - (toc * 2) - (gap * 4) > 0) {
                document.getElementById("toc-container").classList.add("wide");
            } else {
                document.getElementById("toc-container").classList.remove("wide");
            }
        }

        function getOffsetTop(element) {
            if (!element.getClientRects().length) {
                return 0;
            }
            let rect = element.getBoundingClientRect();
            let win = element.ownerDocument.defaultView;
            return rect.top + win.pageYOffset;
        }
    </script>
    {{- end }}

:root {
    --article-width: 650px;
    --toc-width: 230px;
  }
  
  .toc {
    margin: 0 2px 40px 2px;
    border: 1px solid var(--border);
    background: var(--entry);
    border-radius: var(--radius);
    padding: 0.4em;
  }
  
  .toc-container.wide {
    position: absolute;
    height: 100%;
    border-right: 1px solid var(--border);
    left: calc((var(--toc-width) * 0.9 + var(--gap)) * -1);
    top: calc(var(--gap) * 2);
    width: var(--toc-width);
  }
  
  .wide .toc {
    position: sticky;
    top: var(--gap);
    border: unset;
    background: unset;
    border-radius: unset;
    width: 100%;
    margin: 0 2px 40px 2px;
  }
  
  .toc details summary {
    cursor: zoom-in;
    margin-inline-start: 20px;
    padding: 12px 0;
  }
  
  .toc details[open] summary {
    font-weight: 500;
  }
  
  .toc-container.wide .toc .inner {
    margin: 0;
  }
  
  .toc .active {
    font-size: 110%;
    font-weight: 600;
    color: #614a85;
    text-decoration: underline;
  }
  
  .toc ul {
    list-style-type: circle;
  }
  
  .toc .inner {
    margin: 0 0 0 20px;
    padding: 0px 15px 15px 20px;
    font-size: 16px;
  
    max-height: 83vh;
    overflow-y: auto;
  }
  
  .toc .inner::-webkit-scrollbar-thumb {
    background: var(--border);
    border: 7px solid var(--theme);
    border-radius: var(--radius);
  }
  
  .toc li ul {
    margin-inline-start: calc(var(--gap) * 0.5);
    list-style-type: none;
  }
  
  .toc li {
    list-style: none;
    font-size: 0.95rem;
    padding-bottom: 5px;
  }
  
  .toc li a:hover {
    color: var(--secondary);
  }

<table
  {{- range $k, $v := .Attributes }}
    {{- if $v }}
      {{- printf " %s=%q" $k $v | safeHTMLAttr }}
    {{- end }}
  {{- end }} class="custom_table_style">
  <thead>
    {{- range .THead }}
      <tr>
        {{- range . }}
          <th
            {{- with .Alignment }}
              {{- printf " style=%q" (printf "text-align: %s" .) | safeHTMLAttr }}
            {{- end -}}
          >
            {{- .Text -}}
          </th>
        {{- end }}
      </tr>
    {{- end }}
  </thead>
  <tbody>
    {{- range .TBody }}
      <tr>
        {{- range . }}
          <td
            {{- with .Alignment }}
              {{- printf " style=%q" (printf "text-align: %s" .) | safeHTMLAttr }}
            {{- end -}}
          >
            {{- .Text -}}
          </td>
        {{- end }}
      </tr>
    {{- end }}
  </tbody>
</table>

<style>
.post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight){
  display: table;
  background-color: transparent;
  border-radius: 6px;
  border: 1px solid black;
  outline: 2px solid black;
  overflow-x: auto;
  table-layout: fixed;
  word-break: break-all;
  font-size: 12px;
}

.dark .post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight){
  outline: 2px solid rgb(54, 156, 95);
}

.post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) thead{
  background-color: #545d7b8a;
}

.dark .post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) thead{
  background-color: rgb(62, 62, 62);
}

.post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) td,
.post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) tr,
.post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) th{
  border-bottom: unset;
  border: 1px solid black,
}

.post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) td:hover,
.post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) td:focus{
  background-color: rgba(67, 166, 86, 0.8);
}

.dark .post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) td:hover,
.dark .post-content table:not(.lntable .highlighttable,.highlight table,.gist .highlight) td:focus{
  background-color: rgb(0, 0, 0, 0.7);
}
</style>

---
title: '{{ replace .File.ContentBaseName "-" " " | title }}' # 当前文章标题
description: ''  # 当前文章副标题
date: '{{ .Date }}' # 创建日期
author: "Rickey" # 作者
slug: '' # 文章Url
showToc: true # 显示目录
TocOpen: true # 自动展开目录
enableCopyright: true # 显示版权信息
comments: true # 显示评论
weight: null # 若置顶则为对应数字
draft: false # 是否为草稿
# 分类
Categories:
  - Example
  
# 标签
Tags:
  - Example

# 关键字
keywords:
    - keywords1
    - keywords2
    - keywords3

cover:
  # 图片的替代文本，用于无障碍访问和在图片无法加载时显示的文本
  alt: ''
  # 图片的说明文字，通常用于描述图片内容 
  caption: '' 
  # 封面图片的路径，可以是相对路径或绝对 URL，用于指定实际的封面图像
  image: '' 
  # 指示 image 路径是否为相对路径。如果为 true，则认为路径是相对于当前内容文件的；如果为 false，则认为是绝对路径
  relative: false 
---