記Github博客的搭建

使用Hexo + Github

1. 准备

安装Git, node.js, npm

2. 配置GitHub

连接GitHub

(Git Bash Here)

1
2
git config --global user.name "my-name"
git config --global user.email "my-email@gmail.com"

創建SSH密鑰

1
ssh-keygen -t rsa -C "my-email@gmail.com"

Github添加密鑰

Setting -> SSH keys -> New SSH key

1
ssh -T git@github.com

創建倉庫

New repository -> my-name/my-name.github.io

3. 配置Hexo

安裝Hexo

1
npm install -g hexo-cli

初始化

1
hexo init

安裝NexT主題

1
git clone https://github.com/next-theme/hexo-theme-next themes/next

本地預覽

1
2
hexo g  # 生成頁面
hexo s # 啟動預覽

4. Hexo to GitHub

安裝hexo-deployer-git

1
npm install hexo-deployer-git --save

修改_config.yml

1
2
3
4
5
theme: next
deploy:
type: git
repository: git@github.com:shengyangzhang/shengyangzhang.github.io.git
branch: main

上傳

1
hexo d  # 上傳

5. 開始使用

添加頁面

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

在index.md加入

1
2
# type: tags
comments: false

主題配置

修改/themes/next/config.yml

1
2
3
4
5
6
7
8
9
10
11
12
scheme: Pisces
menu:
about: /about/ || about
tags: /tags/ || tags
archives: /archives/ || archive
reading_progress:
enable: true
google_site_verification: true
math:
every_page: true
mathjax:
enable: true

修改/themes/next/source/css/schemes/Pisces/index.styl

1
2
3
4
5
6
7
body {
background:url(/images/background.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
background-size: cover;
background-position:50% 50%;
}

開始寫作

1
hexo new hello-world

修改markdown文件

1
2
3
4
5
6
7
8
---
title: hello word
date: 2023-02-18 hh:mm:ss
tags:
- explore
- math
description:
---

支持Google搜索

添加到Search Console