Hexo Next如何在文章摘要展示图片

由于之前的文章一直没有配图,并且在文章摘要中出现代码会出现乱码字符现象,于是乎想要给每篇文章配图,避免这种现象,同时配上图的摘要感觉很好看

在文章的属性列表中添加photos属性

编写的文章属性中photos默认为文章的配图,这是我目前最喜欢的配图方式,但是有一个缺点,它不能自定义裁剪和缩略比,展示的是原图,这相当于如果你的每张配图大小比例不一致将会很影响美观性,目前没有很好的解决方案,所以只好自己裁剪好再引入。
如这篇文章:

1
2
3
4
5
6
7
8
---
title: Hexo Next如何在文章摘要展示图片
date: 2018-07-18 17:43:44
tags: Hexo
categories: Hexo
photos:
- "https://faithlove.github.io/pic/2018/HexoThumb/topPicPre.png"
---

在你的正文中使用<!-- more -->进行截断

由于markdown是支持原生html的,所以我们可以在正文引用img来为我们的文章设置摘要配图,在<!-- more -->之前的内容都会展示到摘要中(同时与你主题文件中配置的摘要字数有关).
如:

1
2
3
4
5
6
7
8
9
---
title: Hexo Next如何在文章摘要展示图片
date: 2018-07-18 17:43:44
tags: Hexo
categories: Hexo
---
<img src="https://faithlove.github.io/pic/2018/RMTP_1/topPicPre.png" width=50% />
哇,漂亮的小姐姐(❤ ω ❤)
<!--more-->

参考:

  1. https://segmentfault.com/q/1010000004840061
博主 wechat
冰糖可乐柠檬茶,可爱的女士喝点啥?喝点啥?
喜欢的话就给予一点支持吧(*/ω\*)