Hexo Building
In class
fail:
刚开始时,使用的Node.js是最新版的,然后配置了系统环境,执行命令:npm install hexo -g
时,加载了很长时间,然后并没有进行到下一步。
improve:
换用Node.js的familiar版,成功解决了上述问题。
接着在任意文件夹中新建一个目录,cd命令到相应的文件夹,之后就开始启用命令行大法了。首先初始化,之后接着启动hexo server,如果在浏览器中访问localhost:4000
(这个地址是可以调控的,如果电脑中安装了福昕阅读器,则这个端口会被堵塞)成功,则说明此时hexo配置成功。然后通过修改配置文件_config.的deploy属性来将本地hexo和远程Github关联。
在修改配置文件的时候,一定要注意空格(type、repository、branch前要加空格,冒号后面也要加一个空格)
接着安装hexo-deployer-git:npm install hexo-deployer-git -S
课上就做到了这一步,下面请允许我盗一波图
版权所有@姜建林学长,感谢大力支持
After class
主题
一开始接触hexo的GUI是landscape主题,除了丑之外一无是处,然后我就毅然决然的踏上了寻找好看主题的不归路。
首先是在知乎上搜索的,看到了一系列的比较好的主题
前十名的主题我都下载下来放在theme文件夹里面然后一个个的试,最后有三个入了法眼,一个非next莫属;另一个是Haojen 的一个主题,以简洁和规则而凸显,特别是体现在首页;还有一个是Litten的博客,独有的特点是可以自主添加相册,其中标签的处理和页面利用做的比较好,还可以增加友链。
一开始我是采用Haojen的那个主题,然后出现了一些比较头疼的问题:
- 一开始根目录的_config.文件要求与theme下的对应主题的_config.文件保持一致,然后更改的时候需要更改两个,操作的复杂度增加了
- 刷新起来特别麻烦,每次在
sublime text3
中修改完后,都必须ctrl+C取消后,然后再hexo s运行一遍才能看到更新之后的效果 - 当时添加图片方面做的还不是很好,放在本地的图片并不能很好的嵌入其中
- 在网上更新的各种插件并不是很多,然后论坛中谈论的频率并不是很大, 所以我觉得这对之后维护以及更新不是很有利,可塑性很小
基于以上的四点原因,我决定放弃这个主题,虽然已经搭建了一天半的时间,但还是狠狠心给丢了。
同时我承认第二次是有用Litten的念头的,然后我在群邮件里面翻了一下,发现有蛮多的人用,觉得没有新意。所以转了一圈,又回归到了我强大的next主题,回归到了经典的Scheme–Muse(主要是紧凑型的Mist太多人用,而Pisces文章的可读性宽度太小,慵懒的我也不愿意去找对应的CSS样式进行更改)话虽如此,但是Muse的大片留白还是很充满想象空间的,有种中国水墨画的味道,而且可以降低阅读疲劳,其中的sidebar也很cute,所以最终就确定了为next主题
图片
最开始的时候,我是将图片统一存在主题下的images文件夹下,然后,我就琢磨,将文件夹上传至github的时候图片占了很大的空间,然后如果别人要参考下载的话也需要消耗下载图片的时间(命令行下载或上传的速度我就不过多描述了,用过的孩子都懂其中的痛)
就在我快要放弃,使用360云的时候,万能的知乎给了我答案,那就是七牛云,注册后就有1个G的免费空间,可以产生外链,将外链代替原本的本地地址可以有效地解决这个问题。(其中在设置七牛云的时候,不要调成Private,这样产生不了外链)
有一段时间,我沉迷于把单色调的background换成图片形式,但一直没有成功。今天翻看别人的博客的时候,发现了徐运放同学的博客已经换了背景图片,然后私下里交流了一下,发现用的方法是一样的,就是下图:
解决方法,将其中的本地链接换成了网络外链,完美解决,然后高兴地太早了,出现了这种情况:
背景图片随着页面滚动,不是固定的状态,然后找了一下CSS样式里面的background-position,调成fixed的状态,然后期待奇迹发生的我并没有看到什么改观。。 希望知道如何调节的小伙伴在下方的讨论区给我留言,thanks a lot
评论框
关于评论框,我是选择了多说这个神奇的平台,推荐还没有设立评论区的同学可以去尝试一下,只需要简单的几步就可以达到目的
音乐栏
三板斧可以搞定:
Tips
- 如果首页几篇文章展开起来放,会显得特别乱,没有条理,加一个
<!--more-->
可以很好地解决这个问题 - 如果标签、关于、分类页面没有搭建起来的话,建议去除首页中相应的标签,以免看到很粗糙的部分
- 期间因为_config.混乱过一次,经历过一次重装,建议在改动之前做好相应备份
- 推荐几个网站:
To the future
- 添加搜索框功能
- 添加打赏功能以及附带的一些操作
- 通透理解next主题,在接下来的网页知识后,自己修改CSS样式以及排版
- 将背景图片自然而不突兀的添加上去,并实现固定
- 将剩余的几个页面很好的搭建起来,并及时维护,添加一些好玩的插件
我是华丽的分割线
- time:170501
今天碰到一些问题,想写一些博客,然后就把hexo重新扒出来了,然后发现有些东西已然忘记,经过一个下午的search行动,终于弄得差不多了,在最后,hexo deploy
这一步,本应该无波无澜的,结果被自己坑到了,在重新更改配置文件的时候,把deploy属性的最后后缀改成了github
,导致尝试用万金油方法终不得成效。
万金油方法如下:npm install hexo-deployer-git -save
然后再进行hexo deploy