Hexo 图片展示

绝对路径

适合少量图片。图片放入 source/images 目录,每次 generate 会生成图片。通过类似于 ![](/images/image.jpg) 访问。

相对路径

config.yml 文件中的 post_asset_folder 选项设为 true 。 每次写新文章 hexo new [layout] <title> 就自动创建新文件夹,把图放入同命名文件夹,

图片引用:

{% asset_path slug %}
{% asset_img slug [title] %}
{% asset_link slug [title] %}

标签插件

结合 Typora 使用,将 Preferences 里的 images 设置为

可以直接复制粘贴图片到 Typora。最新版 renderer-marker 6.3.0 需要修改设置为 relative path

图片引用(Typora):

![](example_page/example.jpg)

成组展示

自动成组并排放图片,官方建议最好搭配 Fancybox 使用。

{% gp [number]-[layout]%}

{% asset_img 1.png Page Show %}

{% asset_img 2.png "[Page ]" %}

{% endgp %}

图注

目前是鼠标移上去才会显示图注,不在图片下方显示 caption。

更新 Package dependencies 更新 hexo-renderer-marked,可以看下之前的 issue

npm install hexo-renderer-marked --save

虽然 caption 显示了,但是只能用 markdown 写作,并且不能使用成组展示了。

![Uber 展示](1.png)

参考

  1. hexo 图片显示问题及使用 typora 设置图片路径

  2. 资源文件夹

  3. Group Pictures