deemoprobe / hugo-papermod2 Goto Github PK

语言：中文 | English

该主题根据Hugo PaperMod主题修改而来: https://github.com/adityatelange/hugo-PaperMod

中文版初稿见博主：Sulv's Blog，本人在原博主GitHub项目基础上进行了个人定制和优化（UI基本没大改，主要是静态文件优化，删除了评论留言等功能，使之更适合纯文本技术博客）

① 用git clone的方式拉取代码至桌面，此时会在桌面生成hugo-papermod2目录

② 进入到hugo-papermod2目录，输入git submodule update --init，表示拉取themes/下的hugo-PaperMod子模块，里面放的是官方主题，拉取来源是.gitmodules文件的链接，详细操作可参考：Git子模块

③ 把目录定位到hugo-papermod2下，在终端输入hugo server -D，在浏览器输入：localhost:1313 即可看到现成的博客模板。

优化前可以通过：PageSpeed Insights测试一下自己站点的性能，根据分析结果进行优化。

本来为了网站的加载时间，是不打算定制的启用汉语字体的，但这款字体实在是太好看了，既美观又不花里胡哨，推荐：LXGW WenKai / 霞鹜文楷，将tff字体文件下载后放在static/fonts文件夹下，然后在文件css/extended/font.css中使用即可

/* 在文件css/extended/font.css中优化 */
font-display: swap; /* 在定制字体加载前启用备选字体，避免因字体未加载完全而白屏的情况 */

/* 备选字体在css/extended/blank.css文件指定 "PingFang SC", "Microsoft YaHei"为备选*/
font-family: LXGWWenKai-Regular, "PingFang SC", "Microsoft YaHei", sans-serif;

模板内部有许多个人信息需要自行修改，可以参考原博主的建站教程：hugo博客搭建 | PaperMod主题

根据网页性能，适当修改layouts/partials/footer.html、assets\css\extended\fonts.css、assets\css\extended\blank.css等文件中的css和js文件外链，选择合适的CDN外链。

这是我优化后，除了字体文件基本在1s左右能完成博客的正常访问，由于github.io本来就慢，毕竟是白嫖，勉强可以接受，后续将持续优化。暂时没找到合适的CDN存放字体文件和GIF，主要是这俩首次加载比较慢。

# 生成新文章，可指定content下任意路径，不指定则直接在content目录下生成
hugo new posts/tech/file.md
# Markdown渲染为HTML，--cleanDestinationDir参数含义是生成静态博客的时清除部分用不上的static内容
hugo -F --cleanDestinationDir

# 同步到远程GitHub Pages仓库
cd public
# 下面两步仅需在首次git初始化执行
# git init
# git remote add origin https://github.com/deemoprobe/deemoprobe.github.io.git
git add -A
git commit -m "modify"
git push -u origin master

bilibili: {{< bilibili BV1Fh411e7ZH(填 bvid) >}}

youtube: {{< youtube w7Ft2ymGmfc >}}

ppt: {{< ppt src="网址" >}}

douban: {{< douban src="网址" >}}

# 文章内链卡片
# 末尾要加 md，只能填写相对路径，如下
{{< innerlink src="posts/tech/mysql_1.md" >}}

gallery:

{{< gallery >}}
{{< figure src="https://YOUR_DOMAIN/posts/read/structural_thinking/0.png" >}}
{{< figure src="https://YOUR_DOMAIN/posts/read/structural_thinking/0.png" >}}
{{< /gallery >}}

搜狗输入法"win+."快捷键可以调出输入法的表情，从中选择想要的即可使用🍕🍔🍟🌭🍿🚗🦽🚉，这些表情可以用在博客的任意位置：评论区、留言区、页面展示、菜单栏等等。

1. 有些使用者会部署到github，可能遇到跨系统的问题，如提示LF will be replaced by CRLF in ******，这时输入命令：git config core.autocrlf false，解决换行符自动转换的问题。

2. 国内访问时jquery.min.js和font-awesome.min.css两个文件加载特别慢，这时候需要更换这俩文件的CDN链接，网上直接搜即可，我暂时使用的是https://cdn.staticfile.org/jquery/3.6.3/jquery.min.js和https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.min.css，不挂VPN情况下加载时长在300ms以内，勉强可以使用。