Github 搭建 hexo (四)
在github page 上显示hexo生成的静态博客,因为github支持的是静态博客,所以本章就在前两章的基础上,在github上显示hexo 搭建的博客。
声明:
- hexo 默认支持disqus,所以修改起来比较简单。
(一)更换主题
本次使用的主题是一个白色风格的简洁主题,进入这个主题后就会发现其使用方法。
进入hexo 安装目录,也就是初始化的目录(hexo init githexo)中的githexo目录,详细目录请根据自己定义的目录名字为主,
- 进入该目录后,输入下面的命令:
git clone https://github.com/tufu9441/maupassant-hexo.git themes/maupassant
- 接下来一定要输入下面的命令,来安装这个主题的依赖环境。
npm install hexo-renderer-sass --save
npm install hexo-renderer-jade --save
- 然后就会在themes目录下多出来个主题文件夹 maupassant:
- 然后在根目录修改根目录中的 _config.yml 如下,将theme后面的文件名修改为maupassant,具体名字还得看自己想设置什么主题了
然后输入hexo s
或者 hexo server
就可以查看更换后的主题效果了,这里就不贴图展示了。
(二)添加disqus 评论系统
- 可以用到的评论系统有挺多的,多说,disqus等,这里只mark下disqus,
- disqus 的添加跟主题有关,因为hexo自带disqus,所以添加起来非常简单,这里讲下默认的主题landscape 和 上面演示的主题maupassant
Step 1:
- 进入disqus官网, 点击蓝色框中链接,给自己的网站添加disqus,
Step 2:
- 点击后,出现下图,输入网站名字。然后在第二个输入框填写自己的唯一disqus识别名称,这个名称会在后面用到,比如我这里填写的是我最常用的absea。然后点击Next按钮
Step 3:
- 上面点击Next后就会出现下面页面,这里面会有disqus在不同博客系统上或者其他系统上对应的代码。因为hexo自带支持disqus,所以不需要这里面的代码,这个页面的内容会在其他除hexo之外的博客系统中用到,如果是hexo搭建博客disqus,可以跳过。
Step 4:
- 然后在主题的配置文件,主题的配置文件,主题的配置文件,重要的说三遍,在主题的配置文件_config.yml的disqus后面添加step 2中使用的唯一的disqus识别名字。这里我使用的是absea,
注意这里absea后面和##注释必须隔开一个空格,因为.jade文件是代码风格严格的。如果没有这个空格,那就没有disqus效果。
Step 5:
然后输入 hexo s
或者hexo server
就会出现disqus的效果:
如果是默认的主题landscape,只需要在hexo主配置文件,hexo主配置文件,hexo主配置文件,说三遍,在hexo主配置文件里面添加下面白色框中的内容就可以了,
(三)添加RSS 订阅
- 添加RSS 订阅很简单,已经有成熟的依赖模块可以使用,在hexo init即初始化目录输入下面的命令即可,
npm install hexo-generator-feed
- 然后在主题的配置文件里面如下图白色框里面修改:
- 然后输入
hexo clean
(即清理临时数据库),然后输入hexo s
就可以进入页面后,点解RSS就可以看到下面的效果了。
RSS还有个关键的一步:
在主配置文件里面的URL一定要更改,不然RSS订阅不会成功,见下图白色框框中,这里填写自己网站地址即可:
然后提交到github上后,点击rss 订阅就会成功。就是下图这样的效果,不会提交可以参见本博客系列的其他mark记录。