hexo+github pages搭建个人博客(一)

由于希望通过配置个人博客逐步学习,之前有搭建过好几个,都因为长时间荒废,学习和记录目的都没有达到,这里重头开始记录。一是警醒自己,二是作为记录以便查阅。

主要步骤:

1.github个人代码仓库配置
git配置设置user.name和user.email配置信息

git config --global user.name "github用户名"
git config --global user.email "github注册邮箱"

生成ssh秘钥文件

ssh-keygen -t rsa -C "github注册邮箱"

这里直接三个回车,默认不设置密码,找到C盘user目录下rescue下的.ssh文件夹中id_rsa.pub秘钥,复制内容,到github_setting_keys页面,新建new ssh key

title任意,内容复制到key中。点击add ssh key。在git bash中可以检测github公钥设置是否成功。输入

ssh [email protected]

显示如下信息则成功

$ ssh [email protected]
PTY allocation request failed on channel 0
Hi lonely-island! You've successfully authenticated, but GitHub does not provide shell access.
Connection to github.com closed.

这里之所以设置GitHub密钥原因是,通过非对称加密的公钥与私钥来完成加密,公钥放置在GitHub上,私钥放置在自己的电脑里。GitHub要求每次推送代码都是合法用户,所以每次推送都需要输入账号密码验证推送用户是否是合法用户,为了省去每次输入密码的步骤,采用了ssh,当你推送的时候,git就会匹配你的私钥跟GitHub上面的公钥是否是配对的,若是匹配就认为你是合法用户,则允许推送。这样可以保证每次的推送都是正确合法的。

2.安装node

输入node -v检查node安装情况

3.安装hexo

在一个固定文件夹中执行以下命令

#使用npm命令安装hexo
npm install -g hexo-cli
#完成后,初始化博客
hexo init blog
#以上命令执行的目录都是刚才指定文件夹里, 为了预览,可以使用这三条命令
hexo new test_my_site #新建一篇博客文章
hexo g #生成网页
hexo s #在本地预览
#打开localhost:4000查看
#常用的hexo命令
npm install hexo -g #安装hexo
npm update hexo -g #升级hexo
hexo init #初始化博客

3.推送网站
_config.yml文件配置

  • blog根目录下有一个为站点配置文件
  • themes目录下有一个为主题配置文件
    在站点配置文件后修改为
deploy:
type: git
repo: 这里填入你之前在GitHub上创建仓库的完整路径,记得加上 .git
branch: master参考如下:

这一步是为了给hexo d这个命令做配置,让hexo知道blog配置在哪里,这里是放在github的仓库中,最后安装git部署插件,命令:

npm install hexo-deployer-git --save

再输入三条命令

hexo clean
hexo g
hexo d

第三条就是部署网站deploy的命令,完成后打开浏览器,用户名.github.io即可访问

之后写文章只需要

hexo new "文章标题"

然后在~\blog\source_posts下找到新生成的md文件进行编辑即可,文档开头的属性可以自由设置
比如一个例子

---
title: hexo新建文章
copyright: true
permalink: 1
top: 0
date: 2020-01-30 18:52:01
tags:
- hexo
- 博客
categories: web
password:
---

部署之前可以本地预览一下

hexo clean && hexo g && hexo s

在localhost:4000可以查看,最后确定无误使用:

hexo d

可以部署到github pages上访问

一个小配置
想要在首页只显示文章缩略,可以在主题配置文件(themes目录下的_config.yml)修改,找到auto_excerpt

# Automatically Excerpt. Not recommend.
# Please use <!-- more --> in the post to control excerpt accurately.
auto_excerpt:
  enable: true #是否启用自动摘要,截取50字
  length: 50

选择enable,则会是下面这种效果,length指定只显示从头起多少字符。或者可以使用 放到文章中你要截取的位置。
缩略图

猜你喜欢

转载自www.cnblogs.com/lonelyisland/p/12243519.html