搭建我的Hexo博客

发表于 | 分类于

一直有计划搭建我自己的博客，使用了Hexo进行实现。

后面在进行选择的时候，考虑了下面几种。

  • WordPress

    这是一种PHP框架，适合快速建站，对编程的要求较低，适合帮别人搭建网站，但是不容易定制，PHP语言较老。

  • Django和flask

    Python的web框架，功能齐全，但是学习的时间较长

  • Hexo

    hexo很有极客范，网上教程很多，搭建简单，只能搭建静态博客，没有后台。

PHP语言我不感兴趣，Django和flask近期也没有时间学。Hexo搭建简单，能够让我专注在博客撰写的本身，而且不需要购买域名，果断选择Hexo。我是在树莓派上进行搭建Hexo的环境搭建的。本篇博客大概分为四个部分：

  1. 树莓派环境搭建
  2. Hexo环境搭建
  3. Hexo主题配置
  4. 部署至github

安装树莓派系统

树莓派是一块小型的电脑主板，非常适合用于linux环境学习和开发。

a. 系统镜像下载地址!

https://www.raspberrypi.org/downloads/raspbian

b. 使用win32diskimager将系统烧写至内存卡

c. 在目录新建一个ssh的文件夹，允许进行ssh连接

Hexo基础环境配置

将内存卡插入树莓派上电就是一个linux 环境

安装git

1
sudo apt-get install git-core

安装nvm，安装完成后需要reboot设备

1
2
wget -qO- https://raw.github.com/creationix/nvm/master/install.sh | sh
reboot

安装npm

1
nvm install stable

安装Hexo

1
npm install -g hexo-cli

至此 Hexo环境便搭好了，试用一下

1
2
3
4
hexo init BlogTest
cd BlogTest
hexo g
hexo s

此时在浏览器中输入树莓派IP加默认端口地址( http://192.168.1.4:4000 )，便能够访问生成的博客

博客主题配置

Hexo有很多主题，Next是非常流行的一个

安装Next

1
2
cd your-hexo-site
git clone https://github.com/iissnan/hexo-theme-next themes/next

各种配置其实都基本是修改这两个文件

  • 主目录下的站点配置文件 /_config.yml文件

  • 主题目录下的主题配置文件 /themes/next/_config.yml文件

下面介绍以下的配置

  • 配置站点主题

    修改站点配置文件

    1
    theme: next

  • 配置主题语言

    修改站点配置文件

    1
    language: zh-Hans

  • 配置主题风格

    修改主题配置文件

    1
    2
    3
    #scheme: Muse
    #scheme: Mist
    scheme: Pisces

  • 配置子页面

    Next提供以下类别的页面

    1
    2
    3
    4
    5
    6
    7
    8
    9
    menu:
      home: 首页
      archives: 归档
      categories: 分类
      tags: 标签
      about: 关于
      search: 搜索
      commonweal: 公益404
      something: 有料

    我选择启用
    home, archives, tags, categories, about, search 这六种页面。

    1
    2
    3
    hexo new page tags
    hexo new page about
    hexo new page categories

    页面内容还需要后续添加完善

  • 配置主题搜索功能

    添加本地自定义站点内容搜索(Local search)

    首先安装 hexo-generator-searchdb，在站点的根目录下执行以下命令：

    1
    npm install hexo-generator-searchdb --save

    编辑站点配置文件，新增以下内容置：

    1
    2
    3
    4
    5
    search:
    path: search.xml
       field: post
       format: html
       limit: 10000

    编辑主题配置文件，启用本地搜索功能：


    1
    2
    3
    Local search
    local_search:
    enable: true

还有其他的一些配置，可以访问官方文档进行查看

博客部署至GitHub

  1. 配置本地git的用户名和邮箱

    1
    2
    git config --global user.name “stshihia”
    git config --global user.email “379187038@qq.com”

    查看配置是否成功

    1
    2
    git config user.name
    git config user.email

  2. 生成本地rsa密钥用于与github网站相连接

    1
    2
    3
    ssh-keygen -t rsa -C '379187038@qq.com'
    vim /home/pi/.ssh/id_rsa.pub
    ssh -T git@github.com

    可以查看其内容并贴到自己的github 密钥上, 通过ssh验证是否成功连接

  3. 修改站点配置文件
    1
    2
    3
    4
    deploy:
      type: git
      repo: git@github.com:stshihia/stshihia.github.io.git
      branch: master

输入

1
2
hexo generate
hexo deploy

  1. Github账户注册和新建项目，项目必须要遵守格式：账户名.github.io
    至此，访问博客地址 https://stshihia.github.io/ 即可

总结

一些个人的经验总结：

  1. 熟悉了Hexo框架，前端的世界还挺好玩的。
  2. bilibili上能找到不错的资源
  3. 先找博客了解大概，然后通过视频进行学习操作细节，再通过博客来查漏补缺，最后官方文档可以进行查询。

参考

https://www.cnblogs.com/fengxiongZz/p/7707219.html

http://theme-next.iissnan.com/

https://www.bilibili.com/video/av17653359?from=search&seid=11432917052424913522