效果预览:轻松打造免费个人网站教程分享
准备:
- Windows电脑
- GitHub账号
- 使用Hexo框架搭建Blog软件
步骤:
(1)注册GitHub账号:点击此处注册GitHub账号
(2)安装Git:
- 访问Git官方网站下载Git:https://git-scm.com/
- 按照官方给出的安装过程进行安装,非常简单。
(3)安装Node.js:
- 访问Node.js官方网站:https://nodejs.org/en/
- 根据指南依次点击即可完成安装。
(4)安装Hexo
在Git中进行一系列检测:
-
检测Node.js安装是否成功:
node -v (返回版本号) npm -v (返回版本号) -
安装淘宝的镜像源(如果错误就重来,因为连接可能不稳定,不要害怕多试几次就可以了):
npm install -g cnpm --registry=https://registry.npm.taobao.org
建立仓库(repository):
- 创建一个新的GitHub仓库(例:hansonpang99.github.io)
在 Blog 目录下安装一个Hexo部署插件:
cnpm install --save hexo-deployer-git
找到 Blog 文件中的_config.yml 文件,使用编译器打开,建议使用Visual Studio Code打开。
修改_config.yml 文件:
- 注:Visual Studio Code 的好处:1. 支持的语言种类多,2. 视图简洁,3. 拥有插件种类多
找到如下代码:
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repository:
- <repository url>
branch: [branch name]
- 将
type更改为git - 在
repository中输入新建的GitHub仓库地址 - 在
branch中设置管理员权限,例如:master
保存修改后,在Git中执行以下命令将本地文件部署到GitHub上的新仓库中:
hexo d
然后通过访问 https://<你的仓库名> 就可以访问部署到GitHub上的Blog了(例:https://hansonpang99.github.io)
进一步深化操作过程(更换Blog的主题):
以yilia主题为例进行更换:
- 首先下载yilia主题:点击此处下载yilia主题
- 在Git中输入:
git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
找到 Blog 文件中的_config.yml 文件,使用编译器打开,建议使用Visual Studio Code打开。
修改_config.yml 文件中的 theme 部分,将内容更改为:
theme: yilia
执行以下命令清除数据库、生成静态网站并将新的文件部署到GitHub中:
hexo clean
hexo g
hexo d
这样就实现了主题的更改。
通过以上步骤,你就可以轻松地打造一个免费的个人网站了!祝你成功!