GitHub搭建免费博客

一、GitHub仓库准备

​ 搭建博客需要准备两个仓库。一个存放博客图床的仓库,另一个存放博客网站的仓库。

1.1、图床创建
  • 新建仓库

    第一步:

在这里插入图片描述

​ 第二步:

在这里插入图片描述

  • 生成Token令牌

    点击右上角头像->Settings->下拉,直到左侧到底,选择Developer settings(开发人员设置)->Personal Access tokens(个人访问令牌) -> Tkens(classic) -> Generate New Token(classic, 一定要选择 classic 方式)-> 配置相关信息 -> Generate token

    第一步:
    在这里插入图片描述

​ 第二步:

在这里插入图片描述

​ 第三步:

在这里插入图片描述

  • 创建图片文件夹

    第一步:

    在这里插入图片描述

    第二步:

    在这里插入图片描述

  • 设置Typora实现自动上传

    Mac系统:Typora–>设置–>图像

    在这里插入图片描述

1.2、博客网站

​ 第一步:新建GitHub仓库

在这里插入图片描述

​ 第二步:设置仓库

  • 注意!:仓库名称必须是xxx.github.io,否则不能成功创建网站。

在这里插入图片描述

二、图床使用

2.1、下载PicGo软件上传图片

官网下载

2.2、配置PicGo

选择图床设置–>GitHub–>编辑按钮

仓库名:GitHub用户名/GitHub仓库地址
分支名:GitHub的分支名称
Token:GitHub中设定的AccessToken
自定义域名:https://fastly.jsdelivr.net/gh/用户名/仓库名

在这里插入图片描述

在这里插入图片描述

2.3、使用PicGo

选择上传区–>切换图片上传为GitHub–>拖拽图片上传

在这里插入图片描述

三、Hexo安装

3.1、安装Node.js

第一步:下载Node软件安装

前往Node.js下载LTS稳定版,下载完成后双击下载文件,按步骤默认安装即可。

第二步:验证

npm -v

第三步:配置淘宝镜像源

npm config set registry https://registry.npm.taobao.org

验证是否设置成功

npm config get registry

3.2、安装Hexo

npm install hexo-cli -g

3.3、使用Hexo创建个人博客项目

初始化博客项目:hexo init 项目名

hexo init Blog

进入博客项目目录

cd Blog

安装依赖

npm install

新建文章:hexo new 文章名

hexo new first

在这里插入图片描述

启动本地服务

hexo s

在这里插入图片描述

3.4、自定义Hexo主题

​ 可以在 https://hexo.io/themes/index.html进行主题的挑选。将下好的主题放在themes文件夹内,同时在_config.yml中进行主题修改。一下以Aurora主题的配置为例.

在这里插入图片描述

第一步:前往主题的GitHub仓库,选择Release版本下载主题

在这里插入图片描述

第二步:将下载下来的主题包放在themes文件夹内

在这里插入图片描述

第三步:复制themes–>aurora->_config.yml到Blog目录下,命名为_config.aurora.yml

在这里插入图片描述

第四步:修改Blog目录下_confg.yml文件

在这里插入图片描述

安装插件

npm install hexo-theme-aurora hexo-plugin-aurora --save

主题包安装依赖

cd themes/aurora
npm install

根据Aurora主题配置文档https://aurora.tridiamond.tech/en/guide/getting-started.html,完成其他配置。

第五步:生成网页

hexo g

第六步:部署

hexo d
  • 20
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值