avatar

起步:建一个挂载在git上的hexo博客

当初毕业之时就想有一个博客 做博客也经历的好几个阶段
第一个博客 是静态页面博客就html+css+js 做的 很简单 上传到git挂在git的资源上
第二个博客 初心是想写留言板 于是买了服务器 买了域名 使用vue做了个移动端博客 使用koa2 +moogoDB数据库 然后也使用iview做了 对应的后台 但是最后因为服务器欠费(实际上不想交了)然后就被没收了
第三个博客 是前段时间看到别人发博客了,去找他了解到了zeite的存在 相当于 服务器 在里面了解了原来vue和hexo都有模板 然后可以用git clone下来 改完上传就在服务器了 以后也会在zeite上去写vue的项目
然后现在这段时间就在学习修改hexo的配置 争取早日熟练 就可以开始整理学习资料了

摸索过程

1.先看hexo官方文档 成功搭建hexo模板
2.上传到github 并挂载到zeite上
3.选择一款喜欢的主题并进行替换
4.熟练主题配置和hexo命令

替换主题

将主题放到根目录下的themes文件下 然后在根目录的config.yml里去修改主题我这里主题文件夹是Butterfly

1
$ theme: Butterfly

修改博客名称

这里一些基础配置需要在根目录下的configy.yml里去修改配置的,

1
2
3
4
5
6
7
8
# Site
title: 阿明のBlog
subtitle:
description:
keywords:
author: 张复明
language: zh-TW
timezone:

修改文章语言

这里的话 我就统一去找lang和language 统一配置了
默认是en 有三种选择 en zh-CH zh-TW

1
2
lang: zh-TW
language: zh-TW

配置主题配置

站點配置文件_config.yml是 hexo 工作目錄下的主配置文件(還不知道是哪裏的,自己google)
butterfly.yml 是 Butterfly 的配置文件。它需要你手動將主題目錄下的_config.yml文件複製到 hexo 工作目錄的source/_data/butterfly.yml中。如果文件或者文件夾不存在,需要手動創建。

修改菜单

butterfly.yml 下 当然我觉得如果没有配置这个文件 在主题的那个config文件下改应该也可以

1
2
3
4
5
6
7
8
9
10
11
menu:
首页: / || fa fa-home
時間軸: /archives/ || fa fa-archive
標籤: /tags/ || fa fa-tags
分類: /categories/ || fa fa-folder-open
友鏈: /link/ || fa fa-link
關於: /about/ || fa fa-heart
清單||fa fa-list:
- 音樂 || /music/ || fa fa-music
- 照片 || /gallery/ || fa fa-picture-o
- 電影 || /movies/ || fa fa-film

新建与菜单匹配的页面

前往你的 Hexo 博客的根目錄
这里的tags与菜单里的路径tags必须对应

輸入hexo new page tags

你會找到source/tags/index.md這個文件

修改這個文件:

1
2
3
4
5
---
title: 標籤
date: 2018-01-05 00:00:00
type: "tags"
---

以此类推

友情链接

为你的博客添加一些友情链接

创建友情链接页面

前往你的 Hexo 博客的根目錄
輸入 hexo new page link
你會找到source/link/index.md這個文件
修改這個文件:

1
2
3
4
5
---
title: 友情鏈接
date: 2018-06-07 22:17:49
type: "link"
---

友情链接添加

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
---
class:
class_name: 友情鏈接
link_list:
1:
name: xxx
link: https://blog.xxx.com
avatar: https://cdn.xxxxx.top/avatar.png
descr: xxxxxxx
2:
name: xxxxxx
link: https://www.xxxxxxcn/
avatar: https://xxxxx/avatar.png
descr: xxxxxxx
---

友情鏈接界面設置

需要添加友情鏈接,可以在Butterfly.yml配置
可在友情鏈接上寫上自己的個人資料,方便其他人添加

