1、安装node.js
https://nodejs.org/en
2、安装hexo博客框架
hexo官网:https://hexo.io/zh-cn/docs/
1
2
3
4
5
6
7
8
| npm install hexo-cli -g
#or
cnpm install hexo-cli -g
hexo version
#or
hexo -v
|
3、开始搭建
执行以下操作：
1
2
3
4
|
hexo new "我的第一篇博客"
hexo n "我的第一篇博客"
|
4、部署到github
1) github 新建仓库
readme文件选不选都行
建完以后长这样 ↓
2) 生成ssh添加到github
目的：设置ssh免密登录
1
2
3
4
5
6
7
8
9
10
11
12
| //首先要连接github
//当前目录 右键打开git bash
config --local user.email "github的邮箱"
git config --local user.name "githuby的用户名"
//生成SSH Key
ssh-keygen -t rsa -C "github的邮箱"
然后敲3次回车
//获取SSH Key ，全部复制下来
cat ~/.ssh/id_rsa.pub
|
1
2
3
4
| 
或者找到下方路径，找到.ssh目录，
复制公钥
|
3） 部署到github
https://hexo.io/zh-cn/docs/github-pages
1
2
| //安装 hexo-deployer-git
cnpm install --save hexo-deployer-git
|
1
2
3
4
5
6
7
8
| 打开 _config.yml 文件
添加以下配置（如果配置已经存在，请将其替换为如下）:
deploy:
type: git
repo: git@github.com:whale95/whale95.github.io.git
branch: master
|
1
| 浏览 <GitHub 用户名>.github.io 检查你的网站能否运作。
|
我的博客地址：https://whale95.github.io/
参考博客：
https://blog.csdn.net/qq_54796785/article/details/126053172
https://blog.csdn.net/qq_46922488/article/details/119348718
5、博客主题安装
这里使用fluid主题
官网： https://hexo.fluid-dev.com/
1
2
3
| git 命令
//把主题clone到themes文件夹下
git clone https://github.com/fluid-dev/hexo-theme-fluid themes/fluid
|
修改 _config.yml 文件配置
1
2
3
4
| hexo c
hexo g
hexo s
hexo d
|
最后长这样 ↓
6、主题修改
0 ）覆盖配置
作用：避免在更新主题时丢失自定义的配置
1
2
3
| 在博客根目录下创建 _config.fluid.yml 文件
将主题的 _config.yml (opens new window)全部配置（或部分配置）复制过去。
以后如果修改任何主题配置，都只需修改 _config.fluid.yml 的配置即可。
|
1
2
3
| ps:
只要存在于 _config.fluid.yml 的配置都是高优先级，修改原 _config.yml 是无效的。
想查看覆盖配置有没有生效，可以通过 hexo g --debug 查看命令行输出。
|
1）左上角标题修改及浏览器网页名字修改
1
2
3
4
5
6
| 修改配置
/blog/themes/fluid/_config.yaml文件
navbar:
blog_title: 博客标题
这个配置同时控制两个地方的展示：页面左上角的博客标题+网页在浏览器标签中的标题
|
2）首页大图中的标题文字
1
2
3
4
5
6
| /blog/themes/fluid/_config.yaml文件
index:
slogan:
enable: true
text: "不要让世界左右你的情绪，也不要要情绪左右你的理智。"
|
3） 关于页面的创建
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| // 1、创建about页面
hexo new page about
//2、创建成功后修改 /source/about/index.md，添加 layout 属性。
---
title: 标题
layout: about
---
这里可以写正文，支持 Markdown, HTML
//3、可以在/blog/themes/fluid/_config.yaml文件配置头像、名字、个人介绍
about:
avatar: /img/avatar.png
name: "whale95"
intro: "不要让世界左右你的情绪，也不要要情绪左右你的理智。"
|
3）分类页面
1
2
3
4
5
6
7
8
| //在页面的md文件中设置categories
---
title: 这个博客的搭建过程
date: 2023-07-04 17:03:47
tags:
categories:
- 博客搭建
---
|
