'hexo安装使用教程'
'hexo安装使用教程'
hanzexihexo博客搭建视频教程
第一期https://youtu.be/KUGDaIpSXYY
本文以winddows系统安装hexo博客框架为例
一、hexo本地安装
二、提交到github仓库
三、最轻便，最美主题安装，以及优质主题推荐
四、在vercel容器安装hexo，添加自定义域名
五、博客内容修改，修改菜单内容，页面内容，文章添加，插件安装，seo，cdn加速加载页面
六、markdown 语法
第一部分
1、安装环境node.js
安装时注意添加路径
2、安装git bash
https://git-scm.com/download/win
在 git bash 中输入以下命令启用 Hexo镜像
npm config set registry https://registry.npm.taobao.org
在 git bash 中输入以下命令开始全局安装 Hexo
npm install -g hexo-cli
在 git bash 中输入
hexo init 自定义博客名
在 git bash 中输入hexo g ,编译静态文件到public文件夹，这是根目录会自动生成public文件夹
hexo g
在 git bash 中输入hexo s，启动本地预览，关闭gitbash后,就无法预览
hexo s
输入 http://localhost:4000 ，能正常访问，则启动成功
第二部分
3、将hexo代码提交到github仓库，
注册github.com账号
新建一个github仓库，仓库名必须是你的GitHub用户名.github.io，
比如1jia1.github.io
目的是为了搭载 GitHub Pages 服务，如果导入到vercel,可以自定义其它用户名
3.1、生成SSH密钥
在 git bash 中输入如下命令
git config –global user.name “你的GitHub用户名”
git config –global user.email “你注册github的邮箱”
生成密匙命令
ssh-keygen -t rsa -C “你注册github的邮箱”
在本地电脑中找到新生成的公匙，复制id_rsa.pub中的内容
找到github个人图像
设置-SSH and GPG keys-New SSH Key-粘贴公钥
验证是否成功
输入命令
ssh -T git@github.com
3.2打开 _config.yml，找到文件最后一行的 deploy
替换以下代码
deploy:
type: git
repo: https://github.com/你的github用户名/你的github用户名.github.io.git,main
安装推送命令
npm install hexo-deployer-git –save
清理缓存，重新生成静态文件，推送到github的命令
hexo clean && hexo g && hexo de
推送成功后
访问网址：你的GitHub用户名.github.io
第三部分
安装butterfly主题
根目录下git bash 输入命令
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly
安装渲染器
npm install hexo-renderer-pug hexo-renderer-stylus –save
修改 Hexo 根目錄下的 _config.yml，把主題改為 butterfly
theme: butterfly
清理缓存，重新生成静态文件，推送到github的命令，每次更新完内容执行此命令
hexo clean && hexo g && hexo de
访问网址预览效果：你的GitHub用户名.github.io
第四部分
在vercel容器安装hexo，添加自定义域名
用github同名账号登录https://vercel.com/
第五部分
安装hexo admin 插件
执行以下命令即可
npm install -g hexo
cd ~/
hexo init my-blog
cd my-blog
npm install
npm install –save hexo-admin
hexo server -d
open http://localhost:4000/admin/
5.1菜单栏修改
在 _config.yml 下找到 menu ：去掉前面的#就可以显示菜单
menu:
首页: / || fas fa-home
归档: /archives/ || fas fa-archive
标签: /tags/ || fas fa-tags
分类: /categories/ || fas fa-folder-open
#菜单||fas fa-list:
#音乐: /music/ || fas fa-music
#电影: /movies/ || fas fa-video
友链: /link/ || fas fa-link
#关于: /about/ || fas fa-heart
5.2添加标签页
根目录输入 hexo new page tags
找到 source/tags/index.md 这个文件，修改这个文件：
添加 type: “tags”
title: 标签
date: 2018-01-05 00:00:00
type: “tags”
orderby: random
order: 1
5.3添加子页面
hexo n 页面的名称
创建你的页面就行
5.4首页顶部图片更换
The banner image of home page
index_img: https://cdn.pixabay.com/photo/2023/10/23/03/03/fashion-8335213_1280.jpg
著名的无版权可商用的图片网站
https://pixabay.com/
hexo主题分享
1.连背景都是特效的博客
preccrepad.github.io
2.番茄博客，博文里面有很多小特效，比如会动的小标签啦，图片的加载动画啦
tomotoes.com/blog/
github.com/Tomotoes/he…
3.一个UI设计师的博客，界面干净清爽
esappear.github.io/clover/
4.二次元爱好者转码人的博客，内容丰富，有点耗性能
shoka.lostyu.me
5.yilia升级版，简洁的博客，可以按主题和标签分类
joeybling.github.io
6.简单的博客框架，分类明晰，速度快，功能较少
hufangyun.com
7.暖色梵高主题，配色舒适
8.标签和UI特别可爱，图片选取很用心的一个博客
rawchen.com/
9.功能清晰，强大的主题matery，文章统计功能做得很细致
blinkfox.com/
10.hexo-theme-redefine
11.butterfly
