首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

利用Hexo在GitHub上搭建个人博客

最近一个月我利用工作之余零零散散的时间,通过Hexo在GitHub上搭建了我的个人主页,把之前发布的日志和博客也都迁移了过来,并且购买了自己的域名,也在Huno主题的基础上进行了一些个性化的修改。今天网站的框架已经初步完成。趁此机会系统地总结一下搭建博客的详细步骤。

一、在GitHub上建立博客源码仓库

首先,在GitHub上建立一个空仓库用来存放博客源码,仓库命名方式必须为“GitHub账户名.github.io”。

同时,安装GitHub客户端到本地。安装本地后打开客户端,登录账号。

二、安装Hexo

Hexo是一个快速简洁且高效的博客框架。在使用Hexo之前需要安装Node.js以及其npm管理模块。

安装Node.js完毕后,打开GitHub客户端中的Git Shell,输入:

Hexo安装完毕后先建立一个存储博客的文件夹,再进入文件夹路径,输入命令:

输入完毕后hexo项目即初始化成功。然后进入博客仓库目录,输入以下命令安装依赖模块:

安装完毕后输入以下命令即可以运行Hexo服务端,在浏览器输入http://127.0.0.1:4000即可以看见初始状态的博客页面。

三、安装Hexo主题

初始主题个人觉得不是很美观。试用了几个主题后我还是决定使用Huno主题。

安装Huno主题首先需要打开Git Shell,在博客仓库目录执行以下命令,从而将主题下载到博客仓库中的theme/huno目录:

主题下载完毕后打开博客根目录的配置文件_config.yml,修改theme为theme: huno,应用新主题。输入huno s指令重启服务端后即可生效。

四、提交仓库至GitHub

打开根目录配置文件_config.yml,将deploy改为如下所示:

其中repository项的值为之前建立的博客源码仓库地址,可从下图所示位置获取。

配置部署完毕后修改url值配置统一资源定位符。

全部配置完毕后执行以下命令:

再执行以下命令生成静态站点并发布,即可在互联网上打开新建的博客了。

五、发布博文

在博客仓库执行以下命令即可以自动在source/_posts目录下生成对应的markdown文件。

初始markdown文件内结构如下:

其中title项为文章的标题;date项为文章建立日期,可以自定义;tags项为文章标签,可设置为多个,多个标签通过键入回车键分隔;categories项为分类,只能设置一个。正文需在最后键入回车键后编写。

若需生成在首页博文列表可见的摘要信息,则在文章适当位置处键入:

之前的内容即可展示在首页博文目录中。

文章编写完毕后执行以下命令即可提交至服务器。

同时,在编写过程中可以执行以下命令在本地服务器查看实时效果。

六、自定义域名

原本的域名是GitHub分配的域名,个性化不足。因此我决定注册一个自己的域名。注册完自己的域名后需要将新域名与博客绑定。打开博客仓库目录中public目录,新建“CNAME”文件,在该文件中写入注册的新域名。

然后解析新域名,向域名的DNS配置中添加以下两条记录:

其中记录类型为CNAME,记录值即为GitHub分配的博客原域名,主机记录分别为“@”和“www”,其余项默认即可。

配置完毕后打开Git Shell执行发布命令,稍等几分钟后即可使用新域名进入博客主页。之后若执行“hexo clean”需备份CNAME文件。

2017 Ka Tou (Sawatari Hiroji) All Right Reserved

  • 发表于:
  • 原文链接http://kuaibao.qq.com/s/20180122G00KDF00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券