hexo上传后github无变化，Hexo博客搭建小白教程
hexo上传后github无变化，Hexo博客搭建小白教程注意：首先需要明白什么是站点配置文件，什么是主题配置文件，站点配置文件就是根目录下的配置文件，比如我的博客文件在D:\blog下，那么站点配置文件就是D:\blog\_config.yml，主题配置文件就是D:\blog\themes\matery\_config.yml。5.2.1 切换主题https://codeload.github.com/blinkfox/hexo-theme-matery/zip/master下载 master分支的最新稳定版的代码，解压缩后，将hexo-theme-matery的文件夹复制到你Hexo的themes文件夹中即可。当然你也可以在你的站点目录文件夹下使用git clone命令来下载：直接在站点根目录下执行下面的命令，即可进行主题的下载，主题有两个版本，稳定版本和最新版本(不定期更新优化)，自主选择版本。1git clone https://gith
一、Github Hexo博客搭建小白教程（一）
二、Github Hexo博客搭建小白教程（二）
五、hexo博客主题安装以及一些个性化修改
5.1. 主题下载与安装
https://codeload.github.com/blinkfox/hexo-theme-matery/zip/master下载 master分支的最新稳定版的代码，解压缩后，将hexo-theme-matery的文件夹复制到你Hexo的themes文件夹中即可。
当然你也可以在你的站点目录文件夹下使用git clone命令来下载：直接在站点根目录下执行下面的命令，即可进行主题的下载，主题有两个版本，稳定版本和最新版本(不定期更新优化)，自主选择版本。
1git clone https://github.com/blinkfox/hexo-theme-matery themes/matery # 稳定版
2git clone -b develop https://github.com/blinkfox/hexo-theme-matery themes/matery #最新版(不定期进行优化更新)
5.2. 主题配置
5.2.1 切换主题
注意：首先需要明白什么是站点配置文件，什么是主题配置文件，站点配置文件就是根目录下的配置文件，比如我的博客文件在D:\blog下，那么站点配置文件就是D:\blog\_config.yml，主题配置文件就是D:\blog\themes\matery\_config.yml。
另外注意，配置文件中的标点符号不要出现中文格式的标点符号，不然运行会出错。
主题下载完成后，将站点配置文件中的theme值修改为你下载主题的文件名，此处为matery，那么值就修改为theme: matery。
一些站点配置文件的其他地方的修改：
1. 语言选择：如果为中文用户，则在language:后添加值zh-CN，如果不修改，默认为英语；
3年嵌入式物联网学习资源整理分享：C语言、Linux开发、数据结构；软件开发，STM32单片机、ARM硬件开发、物联网通信开发、综合项目开发教程资料；笔试面试真题。点击下方插件免费领取↓↓↓嵌入式物联网学习资料（头条）
2. 网址修改：url:的值为你的网址名，如http://xxxx.github.io，如果有域名，则修改为你的域名即可，至于有关域名的修改解析，后面我会说到，这里先不说了。
3. 站点配置文件有个per_page属性，建议修改为6的倍数，这样网站在适应设备时，有较好的显示效果。
5.2.2 新建标签 tags 页面
tags页是用来展示所有标签的页面，如果在你的博客source目录下还没有tags/index.md文件，那么你就需要新建一个，命令如下：
1hexo new page "tags"
编辑你刚刚新建的页面文件/source/tags/index.md，至少需要以下内容：
1---
2title: tags
3date: 2018-09-30 18:23:38
4type: "tags"
5layout: "tags"
6---
5.2.3 新建分类 categories 页面
categories页是用来展示所有分类的页面，如果在你的博客source目录下还没有 categories/index.md文件，那么你就需要新建一个，命令如下：
1hexo new page "categories"
编辑你刚刚新建的页面文件/source/categories/index.md 至少需要以下内容：
1---
2title: categories
3 date: 2018-09-30 17:25:30
4 type: "categories"
5 layout: "categories"
6 ---
5.2.4 新建关于我 about 页面
about页是用来展示关于我和我的博客信息的页面，如果在你的博客source目录下还没有about/index.md文件，那么你就需要新建一个，命令如下：
1hexo new page "about"
编辑你刚刚新建的页面文件/source/about/index.md，至少需要以下内容：
1---
2title: about
3date: 2018-09-30 17:25:30
4type: "about"
5layout: "about"
6---
5.2.5 新建留言板 contact 页面 (可选)
contact页是用来展示留言板信息的页面，如果在你的博客source目录下还没有 contact/index.md文件，那么你就需要新建一个，命令如下：
1hexo new page "contact"
编辑你刚刚新建的页面文件/source/contact/index.md 至少需要以下内容：
1---
2title: contact
3date: 2018-09-30 17:25:30
4type: "contact"
5layout: "contact"
6---
注：本留言板功能依赖于第三方评论系统，请激活你的评论系统才有效果。并且在主题的_config.yml文件中，第19至21行的“菜单”配置，取消关于留言板的注释即可。
5.2.6 新建友情链接 friends 页面 (可选)
friends页是用来展示友情链接信息的页面，如果在你的博客source目录下还没有 friends/index.md文件，那么你就需要新建一个，命令如下：
1hexo new page "friends"
编辑你刚刚新建的页面文件/source/friends/index.md 至少需要以下内容：
1---
2title: friends
3date: 2018-12-12 21:25:30
4type: "friends"
5layout: "friends"
6---
同时，在你的博客source目录下新建_data目录，在_data目录中新建 friends.JSON文件，文件内容如下所示：
1[{
2 "avatar": "http://image.luokangyuan.com/1_qq_27922023.jpg"
3 "name": "码酱"
4 "introduction": "我不是大佬，只是在追寻大佬的脚步"
5 "url": "http://luokangyuan.com/"
6 "title": "前去学习"
7} {
8 "avatar": "http://image.luokangyuan.com/4027734.jpeg"
9 "name": "闪烁之狐"
10 "introduction": "编程界大佬，技术牛，人还特别好，不懂的都可以请教大佬"
11 "url": "https://blinkfox.github.io/"
12 "title": "前去学习"
13} {
14 "name": "过客~励む"
15 "avatar": "https://yafine-blog.cn/medias/avatar.jpg"
16 "url": "https://yafine-blog.cn"
17 "introduction": "你现在的努力，是为了以后有更多的选择"
18 "title": "前去学习"
19} {
20 "name": "小师弟"
21 "avatar": "https://cdn.jsdelivr.net/gh/Yafine/Yafine-imgs/images/xiaoshidi.jpg"
22 "url": "https://www.liuyao-blog.cn"
23 "introduction": "一个喜欢嵌入式的小码农"
24 "title": "前去学习"
25}]
5.2.7 菜单导航配置
5.2.7.1. 配置基本菜单导航的名称、路径url和图标icon.
1.菜单导航名称可以是中文也可以是英文(如：Index或主页)
2.图标icon 可以在Font Awesome 中查找
1menu:
2 Index:
3 url: /
4 icon: fas fa-home
5 Tags:
6 url: /tags
7 icon: fas fa-tags
8 Categories:
9 url: /categories
10 icon: fas fa-bookmark
11 Archives:
12 url: /archives
13 icon: fas fa-archive
14 About:
15 url: /about
16 icon: fas fa-user-circle
17 Friends:
18 url: /friends
19 icon: fas fa-address-book
5.2.7.2. 二级菜单配置方法
如果你需要二级菜单则可以在原基本菜单导航的基础上如下操作
1.在需要添加二级菜单的一级菜单下添加children关键字(如:About菜单下添加children)
2.在children下创建二级菜单的 名称name 路径url和图标icon.
3.注意每个二级菜单模块前要加 -。
4.注意缩进格式
1menu:
2 Index:
3 url: /
4 icon: fas fa-home
5 Tags:
6 url: /tags
7 icon: fas fa-tags
8 Categories:
9 url: /categories
10 icon: fas fa-bookmark
11 Archives:
12 url: /archives
13 icon: fas fa-archive
14 About:
15 url: /about
16 icon: fas fa-user-circle
17 Contact:
18 url: /contact
19 icon: fas fa-comments
20 Friends:
21 url: /friends
22 icon: fas fa-address-book
23 二级菜单写法如下
24 Medias:
25 icon: fas fa-list
26 children:
27 - name: Musics
28 url: /musics
29 icon: fas fa-music
30 - name: Movies
31 url: /movies
32 icon: fas fa-film
33 - name: Books
34 url: /books
35 icon: fas fa-book
36 - name: Galleries
37 url: /galleries
38 icon: fas fa-image
5.2.8 添加emoji表情支持（可选的）
本主题新增了对emoji表情的支持，使用到了hexo-filter-github-emojis的 Hexo 插件来支持 emoji表情的生成，把对应的markdown emoji语法（:: 例如:smile:）转变成会跳跃的emoji表情，安装命令如下：
1npm install hexo-filter-github-emojis --save
在 Hexo 根目录下的_config.yml文件中，新增以下的配置项：
1githubEmojis:
2 enable: true
3 className: github-emoji
4 inject: true
5 styles:
6 customEmojis:
执行hexo clean && hexo g重新生成博客文件，然后就可以在文章中对应位置看到你用emoji语法写的表情了。
5.2.9 代码高亮
由于 Hexo 自带的代码高亮主题显示不好看，所以主题中使用到了 hexo-prism-plugin的 Hexo 插件来做代码高亮，安装命令如下：
1npm i -S hexo-prism-plugin
然后，修改 Hexo 根目录下_config.yml文件中highlight.enable的值为 false，并新增prism插件相关的配置，主要配置如下：
1prism_plugin:
2 mode: 'preprocess' # realtime/preprocess
3 theme: 'tomorrow'
4 line_number: false # default false
5 custom_css:
5.2.10 搜索
本主题中还使用到了hexo-generator-search的Hexo插件来做内容搜索，安装命令如下：
1npm install hexo-generator-search --save
在 Hexo 根目录下的_config.yml文件中，新增以下的配置项：
1search:
2 path: search.xml
3 field: post
5.2.11 中文链接转拼音（可选的）
如果你的文章名称是中文的，那么 Hexo 默认生成的永久链接也会有中文，这样不利于 SEO，且gitment评论对中文链接也不支持。我们可以用 hexo-permalink-pinyin Hexo 插件使在生成文章时生成中文拼音的永久链接。
安装命令如下：
1npm i hexo-permalink-pinyin --save
在 Hexo 根目录下的 _config.yml 文件中，新增以下的配置项：
1permalink_pinyin:
2 enable: true
3 separator: '-' # default: '-'
5.2.12 文章字数统计插件（可选的）
如果你想要在文章中显示文章字数、阅读时长信息，可以安装hexo-wordcount 安装命令如下：
1npm i --save hexo-wordcount
然后只需在本主题下的_config.yml 文件中，激活以下配置项即可：
1wordCount:
2 enable: false # 将这个值设置为 true 即可.
3 postWordCount: true
4 min2read: true
5 totalCount: true
5.2.13 添加 RSS 订阅支持（可选的）
本主题中还使用到了hexo-generator-feed的Hexo插件来做RSS，安装命令如下：
1npm install hexo-generator-feed --save
在 Hexo 根目录下的_config.yml文件中，新增以下的配置项：
1feed:
2 type: atom
3 path: atom.xml
4 limit: 20
5 hub:
6 content:
7 content_limit: 140
8 content_limit_delim: ' '
9 order_by: -date
执行hexo clean && hexo g重新生成博客文件，然后在public文件夹中即可看到atom.xml文件，说明你已经安装成功了。
5.2.14 添加 DaoVoice 在线聊天功能（可选的）
前往DaoVoice官网注册并且获取app_id，并将app_id填入主题的_config.yml文件中
5.2.15 添加 Tidio 在线聊天功能（可选的）
前往Tidio官网注册并且获取Public Key，并将 Public Key填入主题的_config.yml文件中。
5.2.16 修改页脚
页脚信息可能需要做定制化修改，而且它不便于做成配置信息，所以可能需要你自己去再修改和加工。修改的地方在主题文件的/layout/_partial/footer.ejs文件中，包括站点、使用的主题、访问量等。
5.2.17 修改社交链接
在主题的_config.yml文件中，默认支持QQ、GitHub和邮箱等的配置，你可以在主题文件的/layout/_partial/social-link.ejs文件中，新增、修改你需要的社交链接地址，增加链接可参考如下代码
1<% if (theme.socialLink.github) { %>
2 <a href="<%= theme.socialLink.github %>" class="tooltipped" target="_blank" data-tooltip="访问我的GitHub" data-position="top" data-delay="50">
3 <i class="fab fa-github"></i>
4 </a>
5<% } %>
其中，社交图标（如：fa-github）你可以在 Font Awesome中搜索找到。以下是常用社交图标的标识，供你参考：
- facebook: fab fa-facebook
- Twitter: fab fa-twitter
- Google-plus: fab fa-google-plus
- Linkedin: fab fa-linkedin
- Tumblr: fab fa-tumblr
- Medium: fab fa-medium
- Slack: fab fa-slack
- Sina Weibo: fab fa-weibo
- Wechat: fab fa-weixin
- QQ: fab fa-qq
- Zhihu: fab fa-zhihu
注意: 本主题中使用的Font Awesome版本为5.11.0。
5.2.18 修改打赏的二维码图片
在主题文件的source/medias/reward文件中，你可以替换成你的的微信和支付宝的打赏二维码图片。
5.2.19 配置音乐播放器（可选的）
要支持音乐播放，就必须开启音乐的播放配置和音乐数据的文件。
首先，在你的博客source目录下的_data目录（没有的话就新建一个）中新建 musics.json文件，文件内容如下所示：
1[{ "name": "五月雨变奏电音"
2 "artist": "AnimeVibe"
3 "url": "http://xxx.com/music1.mp3"
4 "cover": "http://xxx.com/music-cover1.png"
5} {
6 "name": "Take me hand"
7 "artist": "DAISHI DANCE Cecile Corbel"
8 "url": "/medias/music/music2.mp3"
9 "cover": "/medias/music/cover2.png"
10} {
11 "name": "Shape of You"
12 "artist": "J.Fla"
13 "url": "http://xxx.com/music3.mp3"
14 "cover": "http://xxx.com/music-cover3.png"
15}]
注：以上 JSON 中的属性：name、artist、url、cover分别表示音乐的名称、作者、音乐文件地址、音乐封面。
然后，在主题的_config.yml配置文件中激活配置即可：
1# Whether to display the musics.
2# 是否在首页显示音乐.
3music:
4 enable: true
5 showTitle: true
6 title: 听听音乐
7 fixed: false # 开启吸底模式
8 autoplay: false # 是否自动播放
9 theme: '#42b983'
10 loop: 'all' # 音频循环播放 可选值: 'all' 'one' 'none'
11 order: 'list' # 音频循环顺序 可选值: 'list' 'random'
12 preload: 'auto' # 预加载，可选值: 'none' 'metadata' 'auto'
13 volume: 0.7 # 默认音量，请注意播
原文作者：果果小师弟
原文链接;https://mp.weixin.qq.com/s/GmhopoSX_ECWFcZFRmXaGw
原文标题：Github Hexo博客搭建小白教程（三）
