转载自: https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-features/
介绍
-
我们将在下面的所有示例中使用
yml/yaml格式，我建议使用yml而不是toml，因为它更易于阅读。 -
如果你需要，你可以找 YML to TOML 这类转换器。
Assets (js/css)
以下是默认启用的
- minification - makes the assets size smallest as possible.
- bundling - bundles all the styles in one single asset
- fingerprint/integrity check.
默认主题亮/暗/自动
params:
# defaultTheme: light
# defaultTheme: dark
defaultTheme: auto # to switch between dark or light according to browser theme
主题切换切换（默认启用）
在页面标题之外显示图标以更改主题
禁用方法：
disableThemeToggle: true
您可以参考下表以更好地理解…
defaultTheme |
disableThemeToggle |
checks local storage? | checks system theme? | Info |
|---|---|---|---|---|
auto |
true | No | Yes | only system theme |
| false | Yes (if not->2) | Yes (2) | switch present | |
dark |
true | No | No | force dark only |
| false | Yes | No | switch present | |
light |
true | No | No | force light only |
| false | Yes | No | switch present |
归档布局 Archives Layout
在content目录中创建一个带有archive.md的页面，内容如下
.
├── config.yml
├── content/
│ ├── archives.md <--- Create archive.md here
│ └── posts/
├── static/
└── themes/
└── PaperMod/
并添加以下内容
---
title: "Archive"
layout: "archives"
url: "/archives/"
summary: archives
---
注意： Archives Layout不支持多语言月份翻译。
如: archives.md
主页模式 Regular Mode (default-mode)
主页模式 Home-Info Mode
使用第一个条目作为一些显示信息
将以下内容添加到配置文件中
params:
homeInfoParams:
Title: Hi there wave
Content: Can be Info, links, about...
socialIcons: # optional
- name: "<platform>"
url: "<link>"
- name: "<platform 2>"
url: "<link2>"
主页模式 Profile Mode
将索引/主页显示为带有社交链接和图像的整页
将以下内容添加到配置文件中
params:
profileMode:
enabled: true
title: "<Title>" # optional default will be site title
subtitle: "This is subtitle"
imageUrl: "<image link>" # optional
imageTitle: "<title of image as alt>" # optional
imageWidth: 120 # custom size
imageHeight: 120 # custom size
buttons:
- name: Archive
url: "/archive"
- name: Github
url: "https://github.com/"
socialIcons: # optional
- name: "<platform>"
url: "<link>"
- name: "<platform 2>"
url: "<link2>"
搜索页 Search Page
PaperMod 使用Fuse.js Basic for seach functionality
将以下内容添加到站点配置，config.yml
outputs:
home:
- HTML
- RSS
- JSON # is necessary
在content目录下创建一个带有search.md的页面，内容如下
---
title: "Search" # in any language you want
layout: "search" # is necessary
# url: "/archive"
# description: "Description for Search"
summary: "search"
---
要隐藏特定页面不被搜索，请将其添加到帖子的前面
---
searchHidden: true
如: search.md
搜索页面也有键绑定：
- 向上/向下移动列表的箭头键
- Enter 键（返回）或右箭头键转到突出显示的页面
- 清除搜索框和结果的退出键
对于多语言使用 search.<lang>.md 例如。 search.es.md。
注意： 搜索仅适用于当前语言，用户当前使用的语言 !
自定义 Fusejs 选项
有关选项，请参阅 https://fusejs.io/api/options.html，添加如下所示的选项。
params:
fuseOpts:
isCaseSensitive: false
shouldSort: true
location: 0
distance: 1000
threshold: 0.4
minMatchCharLength: 0
keys: ["title", "permalink", "summary", "content"]
Draft Page indication
添加[draft] 标记以指示草稿页面。
文章封面
在帖子的页面变量中添加：
cover:
image: "<image path/url>"
# can also paste direct link from external site
# ex. https://i.ibb.co/K0HVPBd/paper-mod-profilemode.png
alt: "<alt text>"
caption: "<text>"
relative: false # To use relative path for cover image, used in hugo Page-bundles
当您在 Page Bundle 中包含图像时，将使用 HTML5 srcset 字段自动提供多种尺寸的图像。
为了减少站点的生成时间和大小，您可以使用禁用此功能
params:
cover:
responsiveImages: false
要在帖子页面上启用指向完整图像大小的超链接，请使用
params:
cover:
linkFullImages: true
文章分享按钮
在每个帖子的底部显示分享按钮
要显示共享按钮添加
params:
ShowShareButtons: true
显示文章阅读时间
显示阅读时间（阅读内容所需的估计时间，以分钟为单位。）
要显示阅读时间添加
Params:
ShowReadingTime: true
在博客文章中显示目录 (Toc)
在博客页面上显示 ToC
要显示 ToC，请在页面变量中添加以下内容
ShowToc: true
要在帖子中保持 Toc Open 默认，请在页面变量中添加以下内容：
TocOpen: true
面包屑导航
在帖子标题上方添加面包屑导航以显示小节和导航到主页
params:
ShowBreadCrumbs: true
可以禁用特定页面的front-matter
---
ShowBreadCrumbs: false
---
编辑帖子链接
添加一个按钮，通过使用帖子的文件路径链接到编辑目标来建议更改。
对于站点配置使用：
Params:
editPost:
URL: "https://github.com/<path_to_repo>/content"
Text: "Suggest Changes" # edit text
appendFilePath: true # to append file path to Edit link
可以为单个页面修改
---
editPost:
URL: "https://github.com/<path_to_repo>/content"
Text: "Suggest Changes" # edit text
appendFilePath: true # to append file path to Edit link
---
上面的示例将生成帖子文件“posts/post-name.md”的以下链接： https://github.com/<path_to_repo>/content/posts/post-name.md
| Parameter | Required | Default Value |
|---|---|---|
| editPost.URL | true | - |
| editPost.appendFilePath | false | false |
| editPost.Text | false | “Edit” |
由于生成的链接是一个普通的 HTML 锚标签 <a href=...>，你可以
还可以使用其他 URL 模式，例如 mailto://，例如
URL: "mailto://mail@example.com?subject=Suggesting changes for "
帖子下方的其他帖子建议
在单个帖子下添加上一个/下一个帖子建议
params:
ShowPostNavLinks: true
多个作者
要在帖子中使用多个作者，在帖子变量中：
---
author: ["Me", "You"]
---
要在站点范围内使用多作者，请在 config.yml 中配置：
params:
author: ["Me", "You"]
注释
要添加评论，请创建一个 html 文件
layouts/partials/comments.html
并粘贴您的评论提供者提供的代码
也在配置中添加这个
params:
comments: true
阅读更多关于这个问题hugo-comments
访问密钥AccessKeys
c - ToC Open/Close
g - Go To Top
h - Home (according to current lang)
t - Theme toggle
/ - Jumps to search page if in menu
SEO优化
仅在 env: production 时启用
推特卡片支持
译者注: 此特性会在html的head中生成meta name=“twitter:card"等。此举方便分享到推特上。推特能获取该网站的基本信息，包含图片。
- The Twitter Cards metadata, except
twitter:imageshould not require additional configuration, since it is generated from metadata that you should already have (for instance the page title and description). - The
twitter:imageuses the Post Cover Image, if present. - In the absence of a cover images, the first image from the
imagesfrontmatter (a list) is used.images: - image_01.png - image_02.png - Finally, if neither of those are provided,
twitter:imagecomes from the first Page Bundle image withfeaturein the name, with a fallback to the first image withcoverorthumbnailin the name.
开放内容协议 OpenGraph support
译者注: 微博翻译为：兴趣图谱。也称开放图谱。此特性会在html的head中生成meta property=“og:title"等。此举方便分享到支持OpenGraph的社交媒体上，也能更好的帮助百度等搜索引擎抓取和呈现。
OpenGraph样例（Telegram中）
- The OpenGraph metadata, except
og:imageshould not require additional configuration, since it is generated from metadata that you should already have (for instance the page title and description). - The
og:imageuses the Post Cover Image, if present. - In the absence of a cover images, the first image from the
imagesfrontmatter (a list) is used.images: - image_01.png - image_02.png - Finally, if neither of those are provided,
og:imagecomes from the first Page Bundle image withfeaturein the name, with a fallback to the first image withcoverorthumbnailin the name. - For pages, you can also add audio (using frontmatter
audio: filename.ext) and/or videos.videos: - filename01.mov - filename02.avi
多语言支持
杂项
滚动条主题（默认）
在页内链接之间平滑滚动（默认情况下）
滚动到顶部按钮（默认情况下）
Displays a Scroll-to-Top button in right-bottom corner