基于Hexo&GitHub从零搭建我的博客

如今愈来愈多的人喜欢利用Github搭建静态网站,缘由不外乎简单省钱。本人也利用hexo+github搭建了本博客,用于分享一些心得。在此过程当中,折腾博客的各类配置以及功能占具了我一部分时间,在此详细记录下我是如何利用hexo+github搭建静态博客以及一些配置相关问题,以避免事后遗忘,且当备份之用。 css

准备工做

本地搭建hexo静态博客

  • 新建一个文件夹,如blog
  • 进入该文件夹内,右击运行git,输入:hexo init(生成hexo模板)
  • 生成完模板,运行npm install(目前貌似不用运行这一步)
  • 最后运行:hexo s (运行程序,访问本地localhost:4000能够看到博客已经搭建成功)

目录介绍

├── _config.yml						// 博客配置文件
├── public								// 静态文件存放目录
│   ├── 2019
│   ├── archives
│   ├── css
│   ├── images
│   ├── index.html
│   ├── js
│   └── lib
├── source								
│   └── _posts						// 博文存放路径
└── themes								// 主题路径
    ├── landscape
    └── next
复制代码

将博客与Github关联

  • 在Github上建立名字为XXX.github.io的项目,XXX为本身的GitHub用户名。
  • 打开本地的MyBlog文件夹项目内的_config.yml配置文件,将其中的type设置为git
deploy:
 type: git
 repository: https://github.com/XXX/XXX.github.io.git
 branch: master
复制代码
  • 运行:npm install hexo-deployer-git –save
  • 运行:hexo g(本地生成静态文件)
  • 运行:hexo d(将本地静态文件推送至Github)

此时打开 XXX.github.io ,便可看到效果html

这里注意把文中的 XXX 修改成本身的github用户名node

### 更新文章
  • blog目录下执行:hexo new “个人第一篇文章”,会在source->_posts文件夹内生成一个.md文件。
  • 编辑该文件(遵循Markdown规则)
  • 修改起始字段
    • title 文章的标题
    • date 建立日期 (文件的建立日期 )
    • updated 修改日期 ( 文件的修改日期)
    • comments 是否开启评论 true
    • tags 标签
    • categories 分类
    • permalink url中的名字(文件名)
  • 编写正文内容(MakeDown)
  • hexo clean 删除本地静态文件(public目录)
  • hexo g 生成本地静态文件(public目录)
  • hexo deploy 将本地静态文件推送至github(hexo d)

修改主题

至此,咱们的博客就已经搭建完了,发现两个问题,一是丑,二是使用GitHub默认域名不舒服。因此咱们要修改一个好看的主题(默认的主题通过一番DIY也能达到不错的效果,这里就很少作演示)和使用本身的域名(可选),非必须,看我的喜爱。git

目前安装的主题:Nextgithub

更多主题:主题npm

主题配置文档:Next主题配置浏览器

一、在博客的根目录下,也就是上文提到的blog文件夹中,执行clone主题

$ git clone https://github.com/theme-next/hexo-theme-next themes/next
复制代码

二、修改hexo配置文件

使用文本编辑器打开blog目录下的_config.yml文件,将 themes 对应的值进行修改,以下:bash

theme: next
复制代码

三、从新生成静态文件

$ hexo clean

$ hexo g

$ hexo s
复制代码

浏览器打开 http://localhost:4000 便可看到效果。确认没问题执行 hexo d 命令更新到GitHub,稍等片刻从新打开 XXX.github.io 即可看到效果;hexo

绑定域名

  • 域名提供商设置编辑器

    添加一条CNAME记录:

    CNAME —> XXX.github.io

  • 博客添加CNAME文件

    配置完域名解析后,进入博客目录,在source目录下新建CNAME文件,写入域名,如:jacian.com

  • 运行:hexo g

  • 运行:hexo d

从新发布完,稍等片刻打开本身的域名便可看到效果。至此你的我的博客就已经搭建完毕了;固然,你还能够作一些DIY的设置,在这篇文章中就不一一列举了,能够参考文档或者其余大神的博客去进行一些自定义的设置。

相关文章
相关标签/搜索