1
2
3
4
5
6
7
8
Flink:
headline: 友情鏈接
info_headline: 我的Blog資料
name: Blog 名字: JerryC
address: Blog 地址: https://jerryc.me/
avatar: Blog 頭像: https://jerryc.me/img/avatar.png
info: Blog 簡介: 今日事,今日畢
comment: 如果需要交換友鏈,請留言

持續更新第二次

標籤與分類

標籤和分類的實現

寫出了文章內容后 就要把文章進行歸類整理 這是一個好習慣
實際操作很簡單只要在對應的文章頁面下 配置題目的那裡進行配置 就好了
以下是我的配置 包括圖片之類的配置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
---
title: 起步:建一个挂载在git上的hexo博客
tag:
- Hexo
- 主题
- 教程
categories:
- 教程
- Hexo
keywords: "Hexo,重新部署,主题博客"
addrlink: dda8c81b
date: 2020-03-20 22:05:07
description:
top_img:
cover: "https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/hexo-theme-butterfly-doc-cover.jpg"
---

照片墻

這裡一些簡單的背景圖配置就不仔細說了 但是還是要去熟悉的
首先我這裡用的是比較新的hexo 所以寫法是最新的
照片墻首先還是要新建頁面 不用教了吧

然後就是配置代碼

1
2
3
4
5
6
7
8
{% gallery %}
![](https://gratisography.com/wp-content/uploads/2019/10/gratisography-scary-pumpkin-hand-900x600.jpg)
![](https://gratisography.com/wp-content/uploads/2019/10/gratisography-fresh-fish-dinner-900x600.jpg)
![](https://gratisography.com/wp-content/uploads/2019/10/gratisography-mountain-cloud-landscape-900x600.jpg)
![](https://picjumbo.com/wp-content/uploads/iphone-free-stock-photos-2210x3315.jpg)
![](https://picjumbo.com/wp-content/uploads/young-millennial-girl-drinking-lemonade-and-overlooking-the-city-2210x1473.jpg)
![](https://picjumbo.com/wp-content/uploads/modern-graphic-designer-essentials_free_stock_photos_picjumbo_HNCK4919-2210x1474.jpg)
{% endgallery %}

這裡放效果圖 寫法與上面一致 其實就是放照片

明天再更新吧 好累肝不動了

2020.03.22

今天是周末没选择出门 就在这里研究了一下午

##相册

试用于2.2.0版本

1
2
3
<div class="gallery-group-main">
{% galleryGroup '在人间' '2019收藏的图片' '/gallery/people' http://img.zhangaming.com/hexo/timg.jpg %}
</div>

配置相册 这里走了很多弯路 踩了一下午的坑 不过好处就是知道了 可以直接在里面写html
所以这边的相册是手写的这是2.1.0的

1
2
3
4
5
6
7
8
9
10
{% raw %}
<div class="gallery-group">
<img class="gallery-group-img" src="http://img.zhangaming.com/hexo/timg.jpg">
<figcaption>
<div class="gallery-group-name">在人间</div>
<p>2020在人间</p>
<a href="/gallery/people"></a>
</figcaption>
</div>
{% endraw %}

##音乐 电影 还有很多模块
这些后面都属于插件范围了 大家可以去看原作者JerryC的文档 JerryC
我使用的是2.1.0版本 作者已更新到2.2.0了 所以配置之类的有冲突 我因为已经改了很多 所以就没有更新2.20
但是建议大家用他的2.2.配合文档使用 我很不巧 我用的时候是 3.10号开始学 作者17号更新 导致后面很多文档都不一样
只能自己去踩坑了如果你也有博客 交换一下友链呗 哈哈哈

##End 2020/03/22/ 23:11

##最后的倔强

我还是花了两个小时升级了版本 因为不升级看作者文档真的很费力 反正还是肝 恭喜 暂时告一段落了 这篇文章就到这结束了 写的好累

文章作者: 张复明
文章鏈接: https://hexo.zhangaming.com/2020/03/20/start/
版權聲明: 本博客所有文章除特別聲明外,均採用 CC BY-NC-SA 4.0 許可協議。轉載請註明來自 阿明的博客
打賞
  • 微信
    微信
  • 支付寶
    支付寶

評論