你这是什么垃圾浏览器,这都不能显示(╯‵□′)╯︵┻━┻

【纪实】 - 智障博客搭建旅程

Author Avatar
猪蹄宝宝 7月 01, 2017
  • 在其它设备中阅读本文章
vertical_split 1.1k 字  |  timer 4 分钟

拥有一个自己的网站曾经是我的一个梦想。这个想法其实从初中的时候我就开始有了,但是呢。。。我其实不是一个执行力很强的人,于是一拖再拖,拖到了现在。。。(╯‵□′)╯︵┻━┻

蠢蠢欲动

彼时我正在研究Flyme和MIUI的patchrom(虽然没坚持下去是吧),于是我看到了这么一个网站:魅族内核团队,通过其中的关于页面,以及之后的百度谷歌,我发现GitHub提供了静态网站的托管服务,并且可以自己通过jekyll等工具对markdown文档进行编译,生成静态网页。

付诸行动

魅族内核团队提供了自己的博客源代码,于是我将其仓库直接Fork到了我自己的账户下,修改仓库名以符合GitHub Pages的要求。访问gadfly3173.github.io后就显示了和魅族内核团队一样的页面。这个时候就应该开始修改网站让他变成我自己的了。为了管理方便,我选择Visual Studio Code对博客源代码进行管理。通过其内置的强大的搜索功能,我将其中与我无关的内容都进行了删减和修改。为了在Linux环境下修改方便,我顺手学习了一下GIMP(说得好像这玩意的基础操作很难学一样。。。),最后得到了这样的效果:

看起来是还不错,但是总想做点什么,让它看起来更像是我的博客,而不是从别人那里直接生搬硬套过来的。

结合我在百度上找到的别人建站的经验,我给我的博客页面中头像显示处增加了鼠标滑过头像旋转的功能,参考了很多网上的方法。这个功能我实现了很久,后来发现实在是我的CSS语法掌握得太差而导致没有显示。。。┑( ̄Д  ̄)┍

遭遇阻力

这个时候我意识到,我需要给我的博客添加一个评论功能。作为静态页面,这是不能直接实现的,但这并不意味着没有方法。通过JavaScript技术,可以由外部服务器提供评论功能。百度一下,发现大家都在用多说,可我再一百度多说,发现多说倒闭了。。。WTF???
通过谷歌再次搜索,发现还有很多人通过Disqus来实现。于是按照教程我完成了Disqus的部署。然而在一次意外中,我发现这东西其实是被墙的,普通用户难以使用。。。坑爹。。。
于是再次搜索资料,发现大家还喜欢用一些其他的评论系统,于是一个个试过来,发现不是不能以中文显示评论插件,就是显示我的域名被占用(没错,网易云跟帖,我说的就是你)正当我垂头丧气时,我意外发现了一个开源项目叫Gitment。作者利用GitHub的Issue功能和API,制作了一个用Issue页面来实现评论功能的插件。这好像正合我意啊!

可是当我将其应用后,我发现这玩意按钮哪里不对???

经过一段时间的研究,我怀疑是我们的主题或者jekyll的问题。。。然而考虑到jekyll在win下使用不方便等原因,我决定在技师的安利下转到Hexo。

转移阵地

Hexo一开始让我有点不太习惯。虽然它比Jekyll的可维护性更强,但是文件结构更加复杂。。。不过Hexo中很多功能通过一条命令一个插件就能搞定,要比Jekyll什么都自己动手方便得多。
按照网上的教程迁移完成后,我选择了Maupassant主题,添加了百度统计代码,按照jade语法重新加入Gitment插件,用hexo-generator-feed插件解决了RSS页面的问题。踩完一堆坑后,这博客也差不多搞完啦!

后续修改

今天觉得应该搞个首行缩进的功能,结果我把.post-meta当成了文章属性,.post-content当成了目录。。。论不好好学英语的后果。。。
以及我发现text-indent:2em;只对p标签分段的文字有效,而Hexo会自动将我自己在md中打的回车转义成<br>。于是我在marked.js中将其改为</p><p>,一劳永逸2333。