教程

本文介绍在 PaperMod 博客中撰写文章的注意事项。 文章页面字段-必填项 每篇文章开头的 front matter 必须包含以下字段： --- title: "文章标题" # 必填：文章标题 date: 2026-03-16 # 必填：发布日期 --- 文章页面字段-常用可选项 --- # ===== 基础信息 ===== title: "文章标题" # 必填：文章标题 date: 2026-03-16 # 必填：发布日期（YYYY-MM-DD） lastmod: 2026-03-17 # 最后修改日期 description: "文章简介" # 文章描述，用于 SEO 和社交媒体分享 author: "作者名" # 作者名，覆盖默认设置 keywords: ["关键词1", "关键词2"] # SEO 关键词 # ===== 分类与标签 ===== tags: ["标签1", "标签2"] # 标签，细粒度分类，可多个 categories: ["分类名"] # 分类，粗粒度分类，通常一个 series: ["系列名"] # 系列文章，用于关联多篇相关文章 # ===== 发布状态 ===== draft: false # false = 发布，true = 草稿（不显示） publishDate: 2026-03-16 # 发布日期（可用于定时发布） expiryDate: 2026-12-31 # 过期日期，过期后文章不显示 # ===== 排序与置顶 ===== weight: 1 # 排序权重，数字越小越靠前（用于置顶） pinned: true # PaperMod 特有：置顶文章 # ===== 封面图片 ===== cover: image: "images/cover.jpg" # 封面图片路径（相对 static 目录） alt: "图片描述" # 图片 alt 文本（无障碍访问） caption: "图片说明" # 图片下方说明文字 relative: false # true = 相对于文章目录，false = 相对于 static # ===== 功能开关（覆盖全局设置）===== ShowToc: true # 是否显示目录 TocOpen: true # 目录是否默认展开 ShowReadingTime: true # 是否显示阅读时间 ShowShareButtons: true # 是否显示分享按钮 ShowBreadCrumbs: true # 是否显示面包屑导航 ShowPostNavLinks: true # 是否显示上一篇/下一篇导航 ShowCodeCopyButtons: true # 是否显示代码复制按钮 ShowWordCount: true # 是否显示字数 comments: false # 是否启用评论 # ===== 其他设置 ===== slug: "custom-url" # 自定义 URL 别名（默认用文件名） url: "custom-path/" # 自定义完整 URL 路径 type: "posts" # 内容类型（默认根据目录自动判断） layout: "custom-layout" # 自定义布局模板 --- 标签与分类 标签（tags）和分类（categories）的区别： ...

在搭建个人博客时，很多人会将博客的框架代码（如 Hugo/Hexo）、主题文件和文章的 Markdown 文件混在一个 GitHub 仓库里。这虽然简单，但随着文章越来越多，你的写作环境会被各种前端配置文件干扰；而且，如果你想写一些不公开的私密草稿，公开的仓库也无法满足需求。 为了获得最纯粹的写作体验，我采用了 「代码与内容分离」 的架构。今天这篇文章，就来详细聊聊如何基于 Hugo + PaperMod 主题，配合 Cloudflare Pages 部署这样一个现代化的博客。 🏗️ 架构概览：双仓库联动 我的博客由两个 GitHub 仓库组成： 引擎仓库 (公开)：PaperMod-Blog-Cloudflare 角色：博客的“打印机”与“骨架”。 内容：包含 Hugo 的配置文件、PaperMod 主题、自定义 CSS 等。没有实质性的文章内容。 内容仓库 (私有)：blog-content 角色：博客的“燃料”与“血肉”。 内容：纯净的 Markdown 文件和图片资源。 优势：设置为 Private (私有)，确保草稿和私密笔记的安全。写作时只需在本地使用 Obsidian 或 Typora 即可。 这两个仓库通过 Hugo Modules（Go Modules 底层）连接。当云端开始构建时，引擎会自动把内容仓库拉取过来，合并渲染成最终的网页。 在 config.yml 中添加如下配置： module: imports: - path: github.com/adityatelange/hugo-PaperMod - path: github.com/monstercjz/blog-content mounts: - source: blog-paper # 内容仓库的blog-paper目录 target: content/posts # 挂载到 content/posts 🛠️ 部署痛点一：Cloudflare 如何拉取私有内容？ 将公开的引擎仓库绑定到 Cloudflare Pages 非常简单，但在执行 hugo 构建命令时，如何拉取私有的 blog-content 仓库是核心难点。 ...

