├── LICENSE ├── README.md ├── expert-zh-cn.md ├── donate-zh-cn.md ├── expert-en.md ├── start-zh-cn.md ├── contribution-zh-cn.md ├── contribution-en.md ├── donate-en.md ├── start-en.md ├── compose-zh-cn.md ├── services-zh-cn.md ├── services-en.md ├── compose-en.md ├── intro-zh-cn.md └── intro-en.md /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 Viosey 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Material Theme Docs 2 | 3 | [Material Theme](https://material.viosey.com/) 4 | 5 | [Material Theme - Github](https://github.com/viosey/hexo-theme-material) 6 | 7 | ## 开始使用 Start 8 | [开始使用 markdown](https://github.com/viosey/material-theme-docs/blob/master/start-zh-cn.md) 9 | 10 | [Start markdown](https://github.com/viosey/material-theme-docs/blob/master/start-en.md) 11 | 12 | ## 主题介绍 Intro 13 | [主题介绍 markdown](https://github.com/viosey/material-theme-docs/blob/master/intro-zh-cn.md) 14 | 15 | [Intro markdown](https://github.com/viosey/material-theme-docs/blob/master/intro-en.md) 16 | 17 | ## 开始创作 Compose 18 | [开始创作 markdown](https://github.com/viosey/material-theme-docs/blob/master/compose-zh-cn.md) 19 | 20 | [Compose markdown](https://github.com/viosey/material-theme-docs/blob/master/compose-en.md) 21 | 22 | ## 进阶设定 Expert 23 | [进阶设定 markdown](https://github.com/viosey/material-theme-docs/blob/master/expert-zh-cn.md) 24 | 25 | [Expert markdown](https://github.com/viosey/material-theme-docs/blob/master/compose-en.md) 26 | 27 | ## 集成服务 Services 28 | [集成服务 markdown](https://github.com/viosey/material-theme-docs/blob/master/services-zh-cn.md) 29 | 30 | [Services markdown](https://github.com/viosey/material-theme-docs/blob/master/services-en.md) 31 | -------------------------------------------------------------------------------- /expert-zh-cn.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 进阶设定 3 | version: 1.4.0 4 | permalink: expert 5 | id: 4 6 | lang: zh-cn 7 | --- 8 | 9 | > 以下部分可能影响到「Material」的正常运作,请务必先了解这些设定背后的相关知识。 10 | 11 | ----- 12 | 13 | ## 添加自定义代码 14 | 15 | 如果想要在站点添加自定义 `font-face` 或者统计代码(例如 `Google Analytics`)。 16 | 17 | 需要在 hexo 目录下的 `source` 文件夹内创建一个名为 `_data`(禁止改名)的文件夹,并在文件内创建一个名为 head.yml 的文件。 18 | 19 | 单个代码格式为: 20 | 21 | ```yml 22 | Name: 23 | "put your code here" 24 | ``` 25 | 26 | 代码将显示在 `` 之前, 27 | `Name` 将作为注释显示在代码上方。 28 | 29 | ## Material 图标 30 | 31 | 用于自定义例如 `dropdown: icon` 的图标。 32 | 33 | [Material icons](https://material.io/icons/) 34 | 35 | ## 代码高亮样式 36 | 37 | 从 `1.3.0` 版本开始,您可以使用 `hexo-prism-plugin` 进行代码染色,具体文档请参阅 [Hexo-Prism-Plugin 插件文档](https://github.com/ele828/hexo-prism-plugin) 38 | 从 `1.4.5` 版本开始,您可以使用主题内置的 `Google Prettify` 进行代码染色 39 | 40 | ## 使用 CDN 41 | 42 | ### MaterialCDN 43 | 44 | 现在你可以使用 CDN 来加速 Material 主题引用的静态文件,只需要在 `materialcdn` 中填入你的 CDN 的 URL 路径即可。默认为空、从网站源站加载。 45 | 46 | > **注意!填入的 URL 末尾不需要带 `/` !** 47 | 48 | 例如,您可以这么配置: 49 | 50 | ```yaml 51 | vendors: 52 | materialcdn: https://materialcdn.nfz.moe/hexo/1.3.2 53 | ``` 54 | 55 | ------ 56 | 57 | Material 主题引用了下述第三方库,你可以使用公共 CDN 库加载它们。 58 | Material 主题使用的第三方库包括: 59 | 60 | ### jQuery 2.2.0 61 | ### FontAwesome 4.5.0 62 | 63 | 引用于 `layout/_partial/head.ejs` 64 | 65 | ### Material Icons 3.0.1 66 | 67 | > 你需要填入 css 的 URI,如:`https://cdn.bootcss.com/font-awesome/4.5.0/css/font-awesome.min.css` 68 | 69 | ### MathJax 2.7.0-2.7.1 70 | 71 | >你不需要在 URI 中带上 MathJax 的设定。我们已经加好了。 72 | 73 | ### nprogress 0.2.0 74 | ### Prettify r298 75 | 76 | > 只加载 `prettify.js`。代码高亮的主题将从本地或者 MaterialCDN 中加载。 77 | 78 | ### Material Icons 3.0.1 79 | 80 | > 你需要填入 css 的 URI,如:`https://cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.min.css` 81 | -------------------------------------------------------------------------------- /donate-zh-cn.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 捐赠 3 | version: null 4 | permalink: donate 5 | id: 1 6 | lang: zh-cn 7 | --- 8 | ## 捐赠是什么? 9 | 10 | 捐赠是国外用来支持开发者和资源贡献者的一种常见的方式。这些开发者不通过加入广告或者进行第三方推广获得收入,仅通过使用的用户自己主动捐赠来表达对开发者的感谢。 11 | 12 | ## 为什么要捐赠? 13 | 14 | 我(viosey)把开发 Material 主题作为我的业余爱好,同时我对此乐此不疲。但是,这毕竟让我付出了时间成本、设备成本,同时为了 Material 文档和 Demo 的稳定访问也使用了 CDN。为了平衡宽带,服务器,CDN 的使用费用,因此,我希望使用捐赠的方式来平衡以上活动之中的投入。 15 | 16 | 所以如果您觉得我制作的 主题、我写的教程、我维护的项目或者提供的其它资源对你有帮助,您可以对我进行捐赠。捐赠是自愿的,非强制性的,捐赠多少也都没关系;您的支持就是对我最大的支持! 17 | 18 | ## 捐赠的作用? 19 | 20 | 当一个非盈利项目仅仅依靠兴趣的支撑,很难确定它还能走多远。所有的捐赠都将用于提升我的环境配置,维持网站的运行和提高我的积极性。 21 | 22 | ## 捐赠的渠道? 23 | 24 | - [PayPal](https://www.paypal.me/viosey) 25 | - **支付宝:** 26 | 27 | - **微信支付:** 28 | 29 | - **比特币:** 30 | 31 | 32 | ## 捐赠者名单 33 | 34 | 十分感谢以下捐赠者给予的打赏: 35 | >微信打赏请留言备注昵称 36 | 37 | | 捐赠 | 昵称 | 日期 | 38 | | ---- | --- | ---- | 39 | | ¥ 100.00 CNY | Kevin Guo | 06.27 | 40 | | $ 20.00 SGD | Sun Ximeng | 02.15 | 41 | | ¥ 50.00 CNY | 林固 | 04.01 | 42 | | ¥ 25.00 CNY | 一个老白 | 02.26 | 43 | | ¥ 20.00 CNY | 佚名 | 02.18 | 44 | | ¥ 20.00 CNY | 佚名 | 03.07 | 45 | | ¥ 14.20 CNY | Lweiis | 04.04 | 46 | | ¥ 12.00 CNY | 佚名 | 04.24 | 47 | | ¥ 10.66 CNY | L RoGER | 03.20 | 48 | | ¥ 10.24 CNY | 佚名 | 03.19 | 49 | | ¥ 10.24 CNY | 代码是种信仰 | 06.02 | 50 | | ¥ 10.24 CNY | wei | 06.09 | 51 | | ¥ 10.00 CNY | 佚名 | 01.31 | 52 | | ¥ 10.00 CNY | 佚名 | 02.21 | 53 | | ¥ 10.00 CNY | 佚名 | 02.25 | 54 | | ¥ 10.00 CNY | daoSs | 03.30 | 55 | | ¥ 10.00 CNY | TonnyL | 03.31 | 56 | | ¥ 6.55 CNY | Mr.Chen | 04.21 | 57 | | ¥ 6.66 CNY | splub | 05.09 | 58 | | ¥ 5.00 CNY | 神楽坂立音 | 59 | | ¥ 5.00 CNY | Before_summ | 60 | 61 | ## 捐赠前要考虑什么 ? 62 | 63 | 这个渠道的存在并不意味着你必须捐赠。你也可以继续使用而不做任何事。 64 | 65 | 你的捐赠意味着你对我过去所做的表示感谢,而不是表达对未来的期望。但你的捐赠会提高我的积极性和设备配置让我努力把手头上的事做的更好。 66 | 67 | 我会维护一份名单以感谢所有的捐赠者。正如我所说,捐赠是一个向我表示感谢的方式。 -------------------------------------------------------------------------------- /expert-en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Expert 3 | version: 1.4.0 4 | permalink: en/expert 5 | id: 4 6 | lang: en 7 | --- 8 | 9 | ## Add custom code 10 | 11 | If you want to add custom code, like `font-face` or statistical code (such as `Google Analytics`) to your site, you need to create a folder named `_data` (no rename) in the `source` folder in your site directory. 12 | 13 | Then create a file called `head.yml` in the file: 14 | 15 | ```yaml 16 | Name: 17 | "Put your code here" 18 | ``` 19 | 20 | The code will be displayed before `` tag. `Name` will appear as a comment above the code. 21 | 22 | ## Material icons 23 | 24 | The list of icon used to customized the dropdown or page buttons is available [here](https://material.io/icons/). 25 | 26 | ## Code highlight 27 | 28 | From `Version 1.3.0`, you can use `hexo-prism-plugin` to highlight your codes, visit [Hexo-Prism-Plugin Github](https://github.com/ele828/hexo-prism-plugin) to learn more. 29 | 30 | From `Version 1.4.5`, Material built in the `Google Prettify` for code_highlight. 31 | 32 | ## Files Vendors 33 | 34 | This is about how to use CDN to load files. 35 | 36 | ### MaterialCDN 37 | 38 | Material Theme can using private CDN to load of static files. 39 | Default(empty) will load the files from the origin server. 40 | 41 | > **ATTENTION! the url you fill in should with protocol and without `/` !** 42 | 43 | Here is an example of configuration. 44 | 45 | ```yaml 46 | vendors: 47 | materialcdn: https://materialcdn.nfz.moe/hexo/1.3.2 48 | ``` 49 | ----- 50 | 51 | Material Theme has used third party library below. You can fill in the with the uri of the files, then you can use public cdn to load them. 52 | 53 | ### jQuery 2.2.0 54 | ### Fontawesome 4.5.0 55 | 56 | > you should filled in with a uri of css, such as: `https://cdn.bootcss.com/font-awesome/4.5.0/css/font-awesome.min.css` 57 | 58 | ### MathJax 2.7.0-2.7.1 59 | 60 | > you needn't add query configuration in your uri. We have already done it for you. 61 | 62 | ### nprogress 0.2.0 63 | ### Prettify r298 64 | 65 | > only for the `prettify.js`. theme css files will load from your origin server or MaterialCDN 66 | 67 | ### Material Icons 3.0.1 68 | 69 | > you should filled in with a uri of css, such as: `https://cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.min.css` 70 | -------------------------------------------------------------------------------- /start-zh-cn.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 开始使用 3 | version: 1.4.0 4 | permalink: start 5 | id: 1 6 | lang: zh-cn 7 | --- 8 | 9 | 在使用 「Material」主题之前,请仔细阅读 Hexo 的[官方文档](https://hexo.io/zh-cn/docs/index.html),完成对 Hexo 的安装和基本的配置。 10 | 11 | > 在本文档中,我们假定你已经成功安装了 Hexo,并根据 Hexo 的文档创建了一个站点,并**完成了基本的设置**。 12 | 13 | 在 Hexo 中,通常有两份配置文件,一个是站点根目录下的 `_config.yml`;另外一个是主题目录下的 `_config.yml`。 14 | 为了描述方便,在以下说明中,将前者称为 **站点配置文件**,后者称为 **主题配置文件**。 15 | 16 | ## 安装「Material」 17 | 18 | Hexo 安装主题的方式非常简单,只需要将主题文件放置于站点目录的 `themes` 目录下,然后修改下配置文件即可。 19 | Material 主题提供有 `Github` 和 `NPM` 两种下载方式。 20 | 21 | ### Github 22 | 23 | > 你可以在 Github 下载 [稳定的发布版本](https://github.com/viosey/hexo-theme-material/releases)。 24 | 25 | ### NPM 26 | 27 | ```bash 28 | npm install hexo-material 29 | ``` 30 | 31 | 该方式会把 Material 主题下载到 `hexo` 目录下的 `node_modules` 文件夹中。 32 | 找到 `hexo-material` 文件夹,然后把里面的全部文件复制到 `themes` 目录中的 `Material` 主题文件夹里。 33 | 34 | ## 启用「Material」 35 | 36 | 克隆完成后,修改主题文件夹名称,将其改为 `material` 。 37 | 然后打开 **站点配置文件**,找到 `theme` 字段,并将其值更改为 `material` 。 38 | 39 | > 文件夹名称可自由修改,并不是唯一的,只需 `theme` 字段与之对应即可。 40 | 41 | 为防止造成冲突,主题以 `_config.template.yml` 文件取代 `_config.yml` 文件,用以参考配置。 42 | **需要手动将 `material` 文件夹中的 `_config.template.yml` 复制一份并重命名为 `_config.yml`**。 43 | 44 | 现在,运行 `hexo s --debug` 并访问 `http://localhost:4000`,确保站点正确运行。 45 | 46 | ## 更新「Material」 47 | 48 | ### NPM 49 | 50 | NPM 更新有两种方式: 51 | 52 | #### npm-update 53 | 54 | ```bash 55 | npm update hexo-material 56 | ``` 57 | 58 | 然后将文件复制到 `Material` 主题文件夹中。 59 | 60 | #### npm-check 61 | [npm-check](https://www.npmjs.com/package/npm-check) 是用来检查 npm 依赖包是否有更新,错误以及不在使用的,我们也可以使用 npm-check 进行包的更新。 62 | 63 | 安装 npm-check: 64 | 65 | ```bash 66 | npm install -g npm-check 67 | ``` 68 | 69 | 检查 npm 包的状态: 70 | 71 | ```bash 72 | npm-check hexo-material 73 | ``` 74 | 使用空格键可以选择需要处理的包,回车直接进行处理。 75 | 76 | ### Github 77 | 78 | 你可以在[版本发布页](https://github.com/viosey/hexo-theme-material/releases)下载最新的主题。 79 | 80 | 81 | ## 基本设定 82 | 83 | ### 语言 84 | 85 | 编辑 **站点配置文件**,将 `language` 设置成你所需要的语言。 86 | 可用的语言如下: 87 | 88 | - العَرَبِيَّة (ar) 89 | - Deutsch (de) 90 | - English (en) 91 | - Español (es) 92 | - Français (fr) 93 | - 日本語 (ja) 94 | - Malay (ms) 95 | - Portuguese (Brazil) (pt-BR) 96 | - 简体中文 (zh-CN) 97 | - 繁體中文 (zh-TW) 98 | 99 | 100 | >例如:选用繁體中文,则配置为: 101 | > 102 | ```yml 103 | language: zh-TW 104 | ``` 105 | -------------------------------------------------------------------------------- /contribution-zh-cn.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 参与贡献 3 | version: 1.4.0 4 | permalink: contributions 5 | id: 6 6 | lang: zh-cn 7 | --- 8 | 9 | 欢迎各种形式的贡献,包括但不限于优化,添加功能,文档 & 代码的改进。期待您的 `Pull Request`。 10 | 11 | 在参与贡献之前,请阅读[项目贡献 Wiki](https://github.com/viosey/hexo-theme-material/wiki),了解如何为 Material 主题贡献。 12 | 13 | [现在,Open a Pull Request!](https://github.com/viosey/hexo-theme-material/pulls) 14 | 15 | ## 主要协助开发者 16 | 17 | [Github - Contributors](https://github.com/viosey/hexo-theme-material/graphs/contributors) 18 | 19 | - [pidupuis](https://github.com/pidupuis) 20 | - [neoFelhz](https://github.com/neoFelhz) 21 | - [cubesky](https://github.com/cubesky) 22 | - [AkarinServer](https://github.com/AkarinServer) 23 | - [EYHN](https://github.com/EYHN) 24 | 25 | ## 功能贡献者 26 | 27 | - [Simonsmh](https://github.com/simonsmh) 28 | 29 | feat(analytics): add analytics id function [#147](https://github.com/viosey/hexo-theme-material/pull/147) 30 | feat(ui): custom elevation [#158](https://github.com/viosey/hexo-theme-material/pull/158) 31 | feat(sidebar_footer_image): add sidebar footer image config [#160](https://github.com/viosey/hexo-theme-material/pull/160) 32 | 33 | - [lslvxy](https://github.com/lslvxy) 34 | 35 | feat(comment):add changyan comment system [#247](https://github.com/viosey/hexo-theme-material/pull/247) 36 | 37 | - [pandecheng](https://github.com/pandecheng36) 38 | 39 | feat(footer_sns): add svg support [#231](https://github.com/viosey/hexo-theme-material/pull/231) 40 | feat(footer_sns): update svg icon for UPYUN [#248](https://github.com/viosey/hexo-theme-material/pull/248) 41 | 42 | - [ghouzenyan](https://github.com/ghouzenyan) 43 | 44 | feat(timeline): add timeline layout [#253](https://github.com/viosey/hexo-theme-material/pull/253) 45 | 46 | - [long2ice](https://github.com/long2ice) 47 | 48 | fix(comment):duoshuo comment counts display issues and some other errors [#190](https://github.com/viosey/hexo-theme-material/pull/190) 49 | 50 | - [Kitcham](https://github.com/Kitcham) 51 | 52 | feat(comments): add "Disqus_click_to_load" to improve in-GFW-users [#182](https://github.com/viosey/hexo-theme-material/pull/182) 53 | 54 | - [superalsrk](https://github.com/superalsrk) 55 | 56 | feat(mathjax): mathjax support [#44](https://github.com/viosey/hexo-theme-material/pull/44) 57 | 58 | ## i18n 国际化贡献者 59 | 60 | - [ckt0r](https://github.com/ckt0r) - French 61 | - [iocast](https://github.com/iocast) - German 62 | - [rkb81](https://github.com/rkb81) - Brazil 63 | - [Fcmamr](https://github.com/Fcmam5) - Arabic -------------------------------------------------------------------------------- /contribution-en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Contributions 3 | version: 1.4.0 4 | permalink: en/contributions 5 | id: 6 6 | lang: en 7 | --- 8 | 9 | All kinds of contributions (enhancements, new features, documentation & code improvements are welcome. 10 | 11 | Before you start your contributing, please read the [Contributing Rules Wiki](https://github.com/viosey/hexo-theme-material/wiki) first. 12 | 13 | [Open a Pull Request Here!](https://github.com/viosey/hexo-theme-material/pulls) 14 | 15 | ## Main Contributors 16 | 17 | [Github - Contributors](https://github.com/viosey/hexo-theme-material/graphs/contributors) 18 | 19 | - [pidupuis](https://github.com/pidupuis) 20 | - [neoFelhz](https://github.com/neoFelhz) 21 | - [cubesky](https://github.com/cubesky) 22 | - [AkarinServer](https://github.com/AkarinServer) 23 | - [EYHN](https://github.com/EYHN) 24 | 25 | ## Feature Contributors 26 | 27 | - [Simonsmh](https://github.com/simonsmh) 28 | 29 | feat(analytics): add analytics id function [#147](https://github.com/viosey/hexo-theme-material/pull/147) 30 | feat(ui): custom elevation [#158](https://github.com/viosey/hexo-theme-material/pull/158) 31 | feat(sidebar_footer_image): add sidebar footer image config [#160](https://github.com/viosey/hexo-theme-material/pull/160) 32 | 33 | - [lslvxy](https://github.com/lslvxy) 34 | 35 | feat(comment):add changyan comment system [#247](https://github.com/viosey/hexo-theme-material/pull/247) 36 | 37 | - [pandecheng](https://github.com/pandecheng36) 38 | 39 | feat(footer_sns): add svg support [#231](https://github.com/viosey/hexo-theme-material/pull/231) 40 | feat(footer_sns): update svg icon for UPYUN [#248](https://github.com/viosey/hexo-theme-material/pull/248) 41 | 42 | - [ghouzenyan](https://github.com/ghouzenyan) 43 | 44 | feat(timeline): add timeline layout [#253](https://github.com/viosey/hexo-theme-material/pull/253) 45 | 46 | - [long2ice](https://github.com/long2ice) 47 | 48 | fix(comment):duoshuo comment counts display issues and some other errors [#190](https://github.com/viosey/hexo-theme-material/pull/190) 49 | 50 | - [Kitcham](https://github.com/Kitcham) 51 | 52 | feat(comments): add "Disqus_click_to_load" to improve in-GFW-users [#182](https://github.com/viosey/hexo-theme-material/pull/182) 53 | 54 | - [superalsrk](https://github.com/superalsrk) 55 | 56 | feat(mathjax): mathjax support [#44](https://github.com/viosey/hexo-theme-material/pull/44) 57 | 58 | ## i18n Contributors 59 | 60 | - [ckt0r](https://github.com/ckt0r) - French 61 | - [iocast](https://github.com/iocast) - German 62 | - [rkb81](https://github.com/rkb81) - Brazil 63 | - [Fcmamr](https://github.com/Fcmam5) - Arabic -------------------------------------------------------------------------------- /donate-en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Donate 3 | version: null 4 | permalink: en/donate 5 | id: 1 6 | lang: en 7 | --- 8 | ## What is a donation? 9 | 10 | Donation is a common way to support developers and contributors. These developers do not add advertising or third-party promotion to obtain income, only through the use of the user's own initiative to express their gratitude to the developer. 11 | 12 | ## Why donate? 13 | 14 | I (viosey) develop the Material theme as my hobby, and I never bored. However, this, after all, I paid a time cost, equipment costs, and for the stability of the Material document and Demo visit also used the CDN. In order to balance the costs of broadband, servers and CDNs, I would like to use donations to balance the costs of these activities. 15 | 16 | So if you feel that the theme I created, the tutorial I wrote, the projects I maintain, or other resources provided are helpful to you, you can donate to me. Donation is voluntary, non-mandatory, donated how much it does not matter; your support is my greatest support! 17 | 18 | ## The role of donations? 19 | 20 | When a nonprofit project depends only on the support of interest, it is difficult to determine how far it can go. All donations will be used to upgrade my environment configuration, maintain the site's operation and improve my enthusiasm. 21 | 22 | ## Donation ways? 23 | 24 | - [PayPal](https://www.paypal.me/viosey) 25 | - **Alipay: ** 26 | 27 | - **Wechat Pay: ** 28 | 29 | - **Bitcoin:** 30 | 31 | 32 | ## Donors list 33 | 34 | Thanks for the following donors: 35 | 36 | | Donation | Name | Date | 37 | | ---- | --- | ---- | 38 | | ¥ 100.00 CNY | Kevin Guo | 06.27 | 39 | | $ 20.00 SGD | Sun Ximeng | 02.15 | 40 | | ¥ 50.00 CNY | 林固 | 04.01 | 41 | | ¥ 25.00 CNY | 一个老白 | 02.26 | 42 | | ¥ 20.00 CNY | Unknow | 02.18 | 43 | | ¥ 20.00 CNY | Unknow | 03.07 | 44 | | ¥ 14.20 CNY | Lweiis | 04.04 | 45 | | ¥ 12.00 CNY | Unknow | 04.24 | 46 | | ¥ 10.66 CNY | L RoGER | 03.20 | 47 | | ¥ 10.24 CNY | Unknow | 03.19 | 48 | | ¥ 10.24 CNY | 代码是种信仰 | 06.02 | 49 | | ¥ 10.24 CNY | wei | 06.09 | 50 | | ¥ 10.00 CNY | Unknow | 01.31 | 51 | | ¥ 10.00 CNY | Unknow | 02.21 | 52 | | ¥ 10.00 CNY | Unknow | 02.25 | 53 | | ¥ 10.00 CNY | daoSs | 03.30 | 54 | | ¥ 10.00 CNY | TonnyL | 03.31 | 55 | | ¥ 5.00 CNY | 神楽坂立音 | 56 | | ¥ 5.00 CNY | Before_summ | 57 | 58 | ## What to consider before giving? 59 | 60 | The existence of this channel does not mean you have to donate. You can also continue to use without doing anything. 61 | 62 | Your donation means that you have expressed gratitude for what I have done in the past, rather than expressing your expectations for the future. But your donation will increase my enthusiasm and equipment configuration so I try to do better at hand. 63 | 64 | I will maintain a list to thank all the donors. As I said, donation is a way to thank me. -------------------------------------------------------------------------------- /start-en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Start 3 | version: 1.4.0 4 | permalink: en/start 5 | id: 1 6 | lang: en 7 | --- 8 | 9 | 10 | Before using "Material", please read the [Hexo documentions](https://hexo.io/docs/index.html) and finish the installation and configurations of Hexo. 11 | 12 | > In this docs, we suppose you just succefully installed the Hexo, and already configure your new site. 13 | 14 | In Hexo, there are usually two configuration files, both called `_config.yml`. The first one is in the site root directory; the other is in the theme directory. 15 | For convenience of description, in the following description, the former is referred to as the **site config** and the latter as the **theme config**. 16 | 17 | ## Installing "Material" 18 | 19 | Installation of an Hexo theme is quite simple. You simply need to put the theme directory inside the `themes` directory of your site and modify the theme config. 20 | There are three ways to install the Material theme: using `Github` or `NPM`. 21 | 22 | ### Direct download 23 | 24 | Download a [stable release](https://github.com/viosey/hexo-theme-material/releases) and extract the content inside the `themes/material` directory. 25 | 26 | ### NPM 27 | 28 | Go in the site root directory and use the following commands: 29 | 30 | ```bash 31 | npm install hexo-material 32 | cp -R node_modules/hexo-material/ themes/material 33 | ``` 34 | 35 | ## Enable "Material" 36 | 37 | Once you have the `themes/material` folder, open the **site config**, find the `theme` field, and change its value to `material`. 38 | 39 | > The folder `themes/material` can be named differently if you wish. You simply have to adapt the `theme` field accordingly. 40 | 41 | **The `_config.yml` file does not exist in the theme, you need to manually duplicate the `_config.template.yml` file and rename it to `_config.yml`** 42 | 43 | Run `hexo s --debug` and go to [`http://localhost:4000`](http://localhost:4000) to make sure the site is running properly. 44 | 45 | ## Update "Material" 46 | 47 | ### Direct download 48 | 49 | Save your `_config.yml` file somewhere. Then download a new [stable release](https://github.com/viosey/hexo-theme-material/releases) and extract the content inside the `themes/material` directory. Finally reconcile the new version of the `_config.yml` with the one you saved. 50 | 51 | The previous commands will put aside your custom config, pull the update reapply your modifications. Fix conflicts if needed. 52 | 53 | ### NPM 54 | 55 | NPM updates can be done in two ways: 56 | 57 | #### NPM update 58 | 59 | Save your `_config.yml` file somewhere. Then use: 60 | 61 | ```bash 62 | npm update hexo-material 63 | rm -R themes/material 64 | cp -R node_modules/hexo-material/ themes/material 65 | ``` 66 | 67 | Finally reconcile the new version of the `_config.yml` with the one you saved. 68 | 69 | #### npm-check 70 | 71 | [Npm-check](https://www.npmjs.com/package/npm-check) is used to check NPM dependency package for updates or errors. 72 | 73 | Install npm-check: 74 | 75 | ```bash 76 | npm install -g npm-check 77 | ``` 78 | 79 | Save your `_config.yml` file somewhere. Then use: 80 | 81 | ```bash 82 | npm-check hexo-material 83 | ``` 84 | 85 | Use the space bar to select the package to update and press enter. 86 | 87 | ## Basic settings 88 | 89 | ### Language 90 | 91 | Edit the **site config** and set `language` to the language you want. 92 | 93 | Available languages ​​are: 94 | 95 | - العَرَبِيَّة (ar) 96 | - Deutsch (de) 97 | - English (en) 98 | - Español (es) 99 | - Français (fr) 100 | - 日本語 (ja) 101 | - Malay (ms) 102 | - Portuguese (Brazil) (pt-BR) 103 | - 简体中文 (zh-CN) 104 | - 繁體中文 (zh-TW) 105 | 106 | 107 | > For example, to use Traditional Chinese, the configuration would be: 108 | > 109 | ```yaml 110 | language: zh-TW 111 | ``` 112 | -------------------------------------------------------------------------------- /compose-zh-cn.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 开始创作 3 | version: 1.4.0 4 | permalink: compose 5 | id: 3 6 | lang: zh-cn 7 | --- 8 | ## 创建文章 9 | 10 | ### 使用命令行 11 | ```shell 12 | hexo new 13 | ``` 14 | 15 | ### 手动创建 16 | 在 hexo 主目录下 `source -> _posts` 新建以 `.md` 为后缀的文件。 17 | 18 | ### Front-matter 19 | 20 | [Front-matter - 官方介绍](https://hexo.io/zh-cn/docs/front-matter.html) 21 | 22 | | 参数 | 描述 | 默认值 | 23 | |:-- |:-- |:-- | 24 | | `layout` | 布局 | post | 25 | | `title` | 标题 | 文件名 | 26 | | `date` | 建立日期 | 文件建立日期 | 27 | | `updated` | 更新日期 | 文件更新日期 | 28 | | `tags` | 标签(不适用于分页)| | 29 | | `categories` | 分类(不适用于分页)| | 30 | | `permalink` | 覆盖文章网址 | | 31 | | `thumbnail` | 缩略图地址 | | 32 | | `toc` | 显示 TOC 按钮 | true | 33 | | `comment` | 显示评论 | true | 34 | | `notag` | 不生成标签按钮 | false | 35 | | `top` | 置顶 | false | 36 | | `mathJax` | 启用 Mathjax | false | 37 | 38 | 注1:置顶功能请参考 [topPost](/intro/#topPost) 39 | 40 | ### 缩略图功能 41 | 42 | 在 Material 主题中,每个 Scheme 都有缩略图功能。 43 | 只需要在 `Front-matter` 中添加参数 `thumbnail: `,然后填入缩略图地址即可。 44 | 45 | #### Paradox 46 | 47 | 此 Scheme 如果没有自定义缩略图,则使用默认随机缩略图,随机缩略图目录位于主题文件夹下 `source -> img -> random`。 48 | 随机缩略图可添加自己喜好的图片,格式为 `<num>.png` 。然后在 **主题配置文件** 中 `thumbnail:random_amount` 修改缩略图数量。 49 | 50 | #### Isolation 51 | 52 | 此 Scheme 只会显示已自定义缩略图。 53 | 54 | 如果想添加自定义页面的入口,请参考 [独立页面](/intro/#pages)。 55 | 56 | ## 创建「友情链接」页面 57 | 58 | ### 创建页面 59 | 在 hexo 目录下的 `source` 文件夹内创建一个名为 `links`(只是建议,可根据自己喜好修改)的文件夹。 60 | 61 | 然后在文件内创建一个名为 `index.md` 的 Markdown 文件。 62 | 63 | 在 `index.md` 文件内写入如下内容即可。 64 | ```markdown 65 | --- 66 | title: links 67 | date: 68 | layout: links 69 | --- 70 | ``` 71 | >`title` 可修改,`layout` 不可修改。 72 | 73 | 如果想添加「友情链接」页面的入口,请参考 [独立页面](/intro/#pages)。 74 | 75 | ### 添加数据 76 | 同样在在 hexo 目录下的 `source` 文件夹内创建一个名为 `_data`(禁止改名)的文件夹。 77 | 78 | 然后在文件内创建一个名为 `links.yml` 的文件。 79 | 80 | 单个友情链接的格式为: 81 | 82 | ```yml 83 | Name: 84 | link: http://example.com 85 | avatar: http://example.com/avatar.png 86 | descr: "这是一个描述" 87 | ``` 88 | 89 | >添加多个友情链接,只需要根据上面的格式重复填写即可。 90 | 91 | - 将 `Name` 改为友情链接的名字,例如 `Viosey`。 92 | - `http://example.com` 为友情链接的地址。 93 | - `http://example.com/avatar.png` 为友情链接的头像。 94 | - `这是一个描述` 为友情链接描述。 95 | 96 | 97 | ## 创建「图库」页面 98 | 99 | ### 创建页面 100 | 在 hexo 目录下的 `source` 文件夹内创建一个名为 `gallery`(只是建议,可根据自己喜好修改)的文件夹。 101 | 102 | 然后在文件内创建一个名为 `index.md` 的 Markdown 文件。 103 | 104 | 在 `index.md` 文件内写入如下内容即可。 105 | ```markdown 106 | --- 107 | title: gallery 108 | date: 109 | layout: gallery 110 | --- 111 | ``` 112 | >`title` 可修改,`layout` 不可修改。 113 | 114 | 如果想添加「图库」页面的入口,请参考 [独立页面](/intro/#pages)。 115 | 116 | ### 添加数据 117 | 同样在在 hexo 目录下的 `source` 文件夹内创建一个名为 `_data`(禁止改名)的文件夹。 118 | 119 | 然后在文件内创建一个名为 `gallery.yml` 的文件。 120 | 121 | 单个图片的格式为: 122 | 123 | ```yml 124 | Name: 125 | full_link: http://example.com/full-image.png 126 | thumb_link: http://example.com/thumb-image.png 127 | descr: "这是一个描述" 128 | ``` 129 | >添加多张图片,只需要根据上面的格式重复填写即可。 130 | 131 | - 将 `Name` 改为图片名字,例如 `Material`。 132 | - `http://example.com/full-image.png` 为完整图片的地址。 133 | - `http://example.com/thumb-image.png` 为图片缩略图的地址,如果没有缩略图也可使用完整图片的地址。 134 | - `这是一个描述` 为图片描述。 135 | 136 | 137 | ## 创建「标签云」页面 138 | 139 | ### 创建页面 140 | 141 | 在 hexo 目录下的 `source` 文件夹内创建一个名为 `tags`(只是建议,可根据自己喜好修改)的文件夹。 142 | 143 | 然后在文件内创建一个名为 `index.md` 的 Markdown 文件。 144 | 145 | 在 `index.md` 文件内写入如下内容即可。 146 | ```markdown 147 | --- 148 | title: tags 149 | date: 150 | layout: tags 151 | --- 152 | ``` 153 | >`title` 可修改,`layout` 不可修改。 154 | 155 | 如果想添加「标签云」页面的入口,请参考 [独立页面](/intro/#pages)。 156 | 157 | ## 创建「时间轴」页面 158 | 159 | ### 创建页面 160 | 161 | 在 hexo 目录下的 `source` 文件夹内创建一个名为 `timeline`(只是建议,可根据自己喜好修改)的文件夹。 162 | 163 | 然后在文件内创建一个名为 `index.md` 的 Markdown 文件。 164 | 165 | 在 `index.md` 文件内写入如下内容即可。 166 | ```markdown 167 | --- 168 | title: timeline 169 | date: 170 | layout: timeline 171 | --- 172 | ``` 173 | >`title` 可修改,`layout` 不可修改。 174 | 175 | 如果想添加「标签云」页面的入口,请参考 [独立页面](/intro/#pages)。 176 | -------------------------------------------------------------------------------- /services-zh-cn.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 集成服务 3 | version: 1.4.0 4 | permalink: services 5 | id: 5 6 | lang: zh-cn 7 | --- 8 | 9 | 「Material」主题内置了多种第三方服务,并且可以轻松的启用。 10 | 11 | ## RSS 12 | 13 | 安装插件:[hexo-generator-feed](https://github.com/hexojs/hexo-generator-feed),配置方式如插件 `README.md` 所示。 14 | 然后在 [url: rss](/intro/#url) 中添加生成的 feed 路径。 15 | 16 | 17 | ## topPost 18 | 19 | 使用该插件可以将指定文章置顶。 20 | 如果您需要这个功能,请使用 `npm install hexo-helper-post-top --save` 安装支持插件。 21 | 之后在您需要置顶文章的 `front-matter` 中,添加 `top: true` 即可置顶。 22 | 23 | ---- 24 | 25 | 在 **主题配置文件** 中定位到 `Integrated Services` 即可进行第三方服务的配置。 26 | 27 | ## 评论系统 28 | 29 | 定位到 **`主题配置文件`** 中 `Integrated Services` 的 `comment`,即可以设置评论。 30 | 31 | ### Disqus 32 | 33 | Material 主题提供了两种使用 [Disqus](https://disqus.com/) 主题的方式,在 **主题配置文件** 中填写 `comment: use: ` 字段,值设置为 `disqus` 或 `disqus_click`。 34 | 35 | > 使用 Disqus_Click 时,文章页面不会主动加载 Disqus 评论,直到按下按钮。这项设置有助于改善处在 **`公开、平等、有序 的 网络审查 地区`** 下的浏览者的体验。 36 | 37 | 在 `comment: shortname: ` 填入你的 Disqus shortname 38 | 39 | ---- 40 | 41 | 需要注意的是此处的 `shortname` 不是你的登录的 id,是你的评论二级域名去掉 `.duoshuo.com` 或 `.disqus.com` 部分 42 | 43 | >例如:Disqus 域名 `example.disqus.com` 44 | 45 | > ```yml 46 | shortname: example 47 | ``` 48 | 49 | ### 畅言 50 | 51 | 使用 [畅言](http://changyan.kuaizhan.com),需在 **主题配置文件** 中填写 `comment: use: ` 字段,值设置为 `changyan`。 52 | 53 | - changyan_appid: 畅言的 APPID 54 | - changyan_conf: 畅言的 CONF 55 | - changyan_thread_key_type: path #用于设置畅言的 tread key,默认为 path。 56 | 57 | ### 网易云跟帖 58 | 59 | 使用 [网易云跟帖](https://gentie.163.com/),需在 **主题配置文件** 中填写 `comment: use: ` 字段,值设置为 `163gentie`。 60 | 打开网易云跟帖后台中找到 “获取代码”,在 WEB 代码中,找到 `gentie_productKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"` 部分,将 “xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx” 填入到 **主题配置文件** 中评论系统的配置的 `gentie_productKey: ` 61 | 62 | ### 来必力 63 | 64 | > Material 主题内置的来必力是 `city_verision` 65 | 66 | 使用 来必力,需在 **主题配置文件** 中填写 `comment: use: ` 字段,值设置为 `livere`。 67 | 打开来必力后台中找到 “获取代码”,在 WEB 代码中,找到 `data-uid`,填入到 **主题配置文件** 中评论系统的配置的 `livere_data_uid: ` 68 | 69 | ## 搜索系统 70 | 71 | Material 主题内置了 `google ` `swiftype` `local` 三种搜索系统。 72 | 73 | ```yaml 74 | - use 75 | - swiftype_key 76 | ``` 77 | 78 | ### Google 79 | 80 | 调用 Google 搜索引擎对您的站点进行搜索。 81 | 82 | 在 **主题配置文件** 中修改 `search: use` 的值为 `google` 即可。 83 | 84 | ### 本地搜索 85 | 86 | 使用本地搜索需要安装 [hexo-generator-search](https://github.com/PaicHyperionDev/hexo-generator-search) 插件。 87 | 88 | 然后在 `站点配置` 文件中添加 89 | ```yml 90 | search: 91 | path: search.xml 92 | field: all 93 | ``` 94 | 95 | ### Swiftype 96 | 97 | 注册 [Swiftype](https://swiftype.com/),然后在 **主题配置文件** 中修改 `search: use` 的值为 `swiftype`,并填入你的 `swiftype_key`。 98 | 99 | > 在你的 `Swiftype Install Code` 中,有这么一行代码 `_st('install','*****','2.0.0');` 。其中 `*****` 即为 `swiftype_key` 100 | 101 | ## 数据统计与分析 102 | 103 | 用于设置访客分析服务,支持 Google Analysis 、百度站长工具和 CNZZ。 104 | 105 | - use: 你使用的站点统计服务,可填入 `cnzz` `baidu` `google` 106 | - site_id: 站点统计 ID 107 | 108 | ### 百度统计 109 | 110 | 登录 [百度统计](http://tongji.baidu.com/),在站点的代码获取页面复制 `` 后面那串统计脚本 id,填入 `site_id`。 111 | 112 | ### Google 分析 113 | 114 | 在 `site_id` 字段填入你的 Google 跟踪 ID。跟踪 ID 通常是以 UA- 开头。 115 | 116 | ### CNZZ 117 | 118 | 在 `site_id `填入 CNZZ 提供的统计的站点 ID。 这个 ID 可以在地址栏里,或者自动生成的脚本里面找到。 119 | 120 | > 在 CNZZ 提供的统计代码中,`z_stat.php?id=` 后和 `&web_id=` 各有一串字符,它们应该是相同的。将这串字符填入 `site_id`。 121 | 122 | 为避免影响美观,Material 主题使用 `display: none;`隐藏了“站长统计”几个字。 123 | 124 | ### 其它统计服务 125 | 126 | 确保 `use` 字段为空,然后在在 `head.yml` 中填入你的统计服务代码。如何使用 `head.yml`,请访问[进阶设定](/expert/)中关于 自定义代码 的部分。 127 | 128 | ### PV&UV 统计 129 | 130 | 在 Material 主题中提供 PV&UV 显示。 131 | 132 | #### Leancloud 133 | 134 | ```yaml 135 | - enable: 默认为 false。 136 | - app_id: APP ID。 137 | - app_key: APP Key。 138 | - av_core_mini: 统计 js。 139 | ``` 140 | 141 | 打开 LeanCloud 官网,进入[注册页面](https://leancloud.cn/login.html#/signup)注册。完成邮箱激活后,点击头像,进入控制台页面,如下: 142 | 143 | ![](https://qiniu.viosey.com/img/leancloud-config-1.png) 144 | 145 | 创建一个新应用 (默认类型为JavaScript SDK),点击应用进入; 146 | 147 | 创建名称为 `Counter` 的 Class 148 | 注意:`ACL 权限` 必须为 `无限制` 149 | 150 | ![](https://qiniu.viosey.com/img/leancloud-config-2.png) 151 | ![](https://qiniu.viosey.com/img/leancloud-config-3.png) 152 | 153 | 编辑 `主题配置文件` ,修改 `leancloud` 条目,将 `enable` 改为 `true`,再填入 `app_id` 与 `app_key`。在 `应用->设置->应用 Key` 可看到 `APP ID` 与 `APP Key` 154 | 155 | > 为了保证应用的统计计数功能仅应用于自己的博客系统,你可以在 `应用->设置->安全中心` 的Web安全域名中加入自己的博客域名,以保证数据的调用安全。 156 | 157 | #### 不蒜子 158 | 159 | ```yaml 160 | - enable: 默认为 false。 161 | - all_site_uv: 默认为 false。 162 | - post_pv: 默认为 false。 163 | - busuanzi_pure_mini_js: 统计 js。 164 | ``` 165 | 166 | 使用 不蒜子 浏览次数统计,仅需在 **主题配置文件** 中将 `busuanzi: enable: ` 的值设置为 `true`。 167 | 168 | 其中: 169 | 170 | - `all_site_uv` 可统计全站的独立访客人数,即可在 `blog_info` 模块的 `Menu` 菜单中看到。 171 | - `post_pv` 统计每篇文章的页面浏览次数,在文章页的 `分享按钮` 菜单中可看到。 172 | - `busuanzi_pure_mini_js` 调用不蒜子统计 js 文件,可将该文件保存至你的 WebServer 或 CDN 中,然后在这里填入 URL。 173 | -------------------------------------------------------------------------------- /services-en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Services 3 | version: 1.4.0 4 | permalink: en/services 5 | id: 5 6 | lang: en 7 | --- 8 | 9 | "Material" has built in lots of Integrated Services. You can easily set up it. 10 | 11 | ## RSS 12 | 13 | First, you should install the plugin [hexo-generator-feed](https://github.com/hexojs/hexo-generator-feed). Read the plugin's `README.md` to install and configure it. 14 | 15 | Then configure `theme config` [url: rss](/en/intro/#url) with the URI. 16 | 17 | ## topPost 18 | 19 | Use this to pin post at the top of the list of posts. 20 | If you want to use this WIP feature, please install `hexo-helper-post-top` : 21 | 22 | ```bash 23 | npm install hexo-helper-post-top --save 24 | ``` 25 | 26 | Now you can use `front-matter` `top: true` to pin your posts what you want to. 27 | 28 | ---- 29 | 30 | You can configure third-party services by navigating to `Integrated Services` in the **theme config** 31 | 32 | ## Comment system 33 | 34 | Used to set up a comment system. 35 | 36 | See [comment system](/en/services/#Comment-system) for more information. 37 | 38 | - `use`: `disqus` `disqus_click` `changyan` `163gentie` or `livere` 39 | 40 | > When Using `disqus_click`, post won't load Disqus automatically. The pages will load Disqus when the vistors click the button. This feature will help to improve some people's browse exprience from where they can't load Disqus normally, such as China. 41 | 42 | > The livere built in the Material is `city_verison`. 43 | 44 | - `shortname`: the shortname of duoshuo and disqus 45 | - `changyan_appid`: the APPID of changyan 46 | - `changyan_conf`: the CONF of changyan 47 | - `changyan_thread_key_type`: path #identifier of posts. `path` as default. 48 | - `gentie_productKey`: You can find the productkey in `install code` at 163gentie's console, something like `gentie_productKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"` 49 | - `gentie_thread_key_type`: Default is path. If using ID, you should add `id` front-matter for every post. Then 163gentie will use it as identifier. 50 | - `livere_data_uid`: You can find the `datd_uid` from the provided code. 51 | 52 | ## Search system 53 | 54 | ### Google 55 | 56 | Call the Google search engine to search your site. 57 | 58 | ```yaml 59 | search: 60 | use: google 61 | ``` 62 | 63 | ### Local Search 64 | 65 | The [hexo-generator-search](https://github.com/PaicHyperionDev/hexo-generator-search) plugin needs to be installed when using local search. 66 | 67 | ```yaml 68 | search: 69 | use: local 70 | ``` 71 | 72 | ### Swiftype 73 | 74 | Sign up for [Swiftype](https://swiftype.com/). In your Swiftype installation code, you'll find a line like `_st ( 'install', 'myKey', '2.0.0');`. 75 | 76 | ```yaml 77 | search: 78 | use: swiftype 79 | swiftype_key: myKey 80 | ``` 81 | 82 | ## Browse statistics 83 | 84 | ### Site Analytics 85 | 86 | Material theme has a built in Baidu's, Google's website analytics and CNZZ's analytics service.You can easily set the ID to enable it. 87 | 88 | - `use`: Set which analytics you want to use. Available values are baidu | google | cnzz 89 | - `site_id`: the site_id that analytics service provide. 90 | 91 | > - Google will give the `site ID` with `UA-` begin; 92 | > - Baidu will give your a JavaScript URI like `hm.js?xxxxxxxxx` and `xxxxxxxx` is the site_id that you need. 93 | > - in CNZZ's code, there will be `z_stat.php?id=xxxxxxxxxxxx` and `&web_id=xxxxxxxxx`. Both of these `xxxxxxxx` should be the same. And this `xxxxxxxxx` is the site_id. 94 | 95 | ### Other Analytics 96 | 97 | You should set the `use` with nothing. Then you can add the analytics code in `head.yml`. You can read the [expert](/en/expert/) about how to use `head.yml`. 98 | 99 | ### Leancloud 100 | 101 | Open the LeanCloud website and go to the [registration page](https://leancloud.cn/login.html#/signup) to register. After the mailbox is activated, click on the avatar to access the console page as following: 102 | 103 | ![](https://qiniu.viosey.com/img/leancloud-config-1.png) 104 | 105 | Create a new application (the default type is JavaScript SDK), click Apply to enter; 106 | 107 | Create a Class named `Counter` 108 | Note: `ACL Permissions` must be `unrestricted` 109 | 110 | ![](https://qiniu.viosey.com/img/leancloud-config-2.png) 111 | ![](https://qiniu.viosey.com/img/leancloud-config-3.png) 112 | 113 | You can find `app_id` and `app_key` in `application -> Settings -> Application Key`. 114 | 115 | ```yaml 116 | leancloud: 117 | enable: true 118 | app_id: #app_id 119 | app_key: #app_key 120 | av_core_mini: "https://cdn1.lncld.net/static/js/av-core-mini-0.6.1.js" 121 | ``` 122 | 123 | > Add your blog domain to `application -> Settings -> Security Center` to ensure data security calls. 124 | 125 | #### Busuanzi 126 | 127 | To use the view statistics, simply set: 128 | 129 | ```yaml 130 | busuanzi: 131 | enable: true 132 | all_site_uv: false 133 | post_pv: false 134 | busuanzi_pure_mini_js: "https://dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js" 135 | ``` 136 | 137 | Parameters are: 138 | 139 | - `all_site_uv`: counts the number of unique visitors to the site 140 | - `post_pv`: the number of page views for each post 141 | - `busuanzi_pure_mini_js`: You can save the js to your webserver or CDN, then set the URI here. 142 | -------------------------------------------------------------------------------- /compose-en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Compose 3 | version: 1.4.0 4 | permalink: en/compose 5 | id: 3 6 | lang: en 7 | --- 8 | 9 | ## Create an article 10 | 11 | ### Use the command line 12 | 13 | ```bash 14 | hexo new <title> 15 | ``` 16 | 17 | ### Create it manually 18 | 19 | Create a file with the extension `.md` inside the `source/_posts` folder. 20 | 21 | ### Front-matter 22 | 23 | See [front-matter](https://hexo.io/en/docs/front-matter.html) for more information. 24 | 25 | | Setting | Description | Default | 26 | | ---------- | ------------------------------------------ | ----------------- | 27 | | layout | Layout | | 28 | | title | Title | | 29 | | date | Published date | File created date | 30 | | update | Updated date | File updated date | 31 | | comments | Enables comment feature for the post | true | 32 | | tags | Tags (Not available for pages) | | 33 | | categories | Categories (Not available for pages) | | 34 | | permalink | Override the default permalink of the post | | 35 | | toc | Display TOC button | true | 36 | | comment | Display comment | true | 37 | | notag | Do not generate Tags menu | false | 38 | | top | Pin post on the top of the list | false | 39 | | mathjax | Enable the MathJax for this post | false | 40 | 41 | P.S. To use `Pin on top` feature please visit [topPost](/intro/#topPost) 42 | 43 | ### Thumbnail function 44 | 45 | In the Material theme, each Scheme has a thumbnail function. Simply add the `thumbnail:` parameter to the `front-matter` and fill in the thumbnail address. 46 | 47 | #### Paradox 48 | 49 | This scheme uses the default random thumbnails if there is no custom thumbnail. The random thumbnail directory is located under the `source/img/random` folder. You can add your favorite images in the format `material-<num>.png`. Then modify the `random_amount` parameter in the **theme config**. 50 | 51 | #### Isolation 52 | 53 | This Scheme will only show thumbnails that have been customized. 54 | 55 | If you want to add a link to the "Link" page, please refer to the [page settings](/en/intro/#pages). 56 | 57 | ## Create the "Links" page 58 | 59 | ### Create the page 60 | 61 | Create a folder named `links` within the `source` folder. Then create a file named `index.md` inside this folder: 62 | 63 | ```yaml 64 | --- 65 | title: links 66 | date: 67 | layout: links 68 | --- 69 | ``` 70 | 71 | > `title` can be changed, `layout` can not be modified. 72 | 73 | If you want to add a link to the "Link" page, please refer to the [page settings](/en/intro/#pages). 74 | 75 | ### Add data 76 | 77 | Create a folder named `_data` (rename is forbidden) within the `source` folder. Then create a file named `links.yml` inside this folder. 78 | 79 | The format for a single link is: 80 | 81 | ```yaml 82 | Name: 83 |     link: http://example.com 84 |     avatar: http://example.com/avatar.png 85 |     descr: "This is a description" 86 | ``` 87 | 88 | Change `Name` to the name of the link. You can create as many links as you want. 89 | 90 | ## Create the "Gallery" page 91 | 92 | ### Create the page 93 | 94 | Create a folder named `gallery` within the `source` folder. Then create a file named `index.md` inside this folder: 95 | 96 | ```yaml 97 | --- 98 | title: gallery 99 | date: 100 | layout: gallery 101 | --- 102 | ``` 103 | 104 | > `title` can be changed, `layout` can not be modified. 105 | 106 | If you'd like to add an entry to the "Gallery" page, please refer to the [page settings](/en/intro/#pages). 107 | 108 | ### Add data 109 | 110 | Create a folder named `_data` (rename is forbidden) within the `source` folder. Then create a file named `gallery.yml` inside this folder. 111 | 112 | The format for a single image is: 113 | 114 | ```yaml 115 | Name: 116 | full_link: http://example.com/full-image.png 117 | thumb_link: http://example.com/thumb-image.png 118 | descr: "This is a description" 119 | ``` 120 | 121 | Change `Name` to the image name. You can create as many images as you want. 122 | 123 | ## Create the "Tag Cloud" page 124 | 125 | ### Create the page 126 | 127 | Create a folder named `tags` within the `source` folder. Then create a file named `index.md` inside this folder: 128 | 129 | ```yaml 130 | --- 131 | title: tags 132 | date: 133 | layout: tags 134 | --- 135 | ``` 136 | 137 | > `title` can be changed, `layout` can not be modified. 138 | 139 | If you'd like to add an entry to the Tag Cloud page, please refer to the [page settings](/en/intro/#pages). 140 | 141 | ## Create the "Timeline" page 142 | 143 | ### Create the page 144 | 145 | Create a folder named `timeline` within the `source` folder. Then create a file named `index.md` inside this folder: 146 | 147 | ```yaml 148 | --- 149 | title: timeline 150 | date: 151 | layout: timeline 152 | --- 153 | ``` 154 | 155 | > `title` can be changed, `layout` can not be modified. 156 | 157 | If you'd like to add an entry to the Timeline page, please refer to the [page settings](/en/intro/#pages). -------------------------------------------------------------------------------- /intro-zh-cn.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 配置介绍 3 | version: 1.4.0 4 | permalink: intro 5 | id: 2 6 | lang: zh-cn 7 | --- 8 | 9 | 这里,我们将介绍主题的基本配置教程,包括 `Site Information`、`Style Settings`、`Menu Settings` 三个部分。 10 | 11 | ## Site Information 12 | 13 | ### head 14 | 15 | 用于配置生成的 HTML 文件的头部信息。 16 | 17 | - `favicon`: 网站的 favicon 18 | - `high_res_favicon`: 高清 favicon 19 | - `apple_touch_icon`: iOS 主屏按钮图标 20 | - `keywords`: 网站关键词 21 | - `site_verification`: 搜索引擎验证 22 | - `google`: 谷歌 Search Console 验证 23 | - `baidu`: 百度站长平台验证 24 | 25 | > 向搜索引擎验证你对站点的所有权,用于向搜索引擎提交 sitemap 和管理站点被搜索引擎收录的情况 26 | > 1. 登录搜索引擎后台,选择使用 `HTML 标记` 验证站点所有权,搜索引擎后台会给你一串类似于这样的东西: 27 | ```html 28 | <meta name="xxxx-site-verification" content="xxxxxxxxxxxxxxxxxxxxxxxxxxxx" /> 29 | ``` 30 | > 2. 将 `xxxxxxxxxxxxxxxxxxxxxxxxxxxx` 字符串复制出来,填入对应搜索引擎的设置中,博客更新以后即可通过验证。 31 | > 注:如果你使用了[集成服务](https://material.viosey.com/services/#Google-分析)中的[Google分析](https://analytics.google.com/)服务,那么在配置[谷歌 Search Console](https://www.google.com/webmasters/tools/) 时,可以直接使用Google分析来进行验证,无需再次使用Html标记验证。 32 | 33 | - `structured_data`: 启用后会在页面的 head 中生成结构化数据,有助于改善 Google 等搜索引擎的 SEO。这项功能需要你完善地配置主题的 **`站点配置文件`** 和 **`主题配置文件`**,所以如果你在 `hexo g` 中出现问题,尝试禁用该选项。默认值为 true. 34 | 35 | ### url 36 | 37 | 用于设置跳转链接。 38 | 39 | - rss: 设置生成的 rss 或 atom url 40 | - daily_pic: 设置 `daily_pic` 模块 点击时跳转的 url 41 | - logo: 设置 logo 点击时跳转的 url 42 | 43 | > 如何使用 RSS,请访问文档的[集成服务](/service/),获取启用 RSS 的方法。 44 | 45 | ## Style Settings 46 | 47 | ### scheme 48 | 49 | Material 主题提供了多种分支主题外观,亦称「Scheme」。 50 | 目前 Material 内置三种 Scheme: 51 | 52 | #### Nexus(开发中) 53 | 最为标准的 Material Design 样式。 54 | 55 | #### Paradox 56 | 57 | 默认 Scheme,是 Material 的最初样式。居中布局,图文并茂。 58 | 59 | #### Isolation 60 | 61 | Paradox 的至简样式,简洁明了。 62 | 63 | ---- 64 | 65 | Scheme 的切换通过更改 **主题配置文件**,搜索 `scheme` 关键字。 你会看到有几行 scheme 的配置,将你需用启用的 scheme 去掉前面注释 `#` 即可。 66 | 67 | > 例如 - 选择 Paradox Scheme 68 | 69 | >```yaml 70 | #scheme: Nexus 71 | scheme: Paradox 72 | #scheme: Isolation 73 | ``` 74 | 75 | ### uiux 76 | 77 | 用于设置主题 UI 与 UX。 78 | 79 | - slogan: 显示在 `blog_info` 模块中的标语,你可以设置单行标语或者多行标语: 80 | 81 | > 单行标语使用 82 | > ```yaml 83 | slogan: 标语(支持 HTML 标签) 84 | ``` 85 | 86 | > 多行标语使用 87 | > ```yaml 88 | slogan: 89 | - "标语第一行" 90 | - "标语第二行" 91 | - "标语第三行" 92 | ``` 93 | 94 | - theme_color: 主题主要颜色。主题的大部分地方使用此颜色。 95 | - theme_sub_color: 主题辅助颜色。 96 | - hyperlink_color: 超链接颜色。 97 | - button_color: 按钮颜色,例如 `toTop` 或 `menu_button`。 98 | - android_chrome_color: 安卓 Chrome 浏览器的地址栏颜色。 99 | - nprogress_color: 页面加载时顶部加载进度条的颜色。 100 | - nprogress_buffer: 页面加载时顶部加载进度条的缓冲时间。 101 | 102 | > [Color palette](https://material.google.com/style/color.html#color-color-palette) 103 | > 符合 Material Design 的规范颜色。 104 | 105 | ### js_effect 106 | 107 | 用来控制 Material 主题中自带的多种 js 特性。 108 | 109 | - fade: 页面加载时部分模块的渐显效果,默认为 true。 110 | - smoothscroll: 页面平滑滚动特效,默认为 false。 111 | 112 | ### reading 113 | 114 | 用于设置阅读体验。 115 | 116 | - entry_excerpt: 首页文章输出摘要的字符长度。默认为 80。 117 | 118 | > 注意,这里设定的字符长度包括 `Front-Matter` 的长度,但是在首页,`Front-Matter` 不会显示出来。 119 | 120 | ### thumbnail 121 | 122 | 用于设置文章缩略图相关。 123 | 124 | - purecolor: 填入颜色代码。如果文章内无设置缩略图,此项又不为空,则使用纯色缩略图。 125 | - random_amount: 随机图片数量,根据 `主题所在文件夹/source/img/random` 中的图片数量设置。Material 主题默认提供了 19 张 Material 风格的缩略图。 126 | 127 | ### background 128 | 129 | 用于设置站点背景。 130 | 131 | - purecolor: 填入颜色代码。则站点使用纯色背景。 132 | - bgimg: 背景地址,默认调用 `主题文件夹 -> source -> img` 中的 `bg.png`。可更换此图片或者自己填入 url。 133 | - bing: 用于启用“必应美图”的图片作为背景。 134 | - `parameter`: 135 | - `color=`: black, blue, brown, green, multi, orange, pink, purple, red, white, yellow. 136 | - `type=`: A (动物), C (人文), N (自然), S (太空), T (旅行). 137 | 138 | ### img 139 | 140 | 用于设置站点图片。 141 | 142 | - logo: 显示于 `blog_info` 模块中。 143 | - avatar: 你的头像设置。 144 | - daily_pic: 显示于 `daily_pic` 模块中。 145 | - sidebar_header: 显示于 `sidebar` 顶部。 146 | - footerico: 设置 `footer` 中 SNS 图标的路径。 147 | - random_thumbnail: 随机缩略图的路径。 148 | - footer_image: 你可以在侧边栏底部放置任何你想要的图片。 149 | 150 | 以又拍云联盟图标为例,你可以这样配置: 151 | 152 | ```yaml 153 | footer_image: 154 | upyun_logo: 155 | link: "https://www.upyun.com/" 156 | src: "/img/upyun_logo.svg" 157 | ``` 158 | 159 | ### fonts 160 | 161 | - `family`: 用于设置站点的字体。 162 | 163 | > `fonts.family` 默认值为 `Roboto, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif` 164 | > 该字体设定为 Material Design 的规范,如无特殊要求 无需额外修改。 165 | > 当你修改字体时,请在 `head.yml` 内使用 `<link>` 标签引用你的字体源。如何使用 `head.yml`,请访问[进阶设定](/expert/)中关于 自定义代码 的部分。 166 | 167 | - `use`: 用于设置站点字体的引用方式。Material 主题内置了以下三种字体库支持。除此以外,你也可以手动设定你喜欢的谷歌字体反代服务。 168 | - `google`: 使用 Google 字体库加载 `Roboto` 字体和 `Material Icon` 169 | - `ustc`: 使用中科大反代的 Google 字体库加载 `Roboto` 字体和 `Material Icon` 170 | - `baomitu`: 使用 360 前端团队 奇舞团 维护的字体库加载 `Roboto` 字体和 `Material Icon` 171 | - `custom`, 使用你喜欢的谷歌字体镜像服务加载 `Roboto` 字体和 `Material Icon`。使用该选项需要在 `custom_font_host` 中填入字体库的 URL 172 | 173 | > **注意!`custom_font_host` 中设定的字体库的 URL 需要带 proctol(如 https://)且末尾不能带 `/` !** 174 | 175 | ### card_elevation 176 | 177 | 用来设置主题卡片阴影。 178 | 179 | ### copyright_since 180 | 181 | 用于设置站点成立的时间。 182 | 183 | > 例如,如果你设置了 2015,那么 footer 就会显示 `© 2015 - 2017`。 184 | 185 | 如果这个值为空,那么 footer 只会显示现在的年份。 186 | 187 | ### footer text 188 | 189 | 你可以在页面的 Footer 指定你想显示的文字,支持 HTML 标签;默认为空。 190 | 比如,备案号可以这样设定: 191 | 192 | ```yml 193 | footer_text: '<a href="http://www.miitbeian.gov.cn" rel="nofollow">某ICP备xxxxxxxx号-x</a>' 194 | ``` 195 | 196 | ### Code 197 | 198 | 使用 `Google Prettify` 实现代码高亮。 199 | 启用之前你需要禁用 Hexo 自带的代码高亮。 200 | 201 | ```yml 202 | prettify: 203 | enable: false # Available value: true | false, 204 | theme: "vibrant-ink" # default value: "vibrant-ink" # theme-name without '.css' 205 | ``` 206 | 207 | ### Post License 208 | 209 | 你可以在每篇文章的结尾添加你的版权说明,支持 HTML 标签。License 以粗体显示,默认为空。 210 | 比如,你可这样设定 CC License。 211 | 212 | ```yml 213 | license: 'This blog is under a <a href="/creativecommons.html" target="_blank">CC BY-NC-SA 3.0 Unported License</a>' 214 | ``` 215 | > 你也可以在页面的 Front-Matter 中为不同文章添加不同的 License。 216 | 217 | ### Qrcode 218 | 219 | 用于在文章页中显示二维码,扫描二维码即可直接打开文章。 220 | 221 | - enable: 是否显示二维码 222 | - use: 设置生成二维码的方式,可选的有:plugin | online 223 | 224 | > 当 `use` 设置为 `plugin` 时,你需要安装 `hexo-helper-qrcode` 插件,使用 `npm install hexo-helper-qrcode --save` 安装。 225 | > 当 `use` 设置为 `online` 时,二维码将会由 `pan.baidu.com` 的 API 生成。 226 | 227 | ## Menu Settings 228 | 229 | ### toc 230 | 231 | 是否显示 TOC(Table of Content) 菜单中的行号。 232 | 233 | ### sns 234 | 235 | 用于填写你的 SNS 信息,其中 `email` 会显示在侧边栏,其他信息会以按钮的形式显示在 `footer`。 236 | 237 | - email 238 | - twitter 239 | - facebook 240 | - googleplus 241 | - weibo 242 | - instagram 243 | - tumblr 244 | - github 245 | - linkedin 246 | - facebook 247 | 248 | ### sns_share 249 | 250 | 用于定义分享菜单中的项目, `false` 的项将不会显示在分享菜单中。 251 | 252 | - twitter 253 | - googleplus 254 | - weibo 255 | - linkedin 256 | - qq 257 | - telegram 258 | 259 | ### dropdown 260 | 用于设置 Paradox 侧边栏用户下拉菜单,默认为空。 261 | 262 | >参考配置样式 263 | 264 | >```yaml 265 | dropdown: 266 | Email Me: 267 | link: "mailto: someone@example.com" 268 | icon: email 269 | ``` 270 | ### homepage 271 | 272 | 设置 “主页” 按钮 273 | 274 | ```yaml 275 | use: 设置 true 时会在侧边栏显示 “主页” 按钮. 276 | icon: 在 “主页” 前面显示一个 Material 图标。为空和被注释时则不显示. 277 | divider: 设置成 true 278 | archives 279 | ``` 280 | 281 | ### archives 282 | 283 | 用来设置归档下拉菜单。 284 | 285 | ```yaml 286 | use: 设置成 true 时在侧边栏显示归档。 287 | icon: 为归档添加一个 Material Icon,注释掉或为空则不显示 Icon 288 | divider: 设置成 true 后会在归档按钮底部增加一条分割线。 289 | ``` 290 | 291 | ### categories 292 | 293 | 用来设置分类显示按钮。 294 | 295 | ```yaml 296 | use: 设为 true 在侧边栏显示分类按钮。 297 | icon: 在分类按钮前显示一个 Material Icon,注释掉或为空则不显示 Icon 298 | divider: 设置成 true 后会在归档按钮底部增加一条分割线。 299 | ``` 300 | 301 | ### pages 302 | 303 | 用于设置独立页面的入口,默认为空。填写条目后独立页面入口将显示在: 304 | 305 | - `logo card` 的 `Page` 按钮下拉菜单中。(Scheme Paradox) 306 | - 侧边栏。(Scheme Paradox) 307 | - 站点左侧。(Scheme Isolation) 308 | 309 | 请按照如下样例添加个人独立页面。 310 | 311 | ```yaml 312 | pages: 313 | About: 314 | link: "#about" 315 | icon: person 316 | divider: false 317 | ``` 318 | 319 | 作为一个单位。 320 | 321 | - Name 是该独立页面的名称,请自行修改。 322 | - link 的参数为相对路径,对应 hexo 目录下的 `source` 文件夹内的相应文件夹。 323 | - icon 的参数为自定义的 Material 图标,可用图标可在 [Material icons](https://material.io/icons/) 查询。 324 | - divider 设置成 true 后会在该条目底部增加一条分割线 325 | 326 | ### article_num 327 | 328 | 在主题的侧边栏显示文章总数。 329 | 330 | ```yaml 331 | use: 设置成 true 时会在侧边栏显示文章总数。 332 | divider: 设置成 true 后会在该条目底部增加一条分割线。 333 | ``` 334 | 335 | ### footer 336 | 337 | 配置侧边栏的底部 338 | 339 | ```yaml 340 | divider: 设置成 true 后会在侧边栏底部之前增加一条分割线。 341 | theme: 设置成 true 后会在侧边栏底部增加一个指向 Material 主题的链接。 342 | ``` 343 | 344 | ## Integrated Services 345 | 请参考 [集成服务](/services/) 346 | -------------------------------------------------------------------------------- /intro-en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Intro 3 | version: 1.4.0 4 | permalink: en/intro 5 | id: 2 6 | lang: en 7 | --- 8 | 9 | Now we will introduce you about how to configure the theme, include `Site Information` `Style Settings` `Menu Settings`. 10 | 11 | ## Site information 12 | 13 | ### head 14 | 15 | Used to configure the generated HTML file header information. 16 | 17 | - `favicon`: the favicon 18 | - `high_res_favicon`: the favicon using high quality format 19 | - `apple_touch_icon`: the iOS Home button icon 20 | - `keywords`: the site keywords 21 | - `site_verification`: the verification of search engine console. 22 | - `google`: Google Search Console 23 | - `baidu`: Baidu Zhanzhang 24 | 25 | > 1. After logged in the console of search engine, choose to use `<meta>` tag to finish the verification. Then console will give you something like: 26 | ```html 27 | <meta name="xxxx-site-verification" content="xxxxxxxxxxxxxxxxxxxxxxxxxxxx" /> 28 | ``` 29 | > 2. Simply set `site_verification: xxxx:` with the things like `xxxxxxxxxxxxxxxxxxxxxxxxxxxx`. 30 | 31 | - `structured_data`: Default is true. When enable it, the theme will generate the structured-data for SEO. This feature request you configure the **`theme config`** and **`site config`** correctly.So if there are something wrong when `hexo g`, please check your config file or set this value as `false`, then try again. 32 | 33 | ### url 34 | 35 | Used to set jump links. 36 | 37 | - `rss`: the rss or atom url. 38 | - `daily_pic`: the redirect url from click on the daily picture 39 | - `logo`: the redirect url from click on the logo 40 | 41 | > You can read the [Service](/service/) about how to set up the RSS. 42 | 43 | ## Style Settings 44 | 45 | ### scheme 46 | 47 | Material theme provides a variety of theme designs, also known as "Scheme". Material currently supports three schemes. 48 | 49 | #### Nexus (under development) 50 | 51 | This is the most standard Material Design style. 52 | 53 | #### Paradox (default) 54 | 55 | This is the original style of Material. The layout is centered and illustrated. 56 | 57 | #### Isolation 58 | 59 | This is a variant of Paradox using Jane style. It is concise and clear. 60 | 61 | ---- 62 | 63 | If you want to use one of the themes, delete the '#' before the scheme name. 64 | For example, to select the Paradox scheme, simply use: 65 | 66 | ```yaml 67 | #scheme: Nexus 68 | scheme: Paradox 69 | #scheme: Isolation 70 | ``` 71 | 72 | ### uiux 73 | 74 | Used to set the user interface and user experience. 75 | 76 | - `slogan`: the slogan displayed in the `blog_info` module, now we support multi line slogan (see below). 77 | 78 | Single line slogan: 79 | 80 | ```yaml 81 | slogan: Slogan 82 | ``` 83 | 84 | Multi line slogan: 85 | 86 | ```yaml 87 | slogan: 88 | - "First Line" 89 | - "Second Line" 90 | - "Third Line" 91 | ``` 92 | 93 | - `theme_color`: the main color 94 | - `theme_sub_color`: the secondary color 95 | - `hyperlink_color`: the color used for hyperlinks 96 | - `button_color`: the color used for buttons 97 | - `android_chrome_color`: the color of the Chrome address bar 98 | - `buffer`: the top loading progress bar buffers 99 | - `nprogress_color`: the color of the top loading progress bar 100 | - `nprogress_buffer`: the top loading progress bar buffers 101 | 102 | > [color palette](https://material.google.com/style/color.html#color-color-palette). 103 | 104 | ### js_effect 105 | 106 | Used to control the JavaScript features. 107 | 108 | - `fade`: part of the module to load the page fade effect (default: true) 109 | - `smoothscroll`: page smooth scrolling effects (default: false) 110 | 111 | ### reading 112 | 113 | Used to set the reading experience. 114 | 115 | - `entry_excerpt`: the home page outputs the character length of the digest (default: 80) 116 | 117 | ### thumbnail 118 | 119 | Used to set up article thumbnail correlation. 120 | 121 | - `purecolor`: the color to fill (solid thumbnail used if no one is set) 122 | - `random_amount`: the number of random pictures taken from the `themes/material/source/img/random` folder 123 | 124 | ### background 125 | 126 | Used to set the site background. 127 | 128 | - `purecolor`: the background color 129 | - `bgimg`: the background image path (default: `themes/material/source/img/bg.png`) 130 | - `bing`: used to enable bing pictures 131 | - `parameter`: 132 | - `color=`: black, blue, brown, green, multi, orange, pink, purple, red, white, yellow. 133 | - `type=`: A (animal), C (culture), N (nature), S (space), T (travel). 134 | 135 | #### img 136 | 137 | Used to set the site image. 138 | 139 | - `logo`: the logo 140 | - `avatar`: your avatar 141 | - `daily_pic`: the daily picture 142 | - `sidebar_header`: the header picture 143 | - `footerico`: the prefix of the SNS icons from the `themes/material/source/img/footer` folder 144 | - `random_thumbnail`: the path of the random thumbnail 145 | - `footer_image`: you can put as any images as you want at the bottom of `sidebar`. 146 | 147 | For instance, you can display the `upyun` logo as following: 148 | 149 | ```yaml 150 | footer_image: 151 | upyun_logo: 152 | link: "https://www.upyun.com/" 153 | src: "/img/upyun_logo.png" 154 | ``` 155 | 156 | ### fonts 157 | 158 | - `fonts`: Used to set the site fonts. 159 | 160 | > The default values are `Roboto, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Microsoft Yahe, Arial` 161 | > The font settings are more standardized for Material Design, no special requirements without additional changes. 162 | > When update the fonts, you should add fonts embed in `head.yml`. You can read [expert](/en/expert/) about how to use `head.yml` 163 | 164 | - `use`: Used to set which fonts lib will be uesd in the theme. 165 | 166 | > We have built in three available value of "use": `google` `ustc` `baomitu`. 167 | > Also, you can configured it as `custom` to use the proxy of google fonts service your like, in order to boost your site in China, where vistors can't load google font normally. 168 | > - `google`: use `fonts.googleapi.com` to load `Roboto` and `Material Icon`. 169 | > - `baomitu`: use `lib.baomitu.com`(a public cdn which maintained by Qihoo 75Team) to load `Roboto` and `Material Icon` 170 | > - `ustc`: use `fonts.proxy.ustclug.org`(a proxy service of Google Font which maintained by University of Science and Technology of China and USTCLUG) to load `Roboto` and `Material Icon` 171 | > - `custom`: use the font lib in whose URI your configured in `custom_font_host` to load `Roboto` and `Material Icon`. It should be a mirror of Google Font. 172 | > **Attention! The URI in `custom_font_host` should with proctol (such as https://) and without `/` at the end** 173 | 174 | ### card_elevation 175 | 176 | Used to set elevation of the card on the list of the posts. 177 | 178 | ### copyright_since 179 | 180 | Specify the date when the site was setup. 181 | 182 | > For example, if you set it as 2015, then footer will show '© 2015 - 2017' 183 | 184 | When it is empty, the footer will only show the current year. 185 | 186 | ### footer text 187 | You can specify the text you want to show in footer, HTML tag is supported. 188 | For example, you can setup ICP license number as: 189 | 190 | ```yml 191 | footer_text: '<a href="http://www.miitbeian.gov.cn" rel="nofollow">某ICP备xxxxxxxx号-x</a>' 192 | ``` 193 | 194 | ### qrcode 195 | 196 | Use this to show qrcode in your article. 197 | 198 | - enable: show qrcode button in post or not. 199 | - use: choose which method to generate the Qrcode. Available value of "use": plugin | online 200 | 201 | > When using `plugin`, you need to install `hexo-helper-qrcode` to support this feature. Using `npm install hexo-helper-qrcode --save` to install the plugin. 202 | > When using `online`, the Qrcode will generate by `pan.baidu.com`. We DO NOT recommend you to use it. 203 | 204 | ### Code 205 | 206 | Use `Google Prettify` to highlight the code 207 | if true, check highlight option in _config.yml. Make sure that default code highlight plugin is disabled. 208 | 209 | ```yml 210 | prettify: 211 | enable: false # Available value: true | false, 212 | theme: "vibrant-ink" # default value: "vibrant-ink" # theme-name without '.css' 213 | ``` 214 | 215 | ### Post License 216 | You can specify the text you want to show in the end of your posts and pages, HTML tag is supported. 217 | For example, you can setup a CC license as: 218 | 219 | ```yml 220 | license: 'This blog is under a <a href="/creativecommons.html" target="_blank">CC BY-NC-SA 3.0 Unported License</a>' 221 | ``` 222 | > You can also use Front-Matter `license` to override this setting. 223 | 224 | ## Menu Settings 225 | 226 | ### toc 227 | 228 | Choose whether the line_number of toc(Table of Content) will show or not. Available value of "linenumber": true | false 229 | 230 | ### sns 231 | 232 | Used to fill in your SNS information. Except for `email` (which is displayed in the sidebar), a specific icon will be put inside the footer for each url you put. 233 | 234 | - `email` 235 | - `facebook` 236 | - `twitter` 237 | - `googleplus` 238 | - `weibo` 239 | - `instagram` 240 | - `tumblr` 241 | - `github` 242 | - `linkedin` 243 | - `zhihu` 244 | - `bilibili` 245 | - `telegram` 246 | 247 | ### sns_share 248 | 249 | Used to choose which items will be displayed in share menu. 250 | 251 | - `twitter` 252 | - `facebook` 253 | - `googleplus` 254 | - `weibo` 255 | - `linkedin` 256 | - `qq` 257 | - `telegram` 258 | 259 | ### sidebar 260 | 261 | #### dropdown 262 | 263 | Used to set the Paradox sidebar drop-down menu (empty by default). 264 | 265 | Refer to the configuration style 266 | 267 | ```yaml 268 | dropdown: 269 | Email Me: 270 | link: "#" 271 | icon: email 272 | ``` 273 | 274 | #### homepage 275 | 276 | Used to set the home page button. 277 | 278 | - `use`: set `true` to display this button is the sidebar 279 | - `icon`: add an Material Design icon before the name of the button. Let it empty for no icon. 280 | - `divider`: set `true` to add a divider after the button 281 | 282 | #### archives 283 | 284 | Used to set the archives button. 285 | 286 | - `use`: set `true` to display this button is the sidebar 287 | - `icon`: add an Material Design icon before the name of the button. Let it empty for no icon. 288 | - `divider`: set `true` to add a divider after the button 289 | 290 | #### categories 291 | 292 | Used to set the categories button. 293 | 294 | - `use`: set `true` to display this button is the sidebar 295 | - `icon`: add an Material Design icon before the name of the button. Let it empty for no icon. 296 | - `divider`: set `true` to add a divider after the button 297 | 298 | #### pages 299 | 300 | Used to set up custom pages (empty by default). The pages will appear in the sidebar. 301 | 302 | Refer to the configuration style. Let the icon empty if you don't need one. Set `true` to divider if you want a divider after the page button. 303 | 304 | ```yaml 305 | pages: 306 | About: 307 | link: "#about" 308 | icon: person 309 | divider: false 310 | timeline archive: 311 | link: "/timeline/" 312 | icon: 313 | divider: false 314 | ``` 315 | 316 | #### article_num 317 | 318 | Used to display the number of articles. 319 | 320 | - `use`: set `true` to display this button is the sidebar 321 | - `divider`: set `true` to add a divider after the button 322 | 323 | #### footer 324 | 325 | Used to customize the sidebar footer. 326 | 327 | - `divider`: set `true` to add a divider before the footer 328 | - `theme`: set `true` to display a link to the theme site 329 | - 330 | 331 | ## Integrated Services 332 | Read the [Service](/en/services/) 333 | --------------------------------------------------------------------------------