基于Github托管的Hexo博客

前言

如你所见，这就是我的小破站了。以后有新的文章就会在这里进行更新。 稍等一下，先听会儿小曲...♩ˊ♪¨♫¨ˊ♬~ 

1
{% meting "446156870" "netease" "playlist" "theme:#FF4081" "mode:circulation" "mutex:true" "listmaxheight:340px" "preload:auto" %}

需要搭建一个这样的博客？

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
1.安装node.js | node-v18.16.0-x64.exe
https://nodejs.org/en/

2.安装Git | Git-2.40.1-64-bit.exe
https://git-scm.com/

3.重启电脑，然后运行 Git Bash 

4.使用 node -v和 npm -v 检查是否安装成功

5.安装 hexo
npm install -g hexo-cli

6.新建博客项目：Blog
npx hexo init Blog

7.进入 Blog 文件夹
cd Blog

8.安装依赖
npm install

9.本地启动
npx hexo server

10.如果安装依赖出现问题，则运行
npm install -g npm

11.重新运行
hexo s

12.在浏览器地址栏输入localhost:4000，即可进入 Hexo 博客的主界面！
localhost:4000



# 旧的说明
# 因为github在2021年8月后，repositories请使用ssh的地址
# 为了不要踩那么多坑，建议看这个文章，比较详细
https://blog.csdn.net/guoxiaorui666/article/details/99623023

# 如果有一些代码不懂的话，配合这篇文章
https://www.jianshu.com/p/346acc6d6987

# 然后是视频教程（这是旧版的，需要配合上面的文章看，不然很多地方都不行了）
https://www.bilibili.com/video/av44544186

# 或者参考此文章
https://blog.csdn.net/Colincoin/article/details/102594799
https://blog.csdn.net/wenxingchen/article/details/131489468

博客用什么编辑器？

文章使用的编辑器是：typora

启动本地博客

1
2
3
4
5
6
7
8
9
10
11
# 本地博客一般是用来调试和先前发布内容的地方；
# 在git Bash中定位到博客的目录
cd D:\blog

# 或者直接找到博客目录，右键Git Bash

# hexo server 初始化本地服务器
hexo s 初始化本地服务器 

# 正常流程后进入本地服务器
http://localhost:4000

写一篇文章

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
# 新建一篇博客
hexo new "需要新建的名称"

# 以下是一篇文章的引用信息
title: 文章标题..................### 文章标题
index_img: /img/example.jpg..................### 文章缩略图
date: 2019-10-10 10:00:00..................### 文章日期
categories:..................### 文章分类
- 站点新闻..................### 文章分类名称
tags:..................### 文章标签
- Hello Word..................### 标签名称


参考fluid文章写法演示:https://hexo.fluid-dev.com/posts/hello-fluid/
搭配 Fluid 如何优雅的写一篇文章：https://hexo.fluid-dev.com/posts/fluid-write/


#调用卡片链接方法，要把上下的 --- 杠杠杠 加上，然后将连接名称和链接加上
---
演示名称：卡片式链接
演示地址：https://github.com/OrangeX4/hexo-link-card
---

#插入图片
<img src="base64图片代码"/>

引用嵌入式网页

1
2
# 引用嵌入式网页
<iframe src="https://hexo.fluid-dev.com/posts/hello-fluid/" width="100%" height="600" name="topFrame" scrolling="yes"  noresize="noresize" frameborder="0" id="topFrame"></iframe>

媒体内容

1
2
3
4
5
6
7
8
9
10
11
12
在Markdown文件中使用以下代码来插入视频
<video width="100%" controls>
<source src="/videos/sword_dolly_v1.mp4" type="video/mp4">
</video>


第三方插件 DPlayer
{% dplayer "url=/videos/sword_dolly_v1.mp4" %}
# 这是指向本地的方法

{% dplayer "url=https://tencent-xpc13.xpccdn.com/5e57b9cec7f1f.mp4" %}
# 这是指向网络流媒体的方法

推送博客内容到 Pages

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# hexo clean命令清除public目录中的所有文件和缓存。
hexo clean

