Hexo发布博客引用自带图片的方法

0.472字数 417阅读 35333

mac用户推荐使用ipic,一个很牛的个人开发者开发的工具,使markdown插入图片的操作变得异常简单,链接:http://www.jianshu.com/p/e46a91ae20b9

有两种方法,第一种是不用插件的情况,第二种是使用一种hexo的插件。

无论哪种方法都有一个共同的前提:修改_config.yml配置文件post_asset_folder项为true

创建博客是使用命令创建:

hexo new [layout] <title>

其中的layout项可以省略,例如:

hexo new "这是一个新的博客"

使用完命令之后,在source/_post文件夹里面就会出现一个“这是一个新的博客.md”的文件和一个“这是一个新的博客”的文件夹。


下一步就是把需要的图片放到新创建的那个文件夹里面去。

引用图片的第一种方法

{% asset_img 这是一个新的博客的图片.jpg 这是一个新的博客的图片的说明 %}

用此种方法,而不是以前的![]()方法,前提是你的hexo的版本是hexo3以上,到package.json里面看一下吧。如果不是hexo3以上的版本,那就只能用第二种方法了。

例子

我现在写了一个段落,并且想在这个段落的某一个地方{% asset_img 这是一个新的博客的图片.jpg 这是一个新的博客的图片的说明 %}引入一张图片

错误的例子

我现在写了一个段落,并且想在这个段落的某一个地方[图片上传失败...(image-b446bd-1510018038370)]引入一张图片

下面是第二种方法,hexo插件的方法

这是插件的链接

安装

npm install hexo-asset-image --save

之后就可以按照正常的方法使用的,比如:

我现在写了一个段落,并且想在这个段落的某一个地方[图片上传失败...(image-43fc5f-1510018038370)]引入一张图片

我现在写了一个段落,并且想在这个段落的某一个地方[图片上传失败...(image-f9b1fb-1510018038370)]引入一张图片

都可以实现。

此两种方法除了操作有些区别之外,在图片的显示上也略有不同,第一种的图片信息是会显示出来的,而第二种中括号里面的信息是不会显示的。

博客:https://zhuanyongxigua.github.io

推荐阅读更多精彩内容