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

最新推荐文章于 2025-03-21 19:49:13 发布

仿生bug

最新推荐文章于 2025-03-21 19:49:13 发布

阅读量945

点赞数 2

文章标签： c# 前端 javascript

本文链接：https://blog.youkuaiyun.com/weixin_46623488/article/details/127441875

版权

本文探讨了一连串关于编程、前端开发、后端技术、移动开发、数据处理与安全等领域的实践技巧，包括代码美化、加密访问、Admonitions配置和TOC设置等内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 点击查看详细内容

前面加了#，使用时去掉

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

点击查看详细内容

1+1
cd data

2.加个框

<details>
  <summary><table><tr><td bgcolor=DarkSeaGreen>点击查看详细内容</td></t></table></summary>
  
#  ```
  1+1
  cd 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 = 3
    ordered = false
    startLevel = 2

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"