#hexo g是hexo generate的简写，用于生成静态网站文件。当你更新博客内容后，需要使用该命令重新生成网站文件，然后才能查看最新的更改。执行hexo g命令后，Hexo会根据你在_config.yml中设置的配置信息，将博客源文件（Markdown、HTML、CSS等）转换成静态网页并存储在public目录中。
hexo g

#通过执行hexo d命令，可以将本地生成的静态文件部署到指定的远程服务器上，从而使其他人可以通过访问该服务器来浏览你的博客内容。
hexo d

# 更快捷的流程
hexo clean
hexo g -d
# 输入秘钥
# 完成上传

此博客的维护支持

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
# hexo中插入PDF
# 1.安装hexo-pdf
npm install --save hexo-pdf

# 本地PDF引用（需要在source文件夹下创建一个叫pdf的文件夹）
{% pdf /pdf/xxx.pdf %}

# PDF技术支持：https://zhuanlan.zhihu.com/p/550626417?utm_id=0

博客aplayer
https://blog.csdn.net/hushhw/article/details/88092728
#fluid主题对此方法行不通，得用hexo注入才行。

更新命令
npm update --save hexo-theme-fluid

调试模式：清除缓存，生成静态文件，运行博客
hexo clean && hexo g && hexo s

注入器

这个功能可以实现自定义主题效果，并且不会干预原来的主题配置，效果嘎嘎好 通过 Hexo 5 注入器为主题添加新功能 - Hexo Theme Fluid

获取网站图标

通过网址获取

通过官网链接加上/favicon.ico，可以快速获得一个网站的图标，比如：

1、获取百度图标：https://www.baidu.com/favicon.ico

2、获取谷歌图标：https://www.google.com/favicon.ico

2、获取知乎图标：https://static.zhihu.com/heifetz/favicon.ico

通过接口获取

1、开放接口：https://api.iowen.cn/favicon

获取百度图标：https://api.iowen.cn/favicon/www.baidu.com.png

获取谷歌图标：https://api.iowen.cn/favicon/www.google.com.png

通过上面的开放接口可以获取一个网站的图标，其使用方式就是在接口链接后加上需要获取图标的URL地址，同时要注意确保URL能够正常打开，而且不需要 http(s):// 前缀，且结尾必须填 .png。

2、开放接口：https://www.google.com/s2/favicons?sz=64&domain=

获取知乎图标：https://www.google.com/s2/favicons?sz=64&domain=zhihu.com

获取百度图标：https://www.google.com/s2/favicons?sz=64&domain=baidu.com

通过上面的开放接口可以获取一个网站的图标，其使用方式就是在接口链接后加上需要获取图标的URL地址，同时要注意确保URL能够正常打开，而且不需要 http(s)://www. 前缀。

通过图标网站

1、FontAwesome图标网站：https://fontawesome.com/

2、爱给素材图标网站：https://www.aigei.com/

3、IconFont图标网站：https://www.iconfont.cn/

空间用量

github pages 分配给每个站点空间总量不得超过 1 GB。关于 GitHub Pages - GitHub 文档

gitee pages 分配给每个仓库总量不得超过 500M。Gitee 使用配额说明 - Gitee.com

迁移计划：如果在github的空间爆满后，在考虑上云。

不在此博客列表主动显示的文章

1
2
3
4
5
#被主动隐藏的文章不会在首页显示，如需使用，请在网页尾部添加引用链接，
/2024/02/07/26-逆战专题页/
/2023/12/03/25-ChatGLM3/（已公开）
/2023/12/02/24-PS神经网络滤镜离线插件/
/2024/03/09/28-PC实用工具/（已公开）

喜欢这款主题吗？

此博客是用的是：Hexo Fluid

有关此主题的技术支持：Fluid技术文档

站点新闻
#Hello Word
基于Github托管的Hexo博客
https://fxy5750.github.io/2020/03/20/01-hello-world/
作者
fxy5750
发布于
2020年3月20日
更新于
2023年5月1日
许可协议