Ivy Labs

Appearance

前言 ​

以前总是想拥有一个自己的 Blog，可惜没太多的时间研究，今天，Ta 来啦~

初步了解 ​

先浅浅了解下什么是 Hexo 和 Github 吧

  • Hexo

Hexo是一个快速、简洁且高效的博客框架，支持 Markdown，可使上百个页面在几秒内瞬间完成渲染，部署方便，可玩性较高。

  • Github

GitHub 是一个面向开源及私有软件项目的托管平台，其中 Github Pages 可以理解为用户编写的、托管在 github 上的静态网页，使用 Ta 提供的免费服务器，免去搭建服务器的步骤。

下载 Git ​

点击进入Git 下载页面

选择 32 或 64 位下载（都 3202 年了，不会还有 32 位系统吧

下载完成后，打开安装程序，如果没有其它需求，可采用**“一路回车大法”**安装

下载 Node.js ​

进入Node.js 官网

选择长期维护版下载

下载完成后，打开安装程序，如果没有其它需求，可采用**“一路回车大法”**安装

检验是否安装成功 ​

按下Win＋R打开运行窗口，输入cmd

分别输入以下命令，出现相关版本信息即代表安装成功，若无，则重新安装即可

sh
git --version
node -v
npm -v

在右键菜单中，我们可以看到多出了两行，分别为Open Git GUI Here和 Open Git Bash Here，我们一般使用第二个Bash

安装 Hexo 框架 ​

在你的任一磁盘中，新建一个文件夹，文件夹名任意（我的为“Blog-VenenoSix24”），网站的相关文件将储存在该文件夹下

在该文件夹下右键鼠标，选择Open Git Bash Here，输入以下命令即可安装

注意！Bash 窗口下，不支持快捷键复制粘贴，请右键选择”Paste“粘贴命令代码

bash
npm install hexo-cli -g

第一次安装可能较久，请耐心等待（去刷视频

安装成功如下图

初始化配置 Hexo ​

上一步成功后，输入以下命令

bash
hexo init blog

安装成功如下图

这时你会发现你刚刚创建的文件夹下多了一个blog文件夹

输入以下命令

bash
cd blog  #进入blog文件夹

接着输入以下命令

bash
npm install

操作成功如下图

最后输入以下命令

bash
hexo s

出现如下提示，其中http://localhost:4000/是网站的本地地址，可用于本地预览

注意！复制网站时，切勿使用 Ctrl+C 快捷键，在这里 Ctrl+C 代表关闭本地服务

预览本地页面 ​

在浏览器中输入http://localhost:4000/即可进入你自己的网站，但是只能本地浏览，预览如下

将网站部署到 Github Pages 上 ​

我们接下来所做的事情是让其他人也能访问你的网站

  1. 注册/登录 Github 账号，访问Github 官网，右上角 Sign In 为登录，Sign Up 为注册

  2. 创建项目仓库，点击右上角 + ，选择New repository进行创建

    注意事项如下：

    • 项目名必须为你的用户名.github.io的格式
    • 勾选Public选项
    • 勾选Add a README file选项

  3. 配置 SSH 密钥，在你自己创建的文件夹中，右键打开Git Bash Here输入以下命令

    bash
    ssh-keygen -t rsa -C "your email@example.com" #引号内填写你的邮箱地址

    运行结果如下，在三个箭头处按Enter回车就行，下方红框内是你的密钥所在位置

    注意！！！ 下图中我邮箱地址填错了，“example”，不要学我！！ 如果你以前执行过该操作，会提示Overwrite (y/n) ?，请根据个人情况处理

    打开.ssh 文件夹：C盘→用户(Users)→你的电脑用户名→.ssh记得打开隐藏的项目，这样才能找到这个文件夹

    方法如下

    进入文件夹后，打开id_rsa.pub文件，复制全部内容(Ctrl+A、Ctrl+C)

  4. 在 Github 上添加 SSH 公钥

    • 登录 Github，进入Settings

    • 点击SSH and GPG Keys

    • 点击New SSH key

    • Title 栏随便填，将刚才复制的全部内容粘贴到 Key 栏，点击Add SSH key

  5. 进行测试

    在任意文件夹/桌面右键选择Git Bash Here，输入以下命令

    bash
    ssh -T git@github.com

    运行结果会提示：

    Are you sure you want to continue connecting (yes/no)?

    输入yes后会提示：

    You‘ve successfully authenticated，but Github......

    出现**"successfully"**字样，则表示配置正确

  6. 配置 Git 个人信息

    输入以下命令进行个人信息的设置，名字可以随便写，但为了方便记忆，建议与 GitHub 保持一致

    bash
    git config --global user.name "your name"     #引号内填写你的用户名
