使用hexo框架在GitHub上搭建个人博客

最新推荐文章于 2024-03-29 11:13:39 发布

Louie_0

最新推荐文章于 2024-03-29 11:13:39 发布

阅读量626

点赞数

文章标签： github

本文链接：https://blog.csdn.net/louie_0/article/details/124024950

版权

【GitHub】

申请Github账号

Github注册页面
输入用户名，Email，密码，注册账号。

安装git

git下载地址
下载git安装文件，双击执行安装。

配置ssh

打开git bash终端。
设置user.name和user.email。

git config --global user.name “GitHub用户名”
git config --global user.email “GitHub注册邮箱”
生成ssh密匙

ssh-keygen -t rsa -C "github注册邮箱"

之后提示输入存储key的文件名、输入密码、确认密码，直接三个空格跳过。
此时，在用户文件夹下就会有一个新的文件夹.ssh，里面有刚刚创建的ssh密钥文件id_rsa和id_rsa.pub。

将公匙添加到github上

用户头像→Settings→SSH and GPG keys→New SSH key→将id_rsa.pub中的内容复制到Key文本框中，然后点击Add SSH key(添加SSH)按钮。
打开git bash，输入ssh git@github.com测试是否连接上github

【配置环境】

安装Nodejs
node -v #查看node版本
npm -v #查看npm版本
npm install -g cnpm --registry=http://registry.npm.taobao.org #安装淘宝的cnpm 管理器
cnpm -v #查看cnpm版本
cnpm install -g hexo-cli #安装hexo框架

（之后再次在公司电脑上安装的时候报错：Error: getaddrinfo EAI_AGAIN registry.npmmirror.com，使用npm install hexo-cli g命令安装成功）

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-3Aw0NJ7q-1649332440698)(D:\CODE\blog\source_posts\pic\01.png)]
hexo -v #查看hexo版本
mkdir blog #创建blog目录
cd blog #进入blog目录（之后的操作一直在blog目录中进行）

【初始化博客】

hexo init #生成博客初始化博客
hexo s #启动本地博客服务
使用 http://localhost:4000/ 在浏览器中打开博客
hexo n “我的第一篇文章” #创建新的文章
hexo clean #清理
hexo g #生成
在Github创建一个新的仓库 YourGithubName.github.io
cnpm install --save hexo-deployer-git #在blog目录下安装git部署插件
配置_config.yml

内容如下：

#Deployment
##Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: https://github.com/YourGithubName/YourGithubName.github.io.git
branch: master

注意：

冒号后面要加一个空格

repo根据需要替换成ssh地址（GitHub2021 年 8 月 13 日移除了对密码身份验证的支持，要使用ssh和Token方式，此处用ssh链接比较方便。

branch可能需要改成“main”，根据自己GitHub仓库进行更改

hexo d #部署到Github仓库里
使用https://YourGithubName.github.io/ 地址可以查看博客

【修改主题】

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia #下载yilia主题到本地的themes/yilia文件夹中
修改hexo根目录下的 _config.yml 文件：

theme: yilia
hexo clean #清理一下
hexo g #生成
hexo d #部署到远程Github仓库
https://YourGithubName.github.io/ #查看博客（主题可能不会立马生效，刷新一下即可）

【美化主题】

截断文章

yilia 主题中可以用截取文章的显示长度，如果你想在哪截取文章，就在那行之后插入：

<!--more-->

文章添加标签

在文章的tags后添加：

title: GitHub命令行的使用
date: 2022-1-11 14:36:53
tags:
  - 开发工具
  - GitHub

即可自动生成标签。

左侧美化

头像

头像/图标图片的存放位置是/themes/yilia/source/下任意位置，可以自己新建一个文件夹存放，我存放在assets文件夹下。
配置文件为/themes/yilia/_config.yml。设置头像为配置文件中avatar一项，设置图标为配置文件中favicon一项，设置路径的根目录为/themes/yilia/source/。

背景

1.打开\themes\yilia\source\main.xxxx.css文件
2.用你的编辑器在里面找到.left-col{undefined
3.在这个标签里删除background属性并加上background-image:url(“”);属性

TODO：

1、背景、动画、评论、访问量、打赏

2、GitHub页面链接

3、域名、搜索引擎优化、微信分享

参考：

哔哩哔哩 UP主：CodeSheep
GitHub不再支持密码验证解决方案：SSH免密与Token登录配置）
美化主题：Hexo-Yilia进阶笔记
yilia主题源码：https://gitee.com/axinhouzilaoyue/hexo-theme-yilia
eveloper/article/1861466)）
美化主题：Hexo-Yilia进阶笔记
yilia主题源码：https://gitee.com/axinhouzilaoyue/hexo-theme-yilia