hugo个人博客 even主题美化记录

1. 点击查看详细内容

前面加了#，使用时去掉

<details><summary>点击查看详细内容</summary>#  ```1+1cd data
#  ```</details>

1+1
cd data

2.加个框

<details><summary><table><tr><td bgcolor=DarkSeaGreen>点击查看详细内容</td></t></table></summary>#  ```1+1cd data
#  ```</details>

1+1
cd data

3. 文章访问加密

文件修改位置：themes\even\layouts\partials\header.html末尾加上👇

在想要添加密码的文章头部添加： password: 0000

<script>(function(){if('{{ .Params.password }}'){if (prompt('请输入文章密码') !== '{{ .Params.password }}'){alert('密码错误！');history.back();}}})();
</script>

4. 可以修改顶部内容

目录\myblog\themes\even\layouts\partials\header.html
如加c34d或emoji表情

5. 修改归档的布局

目录themes\even\assets\sass\_partial\_archive.scss

6. 图片

图片放在static/images/ 文件夹下

![](/images/study.jpg)

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-xN693yWz-1666320810333)(/images/study.jpg)]

图片大小调节

<img src="/images/study.jpg" style="zoom:33%;"/>

7. 添加下面的内容到config.toml，可以显示html的代码

[markup.goldmark.renderer]
unsafe = true

8. Admonitions配置

在themes\even\layouts\shortcodes下
总的admonition.html分割成一个个
创建tip或warning或note.html，可以生成Admonitions

9. TOC的设置

目录在\themes\even\layouts\partials\post
修改gt .WordCount 200的数值可以设置超过多少数值就自动显示TOC

10. _back-to-top.scss修改返回顶部的.

11.新增导航栏全新内容

在content目录下,创建R文件夹
在\themes\even\layouts复制post文件夹并改名为R
这个独立的菜单栏会独立的内容显示，标签和分类有效
不会合并到归档

12. TOC识别的层数

在config.toml修改

[markup][markup.tableOfContents]endLevel = 3ordered = falsestartLevel = 2

f

13.文章底部标签加emoji

在even\assets\sass\_partial\_post\_footer.scss修改

14.标题前面或后面添加特殊图标

在even\assets\sass\_partial\_post\_content.scss修改

15. code颜色修改

在themes\even\assets\sass\_partial\_post\_code.scss修改

在桌面生成参考👇，然后复制相应内容到_code.scss

代码style选择网页

hugo gen chromastyles --style=monokai > syntax.css

16. 首页美化

themes\even\layouts\ index.html修改，保留最基本框架👇

{{- define "content" -}}{{- end -}}

17. 顶部的名字修改

如c34d，在`\themes\even\assets\sass\_variables.scss`的// Font family of the logo.    
名字在config.toml的logoTitle = "c34d"