git config --global user.email "your email"   #引号内填写你的邮箱

    如果你做到这一步，恭喜你，你的 SSH Key 配置成功，已成功连接到 Github

将本地 Hexo 文件更新至你的 Github 仓库 ​

  1. 登录 Github，打开你创建的项目yourname.github.io

  2. 复制你的 SSH 地址，如下

  3. 在你创建的 Hexo 文件夹中，打开blog文件夹，打开该文件夹下的_config.yml文件(右键选择记事本或其他软件打开)

  4. 滑到底部，找到deploy字样，修改成如下样式，保存！！

    yaml
    deploy:
  type: git #type 填 git
  repo: git@github.com:VenenoSix24/VenenoSix24.github.io.git #此处粘贴复制的内容
  branch: main #填写分支，master/main，可在Github项目→Settings→Pages→Branch查看

  5. 在你的blog文件夹右键选择Git Bash Here，执行以下命令

    bash
    hexo g
hexo d

    执行完会让你输入你的 Github 的账号和密码，之后你的网站就成功部署到 Github 上了

  6. 如果出现ERROR Deployer not found: git

​ 请输入以下代码回车

bash
npm install --save hexo-deployer-git

  1. 如何访问你的网站

    打开浏览器输入https://你的用户名.github.io，例如我的：VenenoSix24.github.io你的网站就不再是单机的啦~

在博客上发表文章 ​

现在我们的博客里面空空的，我们要写一些文章充实一下，方法如下

  1. 新建一篇文章(两种方法)

    • 第一种，在 Bash 中输入以下命令

      bash
      hexo n "文章标题"

      完成后你将在blog\source\_posts路径下看到一个文章标题.md文件

    • 第二种，直接在blog\source\_posts路径下，右键新建一个文本文档，将后缀改为.md即可

  2. 编写文章

    md 全称为 Markdown，操作简单易懂上手快，推荐编辑器有 Typora、Obsidian、VSCode 等

    使用编辑器打开新建的.md 文件即可编写文章，记得保存

  3. 推送文章

    编写好后，我们要把文章推送到服务器上，输入以下命令，即可完成推送

    bash
    hexo cl
hexo g
hexo d

    推送完成后，打开你的博客就会发现你的新文章啦

更改个人网站主题 ​

基本操作都完成了，但是你会发现你的网站没有别人的好看，接下来教你更换主题

打开 Hexo 官网的主题页面，选择一款你喜欢的主题样式

  • 点击主题上方图片为预览主题

  • 点击主题标题文字为进入主题 Github 页面

我们点击标题文字进入 Github 页面，往下滑会看到主题的配置指南

这里以我使用的安知鱼主题为例，这里是主题帮助文档

  1. 打开博客本地根目录，右键选择Git Bash Here输入主题的 Git 安装代码

    bash
    git clone -b main https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git themes/anzhiyu
#这里以此主题为例

    使用科学上网，配置速度会更快

    完成后，我们打开blog目录下的themes文件夹，会发现多了一个anzhiyu文件夹，即刚刚配置的主题，我们复制该文件夹的名字(我这里是“anzhiyu”)

  2. 打开blog目录下的_config.yml文件，下滑找到theme字样，将复制的主题文件夹名粘贴进去，保存，如下

    yaml
    ## Themes: https://hexo.io/themes/
theme: anzhiyu #这里！！！

    注意！冒号后面有一个空格

  3. 在blog文件夹下右键选择Git Bash Here，输入以下命令

    bash
    hexo cl
hexo g
hexo s

    完成后，在浏览器中输入博客本地地址http://localhost:4000/即可预览更改主题后的网页

  4. 修改主题配置

    每个主题一般都有自己的配置指南，如我这个主题的配置指南为：配置指南

    根据配置指南，就可以更改主题中的具体配置啦

结语 ​

教程到这里就告一段落啦，此时你也拥有了属于自己的个人网站

希望能够帮助到你，祝你拥有以后个自己满意的个人网站

完结撒花~~

VenenoSix24 🩷 Ivyris Amaris

Copyright © 2020-2025 Present Ivy Labs