【hexo】基础教程

编程入门 行业动态 更新时间:2024-10-10 02:15:18

【hexo】<a href=https://www.elefans.com/category/jswz/34/1767923.html style=基础教程"/>

【hexo】基础教程

在博客中插入视频和图片能让人通俗易懂,生动形象。下面我们简答用两种方式介绍下hexo 博客文章中新增图片

方法一:

hexo 添加图片插件:

npm install hexo-asset-image --save

也可下载官方链接地址:hexo-asset

此时的下载或不下载取决于自己的theme主题中所包含的默认的插件是否存在。可以在不安装此插件的前提下执行如下步骤。若不行,在安装此插件后执行如下步骤:

在hexo主文件夹中_config.yml配置文件中,修改为 post_asset_folder: true, 然后新建一篇文章

hexo new "test"

这个时候会出现一个test.mdtest的文件夹

将图片资源放在test中,文章就可以使用相对路径引用图片资源了。格式如下

![](image.jpg)

上述是markdown的引用方式,图片只能在文章中显示,但无法在首页中正常显示。

如果希望图片在文章和首页中同时显示,可以使用标签插件语法。

{% asset_img image.jpg This is an image %}

重新编译后 再启动服务即可。

效果可查看如下链接:=1001.2014.3001.5501

方法二:使用cdn来存储图片

使用typora编辑md文档,除了在本地存储图片,还可以将图片上传到一些免费的CDN服务中。例如在typora中配置图片上传到配置好的github图床中,会生成对应的url地址,将地址直接拿来引用即可。具体配置方案,请参考:=1001.2014.3001.5501

更多推荐

【hexo】基础教程

本文发布于:2024-02-05 16:51:01,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1745514.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:基础教程   hexo

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!