# 首页置顶文章

在文章的 Front Matter 设置 sticky: true ，则该文章将显示在首页最上方的 置顶文章 列。
多篇文章置顶，按发布顺序排列，不分页。

---

title: 置顶文章

sticky: true

---

# 首页精选分类

设置后，首页显示分类，且卡片具有反转效果

1. 首先，修改站点配置，在 <root>/_config.yml 找到 category_map , 配置每个分类对应的英文映射，比如：

category_map: # edit for Theme.shoka

  前端: fornt-end

  Hexo搭建个人博客: hexo

  shoka主题: shoka

tag_map:

2. 在 <root>/source/_post 文件夹对应的目录中，存在对应的封面图，命名为 cover,jpg ，并且处于该分类下的文章，书写时需要在 Front Matter 设置：

---

title: 基本配置

date: 2022/07/29 20:42:45

categories:

  - [hexo, shoka]

---

3. 为了方便文章管理，文类下的所有 md 文件放入一个目录下，比如： <root>/source/_post/hexo/shoka 目录下，且在站点配置文件中，设置永久链接

permalink: :title/

hexo g 后，文章的 html 文件将全部生成到 <root>/public/hexo/shoka 目录中

# 文章的封面图

• 如果在文章的 Front Matter 设置了 cover: image path ，则封装会显示这张图片。

title: Images
cover: assets/wallpaper-2572384.jpg
# 或者写成
cover: http://placehold.it/350x150.jpg
---

这里 cover 的值可以是位于 source 目录里的图片文件，此处是 <root>/source/assets/wallpaper-2572384.jpg 文件，也可以是一个某网址。

• 如果文章是一个 gallery post ，即 Front Matter 设置了 photos ，则会封面会显示设置的第一张图片。

title: Gallery Post

photos:

  - assets/wallpaper-2572384.jpg

  - assets/wallpaper-2311325.jpg

  - assets/wallpaper-878514.jpg

  - http://placehold.it/350x150.jpg

---

此时默认会显示第一个图片，即位于 <root>/source/assets/ 目录里的 wallpaper-2572384.jpg 。

• 如果以上设置均不存在，将显示一张随机图片

# 图片展示

在文章的 Front Matter 设置 fancybox: false ，可以关闭文章页的图片展示功能。

1. 图片下方显示 title

![这里是 alt](https://tva3.sinaimg.cn/large/6833939bly1gicis081o9j20zk0m8dmr.jpg "这里是 title")

2. 设置图片的大小

![](https://tva3.sinaimg.cn/large/6833939bly1gicis081o9j20zk0m8dmr.jpg "定义图片大小 - 固定宽度和高度"){height="100px" width="400px"}

# 自定义页面配色

主题配色全部在 <root>/themes/shoka/source/css/_colors.styl 文件中，可以自行查看。

在 <root>/source/_data/ 目录新建文件 colors.styl ，在此文件中添改样式。

自定义 colors.styl 文件将覆盖主题默认样式，为了避免出错，请保证原有样式名均存在，在原有样式基础上进行增删改。

主题支持在 <root>/source/_data/ 目录建立三个自定义 styl 文件：

# 自定义主题图片

如果想要修改主题的 <root>/themes/shoka/source/images/ 目录内的某张图片，请在 <root>/source/_data/ 目录新建目录 images ，并在这个文件夹中添加同名文件，部署时将自动覆盖主题内的默认图片。

可以用此方法自定义头像、打赏二维码等图片，并且避免覆盖更新主题时遗失自定义文件。