个人博客搭建hexo+github(5):Hexo写作实用技巧

文章名字

Hexo的文章放在hexo/source/_post文件夹,命令为post_name.md,post_name用英文的话,那么在生成html文件名就是英文名,
如果是中文,生成的html名字是unicode形式,浏览器地址栏完全不可读。


插入图片

Markdown语法

1
![Alt text](/path/to/image.png)

这里的图片路径怎么理解:
如果是本地地址,上传到github如何显示?
如果是网络地址(专业名字叫图床),不上网时本地也无法显示?
在hexo2中标签插件用法参见asset_folder
在hexo3中,配置文件中设置

1
post_asset_folder: true

当生效后,在你创建文章的时候,Hexo会创建一个同名目录,你可以将该文章关联的资源全部放到该目录下。这样就可以更加方便的使用它们了。

1
2
3
{% asset_path slug %}
{% asset_img slug [title] %}
{% asset_link slug [title] %}

Usage:
Suppose you have the following folder structure:

1
2
3
4
5
6
source\
_posts\
2014-08-15-a-simple-self-introduction.md
2014-08-15-a-simple-self-introduction\
my_portrait.jpg
my_resume.pdf

In the markdown file 2014-08-15-a-simple-self-introduction.md, you can reference files as

1
2
{% asset_img my_portrait.jpg %}
{% asset_link my_resume.pdf My Resume %}

It generates

1
2
<img src="/2014/08/15/a-simple-self-introduction/my_portrait.jpg">
<a href="/2014/08/15/a-simple-self-introduction/my_resume.pdf">My Resume</a>


显示摘要

在md文件的前置声明中,不要设置description,否则description的内容就是文章摘要。
在文章中插入

1
<!--more-->

more之前的内容会作为摘要显示,more之后的内容,需要点击阅读全文>>查看。

插入音乐

以下的例子都是从主流音乐网站直接生成链接,不需要自己制作外链,所以有些音乐因为版权问题是不支持生成外链的。

网易云音乐

搜索歌曲,找到生成外链播放器,复制生成的代码粘贴到md文件即可。
music_163.png
auto设置成0,否则会自动播放。

1
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="http://music.163.com/outchain/player?type=2&id=34341360&auto=0&height=66"></iframe>

虾米音乐

找到歌曲,找到转帖到其他网站,复制生成的代码粘贴到md文件即可。
xiami_music.png

1
<embed src="http://www.xiami.com/widget/0_148131/singlePlayer.swf" type="application/x-shockwave-flash" width="257" height="33" wmode="transparent"></embed>

插入视频

在视频网站,找到分享,复制通用代码即可。
allowfullscreen设置是否允许全屏。

1
<iframe height=498 width=510 src="http://player.youku.com/embed/XMTM4MTY5MDIzMg==" frameborder=0 allowfullscreen></iframe>


试了一下爱奇艺,不支持取消自动播放。

Reference:

  1. asset用法
  2. 插入music video