Android背锅侠

使用Hexo创建和管理Github Pages

Veröffentlicht am

在Github上创建Github Pages

  • Github上面新建仓库：<username>.github.io，必须以这个格式命名。
  • 此时，你的GitHub个人站点其实已经建成了，没错，就这么简单。。

    如果这时候push一个index.html到站点根目录，就可以通过 https://<username>.github.io 访问你的个人主页了。
    但是一般不这么做，因为这样的站点太丑陋，也不想花时间完全自己去写一个博客网站。
    所以我们需要Hexo帮我们自动建站，请继续往下看。。

安装Hexo

  • 首先你电脑上需要先安装好NodeJS环境，自行百度。

  • 安装Hexo

    npm install hexo-cli -g
    #npm install hexo --save
    #如果命令无法运行，可以尝试更换taobao的npm源
    npm install -g cnpm --registry=https://registry.npm.taobao.org

  • 初始化Hexo配置

    #1. 创建一个Hexo站点目录，如 /blog/hexo，并cd到该目录。
    #2. 初始化Hexo
       $ hexo init
       $ npm install
    #3. 本地生成站点，查看效果
       $ hexo generate
       $ hexo server
       ## 简化命令 ##
       $ hexo g
       $ hexo s  
       ## 浏览器中输入localhost:4000，查看效果

部署Hexo站点到Github Pages上

  • 配置SSH秘钥

    1. cd 到 ~/.ssh

    2. 如果目录不存在，需要新建

      $ ssh-keygen -t rsa -C "your_email@example.com"
      #这将按照你提供的邮箱地址，创建一对密钥
      Generating public/private rsa key pair.
      Enter file in which to save the key (/c/Users/you/.ssh/id_rsa): [Press enter]
      #直接回车，之后提示输入密码和确认密码，也是直接回车两次。
      #此时屏幕输出：
      Your identification has been saved in /c/Users/you/.ssh/id_rsa.
      Your public key has been saved in /c/Users/you/.ssh/id_rsa.pub.
      The key fingerprint is:
      01:0f:f4:3b:ca:85:d6:17:a1:7d:f0:68:9d:f0:a2:db your_email@example.com

    3. 在GitHub账户中添加你的公钥

      $ clip < ~/.ssh/id_rsa.pub
      或者手动复制id_rsa.pub文件内容。
      登录GitHub，到个人->设置->SSH keys中粘贴刚才的公钥，title随便。
      点击 [Add SSH key]

    4. 测试SSH秘钥是否添加成功

       $ ssh -T git@github.com
       如果是下面的反馈：
      The authenticity of host 'github.com (207.97.227.239)' can't be established.
      RSA key fingerprint is 16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48.
      Are you sure you want to continue connecting (yes/no)?
      不要紧张，输入yes就好，然后会看到：
      Hi cnfeat! You've successfully authenticated, but GitHub does not provide shell access.

    5. 设置用户信息

      $ git config --global user.name "cnfeat" //用户名（将出现在git提交记录中）
      $ git config --global user.email  "cnfeat@gmail.com" //自己的邮箱

  • 修改Hexo的部署路径，使其与github关联

    1. 修改Hexo根目录下的_config.yml文件，添加deploy字段

      # Deployment
      ## Docs: https://hexo.io/docs/deployment.html
      deploy:
        type: git
        repository: https://github.com/bbssyyuui/bbssyyuui.github.io.git
        branch: master

    2. 生成并部署站点

      $ hexo clean // 当出现一些奇怪错误的时候，可以尝试清空
      $ hexo generate
      $ hexo deploy
      ## 简化命令 ##
      $ hexo g
      $ hexo d
      ## 更简化命令 ##
      $ hexo g -d

    3. 查看站点
      浏览器输入你的个人站点网址：https://bbssyyuui.github.io.git
      OK，大功告成！！！

安装Hexo的Markdown编辑插件 hexo-hey

hexo-hey这个插件是集成在Hexo站点中的，可以方便的在线后台编辑、管理和发布你的文章。

  • 安装hexo-hey

    $ npm install hexo-hey --save

  • 修改Hexo根目录下的_config.yml文件，添加admin字段

    # Admin
    admin:
        name: hexo
        password: hey
        secret: hey hexo
        expire: 60*1
        # cors: http://localhost:3000

  • 重新生成和预览站点

    $ hexo g
    $ hexo s
    # 通过访问 http://localhost:4000/admin 后台页面查看和管理

  • 重新生成和部署站点

    $ hexo g -d

更换Hexo主题

默认生成的Hexo站点是比较丑陋的，Hexo官网提供了很多主题供你使用。
这里推荐个不错的主题 hexo-theme-next

  • 下载主题

    $ cd hexo/themes
    $ git clone https://github.com/iissnan/hexo-theme-next.git

  • 修改主题配置

    # 设置主题
# 修改Hexo根目录下的_config.yml文件中的theme字段
theme: hexo-theme-next
# 配置主题
# 修改themes/hexo-theme-next/目录下的_config.yml，使其符合你的喜好。
scheme: Pisces
...


参考：
https://hexo.io/zh-cn/docs/
https://my.oschina.net/ryaneLee/blog/638440
https://github.com/nihgwu/hexo-hey