Markdonw All in one 粘贴的说明 如果你已经选中了一段文字，直接在文字上按 Ctrl + V 粘贴一个 URL。 结果： 它不会覆盖文字，而是直接把文字变成一个超链接格式：选中的文字。 "markdown.editor.pasteUrlAsFormattedLink.enabled": "smartWithSelection" 列表自动补全 按tap键进入子列表 按tap键进入一下层子列表 按删除键回到上层列表 任务列表自动补全 按tap键进入一下层子列表 alt+c自动切换任务状态 这是在新一行的时候按删除键回到上层列表 序号自动修复 如果都是有序列表，可以遵从tap进入子列表，删除回到上层列表 如果有序列表和非有序列表混着用，从子列表就回不到了上层列表 引用链接 这是一个引用链接 这是链接 文内引用 语法: []() []内是描述性文字 ()内是锚点，是#+锚点名字 锚点名字可以是某个标题，如果是标题的话，前面的#就可以不要，比如Markdonw All in one。在括号里先输入#就会有提示 锚点名字可以是文章中的某段文字，在这里随意填写。在括号里先输入#没有提示，得记得之前自己设置的锚点 锚点名字可以是跨文件中的某段文字，在这里随意填写。在括号里先输入文件名字，然后输入#，然后输入自定义锚点名字或者标题 indent-rainbow 大部分功能vscode已经可以取代，保留的原因是它可以进行空白区域块着色，更显目 markdown-header-coloring颜色样板 颜色样板一 [ "markdown-header-coloring.userDefinedHeaderColor": {// 方案一 "enabled": true, "Header_1": { "color": "", "backgroundColor": "background: linear-gradient(to right, rgba(245, 189, 6, 0.3), transparent); opacity: 0.5", "textDecoration": "font-weight: 800; font-size: 1.8em; background: -webkit-linear-gradient(0deg, #FFFFFF, #f5bd06, #FF8F00); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-shadow: 2px 2px 4px rgba(0,0,0,0.3);" }, "Header_2": { "color": "", "backgroundColor": "background: linear-gradient(to right, rgba(238, 16, 190, 0.2), transparent); opacity: 0.5", "textDecoration": "font-weight: 700; font-size: 1.6em; background: -webkit-linear-gradient(0deg, #FF80AB, #ee10be, #880E4F); -webkit-background-clip: text; -webkit-text-fill-color: transparent;" }, "Header_3": { "color": "", "backgroundColor": "background: linear-gradient(to right, rgba(5, 226, 255, 0.2), transparent); opacity: 0.5", "textDecoration": "font-weight: 600; font-size: 1.4em; background: -webkit-linear-gradient(0deg, #80DEEA, #05e2ff, #01579B); -webkit-background-clip: text; -webkit-text-fill-color: transparent;" }, "Header_4": { "color": "", "backgroundColor": "background: linear-gradient(to right, rgba(55, 255, 19, 0.15), transparent); opacity: 0.5", "textDecoration": "font-weight: 600; font-size: 1.3em; background: -webkit-linear-gradient(0deg, #C5E1A5, #37FF13, #1B5E20); -webkit-background-clip: text; -webkit-text-fill-color: transparent;" }, "Header_5": { "color": "", "backgroundColor": "background: linear-gradient(to right, rgba(255, 106, 0, 0.15), transparent); opacity: 0.5", "textDecoration": "font-weight: 600; font-size: 1.2em; background: -webkit-linear-gradient(0deg, #FFCC80, #ff6a00, #BF360C); -webkit-background-clip: text; -webkit-text-fill-color: transparent;" }, "Header_6": { "color": "", "backgroundColor": "background: linear-gradient(to right, rgba(163, 190, 140, 0.1), transparent); opacity: 0.5", "textDecoration": "font-weight: 600; font-size: 1.1em; background: -webkit-linear-gradient(0deg, #D1D1D1, #A3BE8C, #4F5B46); -webkit-background-clip: text; -webkit-text-fill-color: transparent;" } }, ] 颜色样板二 "markdown-header-coloring.userDefinedHeaderColor": { "enabled": true, "Header_1": { "color": "#f5bd06", // 纯 6 位 Hex，不要带透明度后缀 "backgroundColor": "#f5bd06", "textDecoration": "font-size: 1.2em; font-weight: bold; text-shadow: 2px 2px 3px rgba(0,0,0,0.5)", "overviewRulerColor": "4" }, "Header_2": { "color": "#ee10be", "backgroundColor": "#ee10be", "textDecoration": "font-size: 1.1em; font-weight: bold; text-shadow: 2px 2px 3px rgba(0,0,0,0.5)", "overviewRulerColor": "4" }, "Header_3": { "color": "#05e2ff", "backgroundColor": "#05e2ff", "textDecoration": "font-weight: bold; text-shadow: 2px 2px 3px rgba(0,0,0,0.5)", "overviewRulerColor": "4" }, "Header_4": { "color": "#37FF13", "backgroundColor": "#37FF13", "textDecoration": "font-weight: bold; text-shadow: 2px 2px 3px rgba(0,0,0,0.5)", "overviewRulerColor": "4" }, "Header_5": { "color": "#ff6a00", "backgroundColor": "#ff6a00", "textDecoration": "font-weight: bold; text-shadow: 2px 2px 3px rgba(0,0,0,0.5)", "overviewRulerColor": "4" }, "Header_6": { "color": "#A3BE8C", "backgroundColor": "#A3BE8C", "textDecoration": "font-weight: bold; text-shadow: 2px 2px 3px rgba(0,0,0,0.5)", "overviewRulerColor": "4" } },