avatar

hexo+github搭建免费个人博客

欢迎来访!!

1.环境说明

  1. Windows
  2. node.js
  3. git
  4. hexo

2. 搭建github

前提:要有一个github账号(没有的话去注册一个)

  1. 创建仓库
    在GitHub.com中右上角,点击加号,有个New repository,新建仓库。
    在这里插入图片描述
    新建一个名为你的用户名.github.io的仓库(一定要是你的用户名),点击create repository(我这里是已经建过了)这样就完成啦!
    在这里插入图片描述

3.安装

3.1 安装git

进入Git官网下载Git
安装好后,进入Git Bash,用git --version 来查看一下版本
在这里插入图片描述
####3.2 安装nodejs
官网下载安装nodejs
安装好后,打开git bash命令行,查看是否安装成功

node -v
npm -v

3.3安装hexo

以上所有都安装完成之后再安装Hexo。依旧打开git bash 输入命令

$ npm install -g hexo-cli

接着输入 hexo -v 查看版本
在这里插入图片描述

到此为止,需要的东西都安装完了

3.4初始化hexo

创建一个文件夹名为blog(随便吧),然后在这个文件夹下直接右键git bash打开,输入hexo init

$ hexo init

hexo会自动下载一些文件到这个目录,目录结构图:
在这里插入图片描述

目录说明:

  • node_modules: 依赖包
  • public:存放生成的静态页面
  • scaffolds:生成文章的一些模板
  • source:用来存放你的文章
  • themes:存放主题
  • _config.yml: 博客的配置文件

初始化完成后,会有一个默认主题以及一个hello-word的默认文章。所以我们先打开看看效果,运行命令:

$ hexo g
$ hexo s

然后打开浏览器,输入 localhost:4000 就可以浏览我们的博客
大概这个样子?
在这里插入图片描述

ctrl+c可以把服务关掉

4.上传到github

配置SSH key

在git bash中,输入

$ git config --global user.name "username"
$ git config --global user.email "youremail"

这里的username输入你自己的GitHub用户名,youremail输入你GitHub的邮箱。

接着连接公钥

$ ssh-keygen -t rsa -C "youremail"

然后连续3次回车,最后会生成一个文件在用户目录下,打开用户目录,找到.ssh\id_rsa.pub文件,用记事本打开并复制里面的内容

打开你的github主页,点击头像,进入setting 在这里插入图片描述

点击SSH and GPG keys
在这里插入图片描述
点击右上角的 New SSH key,进入这里
在这里插入图片描述

回到git bash中,测试是否成功
输入:

$ ssh -T git@github.com

以上配置好后,将hexo和GitHub关联起来,打开站点配置文件 _config.yml,找到最后deploy的部分:

deploy:
type: git
repo: https://github.com/YourgithubName/YourgithubName.github.io.git
branch: master

YourgithubName就是你的GitHub名字

接着打开git bash安装deploy-git部署命令:

$ npm install hexo-deployer-git --save

然后输入

$ hexo clean
$ hexo g
$ hexo d
或者 $ hexo clean && hexo g && hexo d

hexo clean清除了你之前生成的东西,可以不加。
hexo g 生成静态文章,是hexo generate的缩写
hexo d 部署文章,是hexo deploy缩写

部署完成后,可以在浏览器中输入http://yourname.github.io 就能够访问了你的博客

你可以设置个人域名(因为我太穷了,你们自行去百度看看吧)

5.hexo的配置

1.基本配置
打开文件根目录下的_config.yml,对整个hexo架构进行配置
网站:
(我哭!那是语言!不是语音!!)在这里插入图片描述
网址:
在这里插入图片描述
主题:
修改主题的位置在这里插入图片描述
theme就是给你的博客选什么主题,从在theme这个文件夹下选,官网上【进入】有很多个主题,默认安装的是lanscape这个主题。当你需要更换主题时,在官网上下载,把主题的文件放在theme文件夹下,再修改这个参数就可以了。

我用的主题是butterfly,可以去作者的博客康康,里面有详细的配置。作者

2.新增导航栏选项
git bash中执行命令:

$ hexo new page tags

它就会在根目录下source文件夹中新建了一个tags文件夹,里面包含index.md文件,在index.md中写上你想要在网站上展示出来的东西。

6.最后

博客到这里就差不多做完啦!再想完善完善的话,多多去康康其他博主的博客叭!扎油!!!

文章作者: 舍予
文章链接: https://zshuhan.github.io/2020/04/22/hexo+github%E6%90%AD%E5%BB%BA%E5%85%8D%E8%B4%B9%E4%B8%AA%E4%BA%BA%E5%8D%9A%E5%AE%A2/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 (✿◡‿◡)胖涵
打赏
  • 微信
    微信
  • 支付宝
    支付宝

评论