零、写在前面
写博客的动力:在准备找实习面试的过程中写了很多md文件,里面一直都是比较零散的总结,分类和条理都不够好。最近准备一边回顾梳理一边放到博客上来,一来可以鞭策自己把技术总结写得条理更清晰一些,以及督促自己养成经常总结和温习的习惯,二来顺便记录自己在技术方面的进步过程。
一、hexo相关
用hexo+github搭建这个博客主要参考了hexo官网和网上的三篇教程:
blog1 blog2 blog3
1、更新部署
在本地启动hexo server
后,每次更新会自动更新页面;
如果像部署到github pages, 要用下面的命令:$ hexo clean
$ hexo generate
这两步分别删除和重新生成/public目录$ hexo deploy
这一步上传到github
2、修改为next主题,一系列配置
修改首页背景
背景颜色修改:在hexozxy/themes/next/source/css/_custom.style
为body
添加样式
默认背景动画的设置:在主题配置文件中设置相应动画canvas_nest
等三种动画均有true
/false
设置“阅读全文”功能
头像设置
分两种情况:都是在next主题的配置文件_config.yml
中修改avatar
配置项的url
1、如果在本地测试用:将图片放到theme/next/source/images
下,url写为 /images/zxy.jpeg
2、如果上传到github:将图片放到项目根目录/source/upload/image
下(自己创建upload目录)
侧边栏社交链接设置
在theme/next/_config.yml
中对应设置social links
和social icons
修改侧边栏中文名称:“归档”->“时间轴”
因为配置没有出现过中文,只有public/index.html和themes/languages/
下有相应中文文字,而public
目录每次部署时都会重新更新,所以应该在后者目录中文文件中修改。
添加百度统计和LeanCloud文章阅读量统计
两者类似。以百度统计为例,在百度统计相应产品中注册账号,在代码获取页面找到生成的baidu_analytics id (?
后面的编码),写进主题配置文件的baidu_analytics
.相应的统计数据在百度统计平台中查看。
嵌入网易云音乐播放
blog
待解决问题:页面跳转后播放随即停止,不能作为整个博客的背景音乐。
添加社交分享
Mob Shared SDK
参考文章:
Magicer’s Blog
添加博客评论
尝试了几种现有第三方评论插件:
- 多说停止维护
- 搜狐的畅言changyan,需要备案;
- 友言 uyan:因其不支持https,用不了
- disqus: 配置超级方便,在官网注册账号后直接把
short_name
写到主题配置文件相应位置即可,并且Disqus官网会在你账号里记录这个账号的评论内容。可以点赞推荐。最大缺点就是评论者需要登录账号才能评论,而且登录账号是Disqus, facebook, twitter,google+等。需要梯子。 - Hypercomments: 跟disqus差不多,也需要同样的方式登录后才能评论和点赞。由于disqus网站有时访问不了,所以我选用了这个。可以回复附件(image, video, presentation)。
- 网易云跟帖 gentie: 在
localhost
中显示不了,应该deploy
之后测试。需要登录,可以用weibo,网易账号等登录。
添加留言板
我用的是第一种,它就是创建一个页面用作留言板,并添加评论。
第二种方法是用类似于github issue的方法:gitment,有空可以试一下。
添加标签页(标签云)和分类页
- 标签云:
hexo new page tags
: 该命令会在/source
目录下创建/tags
目录,其中会创建一个index.md
文件,在文件头加上type: tags
。重新clean
部署即可。 - 分类:
categories
同理。
SEO设为true
后description不显示
在next主题的配置文件中添加signature: 每天进步一点点的前端程序媛
即可。