Hexo主体设置知识点

介绍Hexo一些基本设置，比如分类，标签，作者，简要概述等等以及MarkDown的写法

1.Hexo创建文章、标签、分类的Front-matter方法 Ⅰ   Front-matter Ⅱ

Front-matter 是md文件最上方以 — 分隔的区域，用于指定个别文件的变量

其实Front-matter就是在\Hexo\source_posts下的.md文件中书写文章标题，上传时间，分类名，标签名等等

字段	含义	值类型	默认值
layout	布局模版	String	-
title	标题	String	-
date	创建时间	Date	文件创建时间
description	页面描述、摘要	String	-
cover	是否显示封面	Bool	true

2.Markdown标题页的写法

    ---
    layout: 页面布局（配合主题文档使用）
    title: 文章名称
    date: 文章日期
    comments: 文章是否开启评论
    photos: 文章封面图（仅部分主题支持）
    tags: 
      - 文章标签一
      - 文章标签二
    categories: # 文章分类（文章分类等级）
                - 父分类
                - 子分类
                - 孙分类
    description: 文章描述，即要在首页显示的摘要（仅部分主题支持）
    ---

    这里是摘要   
        
    这里是正文

    注意：description 和  方式显示摘要二选一即可，部分主题不支持description，
    每个配置英文冒号后面要空一格，不同主题配置有所差异，具体要参考主题文档

3.md文件的基本写法

【Markdown写法大全】

3.1. ``` 代码段 ``` : 表示以原格式展示代码片段。比如

$(function () {
    ......
     //鼠标进入的时候,其他的li标签透明度：0.5
    $(".wrap li").hover(function() {
        $(this).siblings().stop().fadeTo(400, 0.5);  //.stop():停止所有在指定元素上正在运行的动画。
    }, function() {
        // 鼠标离开，其他li 透明度改为 1
        $(this).siblings().stop().fadeTo(400, 1);
    });
    console.log($('.attr a').prop('href'));
    console.log($('.attr a').prop('title'));
    console.log($('input:checkbox').attr('id'));
    console.log($('.office p:eq(0)').scrollTop());
})

3.2. <img src=”url” width=” “>

   表示在md文件中展示图片，若不想破坏图片原格式，就只需要写width或者height其中一个，另一个会自适应变化

3.3. 文本修饰:粗体，斜体…

   粗体文本用两个*或_包含，斜体文本用两个_或*包含

3.4. 表格(注意其格式)

语法说明：

1. 第一行为表头，第二行分隔表头和主体部分，第三行开始每一行为一个表格行。
2. 列于列之间用管道符|隔开。原生方式的表格每一行的两边也要有管道符。
3. 第二行还可以为不同的列指定对齐方向。默认为左对齐，在-右边加上:就右对齐。

| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned | $1600 |
| col 2 is      | centered      |   $12 |
| zebra stripes | are neat      |    $1 |

3.5. 颜色RGB和字体以及背景颜色

<font face="Tahoma">这是一串Tahoma字体</font><br/>
<font face="黑体">这是一串黑体字</font><br/>
<font face="微软雅黑">这是一串微软雅黑</font><br/>
<font face="STCAIYUN">这是一串华文彩云</font><br/>
<font color=#00ced1 size=7 face="黑体">背景色+字体+字的size</font><br/>
<font color=#00ffff size=72>颜色设置</font><br/>
<font color=gray size=72>灰色处理</font><br/>
<table><tr><td bgcolor=#bfe1f1>背景色是：#bfe1f1</td></tr></table>

Size：规定文本的尺寸大小。可能的值：从 1 到 7 的数字。浏览器默认值是 3

这是一串Tahoma字体

这是一串黑体字

这是一串微软雅黑

这是一串华文彩云

背景色+字体+字的size

颜色设置

灰色处理

3.6. 转义字符

<br> : 换行

\ : 转义字符，原生字符，不加修饰

&nbsp; : 空格

3.7 每一篇博文设置图片

只需要在文章前面配置 photos 关键字即可，若没有这种配置，可以选择在正文插入图片，然后使用 将图片显示在摘要里

3.8 Markdown的todo list写法

代码：

近期任务安排:
- [x] 整理Markdown手册
- [ ] 改善项目
   - [x] 优化首页显示方式
   - [x] 修复闪退问题
   - [ ] 修复视频卡顿
- [ ] A3项目修复
   - [x] 修复数值错误

显示效果：

3.9 hexo-matrix主题支持图片缩放设置

<fancybox>图片设置</fancybox>

3.10 列表嵌套

上一级和下一级之间敲三个空格即可

+ 一级无序列表内容

   * 二级无序列表内容(三个空格)
   * 二级无序列表内容
   * 二级无序列表内容

+ 一级无序列表内容

   1. 二级有序列表内容
   2. 二级有序列表内容
   3. 二级有序列表内容

4.Hexo的搜索search功能设置

问题描述：

      在我的博客中点击search，输入相关关键字后，点击查询到的相关文章，会出现404错误

解决方法：

1.检查是否安装文档要求正确的安装了依赖包。
2.检查根目录配置文件是否有search字段冲突（我的根目录配置文件中没有search字段）。
3.检查我们的主题（我使用的是Material X主题）的配置文件是否开启search功能

# 搜索配置
search:
  enable: true
  service: hexo
  # google
  google_api_key:
  google_engine_id:
  # algolia
  algolia_app_id:
  algolia_api_key:
  algolia_index_name:
  # azure
  azure_service_name:
  azure_index_name:
  azure_query_key:
  # baidu
  baidu_api_id:

4.这是最容易忽略的，但往往也是问题出现的源头，请检查根目录配置文件中的链接是否正确，如：

url: https://fioralove.github.io
# 这里似乎存在一个bug，推荐填写GitHub Page的访问地址，不要使用自己在阿里云以及其它的域名注册服务商所提供的地址
# 比如我在阿里云所注册的https:AhriLove.top，填上依旧会出现404错误
root: /

5.封面轮播图

封面幻灯片轮播图片怎么引入本地的照片？？
修改主题下_config.yml文件，里面有个banner改一下，多加几行即可

6.front-matter设置

front-matter是指两个\---之间的内容
\---
title: Javascript篇章四：快速入门
// 小图标
icons: [fas fa-fire accent]
date: 2019-11-21
toc: true #是否显示文章目录
categories:  #分类
    - javascript
// 是否显示封面    
cover: true
tags:   #标签
// 是否置顶文章
top: true
// 文章右边的音乐块
music:
  enable: true      # true（文章内和文章列表都显示） internal（只在文章内显示）
  server: netease   # netease（网易云音乐）tencent（QQ音乐） xiami（虾米） kugou（酷狗）
  type: song        # song （单曲） album （专辑） playlist （歌单） search （搜索）
  id: 26664345      # 歌曲/专辑/歌单 ID
// 作者相关信息块
author:
  name: 作者
  avatar: https://img.vim-cn.com/a1/d53c11fb5d4fd69529bc805d385fe818feb3f6.png
  url: https://baidu.com
meta:
  header: \[title, author, date, categories, counter, top]
  footer: \[updated, tags, share]
---


// 文章描述
<!-- more -->