基于Hexo和GitHub的个人博客搭建

本文详细介绍了如何在Windows系统中安装Node.js和Git,然后使用Hexo框架创建个人博客,并将其部署到GitHub上。通过安装Hexo,初始化项目,配置deployer插件,以及修改_config.yml文件,将博客关联到GitHub仓库。此外,还讲解了如何更换博客主题,以Yilia主题为例进行演示,并完成本地和远程的更新。
摘要由CSDN通过智能技术生成

系统:win10/11 

框架:Hexo

远端部署:GitHub

1.安装node.js和git

进入node官网https://nodejs.org/zh-cn/,下载windows64位的18.14.2版本,安装过程一直next即可。打开命令行,

node -v
npm -v

查看版本,如下:

到git官网下载windows版本的git(https://git-scm.com/download/win),点击下载(下载速度看网速),安装成功后,鼠标右键会有Git GUI Here和Git Bash Here两个选项。

2.安装hexo

在D盘新建一个名为Blog的文件夹,用来存放个人博客的相关文件,进入这个文件夹,右键Git Bash Here,

npm install -g hexo-cli

结果如下:

 新建名为hexoblog的项目:

hexo init hexoblog

结果如下:

 这时发现Blog文件夹下已新建了hexoblog文件夹,存放这我们这个博客的所有文件,若此次搭建中某一步失败,可删掉这个文件夹重新来。

进入hexoblog文件夹:

cd hexoblog

初始化:

npm install

启动hexo服务:

hexo s

此时打开浏览器进入http://localhost:4000/便可进入hexo的个人博客主页,如下:

 命令行按clrt+c退出。

3.部署到github

这是本地的博客,需要部署到远端去才可以被人访问。付费可以使用阿里云,免费可以部署到github上。

浏览器打开github.com登录,进入个人主页,右上角加号New repository新建仓库,仓库名(repository name)必须是你的github昵称加上github.io的后缀。简介(Description)可以写我的博客。然后点击Create repository创建仓库。

返回刚才的git命令行,安装deplgyer插件:

npm install –save hexo-deployer-git

用notepad++打开hexoblog文件夹下的_config.yml(没有notepad++的安装一个),在文件的最后一行修改为:

type: git
repo: “你的github仓库的网址”  #(注意type和repo的冒号后面要加空格)
branch: master

如下:

 保存退出。

返回git命令行,输入:

git config --global user.email "xxx"  # 引号里为你的github的注册邮箱
git config --global user.name "xxx"  # 引号里填上你的github的用户名

为了方便起见,把这两行代码起别名为操作I。

然后部署到github:

hexo d

打开浏览器网址栏输入你的以github.io为后缀的仓库名,就可以打开你的个人博客了。

4.更换博客主题

这里以yilia主题为例,yilia主题地址在:https://github.com/litten/hexo-theme-yilia。

在hexoblog文件夹下右键Git Bash here打开git命令行输入:

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

完成后就会发现hexoblog文件夹下的themes文件夹下clone了下载好的新主题文件。

用notepad++打开hexoblog文件夹下的_config.yml,修改theme: landscape一行为:

theme: yilia

以后换什么主题就修改为相应名字,保存退出。

在git命令行输入:

hexo g
hexo s

完成本地更换,推到远端之前需要重复操作I,然后再命令行输入:

hexo d

这样打开博客就会发现主题已更换了,如下:

 关于微博知乎链接、自我介绍等都可以自己设置。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值