githubpages搭建博客及页面跳转

Posted on Edited on Disqus:

创建 githubpages

1. 创建仓库

先在github网页上面创建仓库，名称是个人用户名 + “.github.io“，例如 quzhanghao.github.io。

2. 安装 git

本地安装 git，并在本地使用 git clone 下载创建的仓库。

3. 安装 Node.js

本地安装 Node.js，可以通过命令行检查是否安装成功：

1
node -v

4. 安装 Hexo：

使用 npm 安装 Hexo：

1
npm install -g hexo-cli

5. 初始化博客

在下载的 git 仓库目录中初始化博客内容：(将 my-blog 替换为实际的博客名称)

1
2
3
4
hexo init my-blog
cd my-blog
npm install
npm install hexo-deployer-git --save

6. 配置博客

可以通过编辑博客配置文件 _config.yml，设置博客的基本信息，包括标题、描述、作者等。
在 _config.yml 文件中，添加 GitHub Pages 的部署信息：

1
2
3
4
deploy:
  type: git
  repo: https://github.com/yourusername/your-repo.git
  branch: gh-pages

其中 yourusername 和 your-repo 替换为实际的 GitHub 用户名和仓库名称。

创建和发布文章

1. 创建新文章

使用以下命令创建新文章：

1
hexo new "文章标题"

2. 生成静态文件

运行以下命令以生成静态文件：

1
hexo generate

3. 部署到 GitHub Pages

运行部署命令将生成的静态文件推送到 GitHub Pages：

1
hexo deploy

githubpages 跳转外部网站

如果需要访问 githubpages 时自动跳转到外部的网站，可以修改 hexo 的配置，并更新发布。
来到博客的源码文件夹，修改的相对文件路径：

1
.\xxx.github.io\node_modules\hexo-theme-landscape\layout\_partial\head.ejs

只需要在 <head> 标签内部增加一行即可：（把域名修改为需要跳转的域名）

1
<meta http-equiv="refresh" content="0; url=https://quzhanghao.me">

修改完之后，通过下面的代码生成博客并发布：

1
2
hexo generate
hexo deploy