chore(docs): update docs for Hexo 5.0

pull/832/head
ppoffice 2020-08-29 18:38:49 -04:00
parent 5f67618cd3
commit e4d22d4f9e
No known key found for this signature in database
GPG Key ID: B33335481CC0D498
23 changed files with 369 additions and 415 deletions

View File

@ -9,7 +9,7 @@
"bulma-stylus": "0.8.0",
"hexo": "^5.0.2",
"hexo-algolia": "^1.3.1",
"hexo-component-inferno": "^0.8.1",
"hexo-component-inferno": "^0.8.2",
"hexo-deployer-git": "^2.0.0",
"hexo-filter-github-emojis": "^2.1.0",
"hexo-generator-archive": "^1.0.0",

View File

@ -67,9 +67,9 @@ in some legacy browsers, including Internet Explorer and legacy Microsoft Edge.
<!-- more -->
To enable the Cyberpunk theme, open your theme's `_config.yml` and make the following change:
To enable the Cyberpunk theme, open `_config.icarus.yml` and make the following change:
{% codeblock themes/icarus/_config.yml lang:diff %}
{% codeblock _config.icarus.yml lang:diff %}
- variant: default
+ variant: cyberpunk
{% endcodeblock %}
@ -78,10 +78,10 @@ You may also want to change the theme of highlighted code blocks.
In that case, you can find some dark highlight.js themes
[here](https://github.com/highlightjs/highlight.js/tree/master/src/styles).
Copy the file name, excluding the `.css` extension, and put it in the `article.highlight.theme`
option in Icarus' `_config.yml`.
option in `_config.icarus.yml`.
For example, if you want to change the theme to `xt256`, make the following change:
{% codeblock themes/icarus/_config.yml lang:diff %}
{% codeblock _config.icarus.yml lang:diff %}
# Article related configurations
article:
highlight:
@ -92,4 +92,4 @@ article:
Apart from the color palette, Icarus also used two image resources that are placed on the top
navigation bar and bottom page footer from the official Cyberpunk 2077 website.
If you wish to make further modifications to this theme variant, you can take a look at
`themes/icarus/source/css/cyberpunk.styl`.
`<icarus_directory>/source/css/cyberpunk.styl`.

View File

@ -47,7 +47,7 @@ Currently, Icarus offers the following built-in CDN providers:
The default CDN settings are:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
providers:
cdn: jsdelivr
fontcdn: google
@ -124,7 +124,7 @@ https://custom.fontawesome.mirror/some.stylesheet.css
All of the above should be put in the `providers` section of the theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
providers:
cdn: 'https://some.cdn.domain.name/${package}/${version}/${filename}'
fontcdn: 'https://some.google.font.mirror/${type}?family=${fontname}'

View File

@ -60,7 +60,7 @@ Refer to <a href="http://changyan.kuaizhan.com/static/help/o-beian.html">ICP Lic
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: changyan
app_id: ????appid????
@ -114,7 +114,7 @@ Refer to <a href="http://changyan.kuaizhan.com/static/help/o-beian.html">ICP Lic
which maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: disqus
shortname: my-hexo-blog-1
@ -172,7 +172,7 @@ for the detailed configuration process of DisqusJS.
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: disqusjs
shortname: my-hexo-blog-1
@ -202,7 +202,7 @@ for the detailed configuration process of DisqusJS.
1. To enable Facebook comment, set the `type` of `comment` to `facebook`:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: facebook
{% endcodeblock %}
@ -239,7 +239,7 @@ for the detailed configuration process of DisqusJS.
maps the following Gitalk configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: gitalk
client_id: xxxxxxxxxxxxxxxxxxxx
@ -280,7 +280,7 @@ You can choose Gitalk or utterances as an alternative GitHub Issue-based comment
Here is an example of the Gitment configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: gitment
owner: you_github_name
@ -311,7 +311,7 @@ However, unlike the other services, Isso requires a web host for running the Iss
For example, if your service URL is `https://posativ.org/isso/api/`, you will have the following
comment configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: isso
url: posativ.org/isso/api
@ -375,7 +375,7 @@ However, unlike the other services, Isso requires a web host for running the Iss
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: livere
uid: ABCD1234O0OxxxxXXXX000==
@ -429,7 +429,7 @@ However, unlike the other services, Isso requires a web host for running the Iss
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: utterances
repo: Your-GitHub-Username/Your-Public-Repo-Name
@ -454,7 +454,7 @@ However, unlike the other services, Isso requires a web host for running the Iss
details and possible values of the optional settings.
Here is an example configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: valine
app_id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

View File

@ -11,7 +11,7 @@ cover: /gallery/covers/vector_landscape_2.svg
thumbnail: /gallery/covers/vector_landscape_2.svg
---
Icarus' default theme configuration file is `themes/icarus/_config.yml`.
Icarus' default theme configuration file is `_config.icarus.yml`.
It defines the global layout and style settings of the theme and controls external features such as plugins and widgets.
This article details the general configurations of the theme.
It also explains what configuration files are used and how Icarus generate and validate these configurations.
@ -27,23 +27,23 @@ It also explains what configuration files are used and how Icarus generate and v
## General Theme Configurations
### Configuration version
### Configuration Version
This version code is related to and but not always the same as the theme version code.
Icarus uses it to determine whether to upgrade the default theme configuration file.
You should not change it by yourself.
{% codeblock themes/icarus/_config.yml lang:yaml %}
version: 3.0.0
{% codeblock _config.icarus.yml lang:yaml %}
version: 4.0.0
{% endcodeblock %}
### Theme variant
### Theme Variant
Choose a skin for Icarus.
`"default"` and `"cyberpunk"` are supported values currently.
You can take a look at the Cyberpunk variant {% post_link demo/Cyberpunk "here" %}.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
variant: default
{% endcodeblock %}
@ -53,13 +53,13 @@ Set the logo of your site.
It will display on the navigation bar and the footer.
The value of the `logo` can either be the path or URL to your logo image:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
logo: /img/logo.svg
{% endcodeblock %}
or text if you set it like the following:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
logo:
text: My Beautiful Site
{% endcodeblock %}
@ -68,7 +68,7 @@ logo:
You can specify the path or URL to your site's favicon in the `head` section.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
head:
favicon: /img/favicon.svg
{% endcodeblock %}
@ -80,7 +80,7 @@ You should leave most of the settings blank in the configuration file.
Only set those settings in the front-matter of your post if you need them.
Please refer to [Hexo documentation](https://hexo.io/docs/helpers.html#open-graph) for details on each setting.
{% codeblock themes/icarus/_config.yml lang:yaml >folded %}
{% codeblock _config.icarus.yml lang:yaml >folded %}
head:
open_graph:
# Page title (og:title) (optional)
@ -126,7 +126,7 @@ Only set those settings in the front-matter of your post if you need them.
Please refer to [Search for Developers](https://developers.google.com/search/docs/guides/intro-structured-data)
for details on each setting.
{% codeblock themes/icarus/_config.yml lang:yaml >folded %}
{% codeblock _config.icarus.yml lang:yaml >folded %}
head:
structured_data:
# Page title (optional)
@ -154,7 +154,7 @@ The value of each `meta` item should be in the `<field_name>=<field_value>` form
with `field_name` and `field_value` represent the field and value of the `<meta>` tag respectively.
Separate the `<field_name>=<field_value>` pairs with `;` if the `<meta>` tag has multiple fields and values.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
head:
meta:
- 'name=theme-color;content=#123456'
@ -165,7 +165,7 @@ head:
You can add a link to your RSS feed at the `rss` setting in the `head` section.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
head:
rss: /path/to/atom.xml
{% endcodeblock %}
@ -176,7 +176,7 @@ The `navbar` section defines the menu items and links in the navigation bar.
You may put any menu item in the navigation bar by adding `<link_name>: <link_url>` to the `menu` setting.
To put links on the right side of the navigation bar, add `<link_name>: <link_url>` to the `links` setting.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
navbar:
# Naviagtion menu items
menu:
@ -206,7 +206,7 @@ You can display a FontAwesome icon instead of text-only link with the following
The `footer` section defines the links on the right side of the page footer.
The link format is exactly the same as `links` in the `navbar` section.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
footer:
links:
Creative Commons:
@ -232,7 +232,7 @@ To hide the "copy" button of every code block, set `clipboard` to `false`.
If you wish to fold or unfold all code blocks, set the `fold` setting to `"folded"` or `"unfolded"`.
You can also disable the folding feature by leaving the `fold` setting empty.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
article:
highlight:
# Code highlight themes
@ -284,7 +284,7 @@ For example, to use `<your blog>/source/gallery/image.jpg` as a thumbnail image,
You can show a word counter and the estimated reading time of your article above the article title by
setting `readtime` to `true` in the `article` section.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
article:
readtime: true
{% endcodeblock %}
@ -295,7 +295,7 @@ You can show a section at the end of your posts/pages describing the licensing o
Both text and icons are accepted as license links.
This configuration is the same as `links` in the navigation bar or the footer:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
article:
# Article licensing block
licenses:
@ -310,7 +310,7 @@ article:
To make a sidebar fixed when you scroll the page, set the `sticky` setting of that sidebar to `true` in
the `sidebar` section.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
sidebar:
left:
sticky: false
@ -319,7 +319,7 @@ sidebar:
{% endcodeblock %}
### Other configurations
### Other Configurations
You can refer to the [Icarus User Guide](/hexo-theme-icarus/tags/Icarus-User-Guide/) to learn more about
third-party plugins, widgets, and CDN provider configurations.
@ -327,34 +327,24 @@ third-party plugins, widgets, and CDN provider configurations.
## Configuration Files and Priority
Apart from the default theme configuration file at `themes/icarus/_config.yml`, Icarus also looks at the following
Apart from the default theme configuration file `_config.icarus.yml`, Icarus also looks at the following
locations for alternative configurations:
- `themes/icarus/_config.post.yml` and `themes/icarus/_config.page.yml`
- The site configuration file at `_config.yml`
- Layout configuration files at `_config.post.yml` and `_config.page.yml`
- Post/page's [front-matter](https://hexo.io/docs/front-matter.html)
- Site `_config.yml` in the root directory
- (Deprecated) Legacy theme configuration file at `themes/icarus/_config.yml`
- (Deprecated) Legacy layout configuration file at `themes/icarus/_config.post.yml` and `themes/icarus/_config.page.yml`
`_config.post.yml` and `_config.page.yml` follow the same format and configuration definitions as the default theme
configuration file.
You can put configurations that apply to all posts in `_config.post.yml`, and these configurations will override
`themes/icarus/_config.yml`.
For example, you can adopt a two-column layout in all posts by moving all widgets to one side of the page while
keeping a three-column layout in other pages:
### Layout Configuration Files
{% codeblock themes/icarus/_config.yml lang:yaml %}
widgets:
-
type: recent_posts
position: left
-
type: categories
position: right
-
type: tags
position: right
{% endcodeblock %}
Layout configuration files follow the same format and definitions as theme configuration files.
The configurations in `_config.post.yml` apply to all posts, and those in `_config.page.yml` apply to all custom pages.
They both override configurations in theme configuration files.
{% codeblock themes/icarus/_config.post.yml lang:yaml %}
For example, you can adopt a two-column layout for all posts in `_config.post.yml`:
{% codeblock _config.post.yml lang:yaml %}
widgets:
-
type: recent_posts
@ -367,10 +357,25 @@ widgets:
position: left
{% endcodeblock %}
Similarly, `_config.page.yml` applies to all Hexo pages and overrides the default theme configurations.
while keeping a three-column layout in all other pages:
If you wish to override configurations only for a certain post/page, you can put these configurations in the
front-matter of that post/page.
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
type: recent_posts
position: left
-
type: categories
position: right
-
type: tags
position: right
{% endcodeblock %}
### Post/Page Front-matter
If you wish to override theme configurations only for a certain post/page, you can set them in the front-matter
of that post/page.
For example, you can change the code block highlight theme of a single post by setting it in that post's
front-matter like the following:
@ -384,58 +389,62 @@ article:
# Some Post
{% endcodeblock %}
The above setting will always override the `article.highlight` in `_config.post.yml` and `_config.yml`
The above setting will always override the `article.highlight` in `_config.post.yml` and `_config.icarus.yml`
for that post.
This layered configuration system is handy for differentiating page customizations and optimizations
This layered configuration scheme is handy for differentiating page customizations and optimizations
for different audiences.
For example, you can enable faster CDNs or a localized comment service based on the country and language
For instance, you can enable faster CDNs or a localized comment service based on the country and language
of your page viewers.
However, it should be noted that inherit post or page attributes defined by Hexo will not override the
theme configurations from the front-matter.
Examples are:
- `title`
- `date`
- `updated`
- `comments` (not `comment`)
- `layout`
- `source`
- `photos`
- `excerpt`
However, it should be noted that post or page attributes defined by Hexo will not override the theme
configurations from the front-matter.
Examples are `title`, `date`, `updated`, `comments`, `layout`, `source`, `photos`, and `excerpt`.
Lastly, all configuration sources listed above will override the site configuration file `_config.yml`
for the settings used by the Icarus.
For instance, `title` in the `themes/icarus/_config.yml` will override `title` in the `_config.yml`, but
### Site Configuration File
All configuration sources listed above, including theme configuration files, layout configuration files,
and post/page front-matter, will override the site configuration file only for configurations
used by Icarus.
For instance, `title` in the `_config.icarus.yml` will override `title` in the `_config.yml`, but
`new_post_name` will not since it is not used by Icarus.
Also, the `theme_config` option in the site configuration file will merge with and override theme
configurations from theme configuration files.
However, using this option is highly discouraged.
### Conclusion
In conclusion, the scopes of the configuration sources and their priorities are:
- For a certain post or page
- front-matter overrides all configuration sources below.
- `themes/icarus/_config.post.yml` and `themes/icarus/_config.page.yml` override all configuration sources below.
- `themes/icarus/_config.yml` overrides all configuration sources below.
- `_config.yml`.
- Post/Page front-matter overrides all following sources.
- Layout configuration files override all following sources.
- `theme_config` option in the site configuration file overrides all following sources.
- Theme configuration files override all following sources.
- The site configuration file.
- For all posts or pages
- `themes/icarus/_config.post.yml` or `themes/icarus/_config.page.yml` override all configuration sources below.
- `themes/icarus/_config.yml` overrides all configuration sources below.
- `_config.yml`.
- Layout configuration files override all following sources.
- `theme_config` option in the site configuration file overrides all following sources.
- Theme configuration files override all following sources.
- The site configuration file.
- For all posts, pages, and index pages
- `themes/icarus/_config.yml` overrides all configuration sources below.
- `_config.yml`.
- `theme_config` option in the site configuration file overrides all following sources.
- Theme configuration files override all following sources.
- The site configuration file.
## Configuration Generation and Validation
All Icarus theme configurations are written in the [YAML language](https://yaml.org/).
The default configuration file `themes/icarus/_config.yml` is generated automatically from a set of
[JSON schemas](https://json-schema.org/) when Hexo processes the theme.
That's why you don't see an example file (`_config.yml.example`) under the theme directory.
Most of the JSON schemas are in the `themes/icarus/include/schema` directory, while the others are
All Icarus theme configurations are written in [YAML language](https://yaml.org/).
Icarus will automatically generate the default configuration file `_config.icarus.yml` from a set of
[JSON schemas](https://json-schema.org/) if it does not exist.
That's why you don't see an example configuration file (such as `_config.yml.example`) under the theme directory.
Most of the JSON schemas are in the `<icarus_directory>/include/schema` directory, while the others are
in the [ppoffice/hexo-component-inferno](https://github.com/ppoffice/hexo-component-inferno) repository.
You can attach the `--icarus-dont-generate-config` flag to your `hexo` commands to prevent automatic configuration
generation.
@ -467,7 +476,7 @@ WARN [
Additionally, Icarus will execute migration scripts to upgrade the default theme configuration file to the newest
version if it is not.
These scripts are in the `themes/icarus/include/migration` directory.
These scripts are in the `<icarus_directory>/include/migration` directory.
You may disable the upgrade by appending the `--icarus-dont-upgrade-config` flag to your `hexo` commands.
Finally, Icarus will also check the Node.js package dependencies and remind you to install them if you haven't.

View File

@ -33,7 +33,7 @@ This article covers donation button configurations supported by Icarus 3.
If you need to display multiple donation buttons at once, add individual button configuration
to the `donates` array like the following:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: ... # Button 1
@ -67,7 +67,7 @@ Please refer to it for a complete list of supported buttons and their configurat
1. Register for [Afdian.net](https://afdian.net/) and copy the URL to your personal page.
2. Add the following configuration to your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: afdian
@ -84,7 +84,7 @@ Please refer to it for a complete list of supported buttons and their configurat
2. Save the QR code picture to the asset directory of your Hexo website, or upload it to an image sharing service.
3. Add the following configuration to your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: alipay
@ -100,7 +100,7 @@ Please refer to it for a complete list of supported buttons and their configurat
1. Register for [Buy me a Coffee](https://www.buymeacoffee.com/) and copy the URL to your personal page.
2. Add the following configuration to your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: buymeacoffee
@ -154,7 +154,7 @@ Please refer to it for a complete list of supported buttons and their configurat
maps to the following configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: paypal
@ -169,7 +169,7 @@ Please refer to it for a complete list of supported buttons and their configurat
1. Register for [Patreon](https://www.patreon.com/) and copy the URL to your personal page.
2. Add the following configuration to your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donate:
-
type: patreon
@ -185,7 +185,7 @@ Please refer to it for a complete list of supported buttons and their configurat
2. Save the QR code picture to the asset directory of your Hexo website, or upload it to an image sharing service.
3. Add the following configuration to your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: wechat

View File

@ -36,7 +36,7 @@ Icarus 3 runs on Node.js 8.3.0 or a newer version.
It also requires Hexo 4.2.0 or a newer version.
Apart from that, make sure you have all the Node.js dependencies installed.
You can find them in the `peerDependencies` section of the
[`themes/icarus/package.json`](https://github.com/ppoffice/hexo-theme-icarus/blob/master/package.json)
[`<icarus_directory>/package.json`](https://github.com/ppoffice/hexo-theme-icarus/blob/master/package.json)
file.
Also, remove all unused Node.js dependencies from your site, or they may cause strange problems to
Icarus.
@ -55,7 +55,7 @@ Change the following setting:
+ language: <language_name>
{% endcodeblock %}
You can find all available translations under the `themes/icarus/languages` directory.
You can find all available translations under the `<icarus_directory>/languages` directory.
The `<language_name>` is the translation file name without the `.yml` extension.
@ -67,11 +67,11 @@ How do I change the page width? How do I use the one/two/three-column layout?
</div>
</article>
To change the page width, edit the style file `themes/icarus/include/style/responsive.styl`.
To change the page width, edit the style file `<icarus_directory>/include/style/responsive.styl`.
It defines the container width under different screen sizes.
To change the width of the widgets or main content, edit `themes/icarus/layout/common/widgets.jsx` and
`themes/icarus/layout/layout.jsx`.
To change the width of the widgets or main content, edit `<icarus_directory>/layout/common/widgets.jsx` and
`<icarus_directory>/layout/layout.jsx`.
Find the CSS class names like `is-12`, `is-8-tablet`, and `is-4-widescreen` in these files.
The number in the class names marks the number of columns a widget or main content takes.
The screen size after the number, such as `tablet` and `widescreen`, refers to the condition when the column
@ -81,7 +81,7 @@ Change the number in the class names such that the column count of main column a
For example, to have the main content column wider on `widescreen`, you can make the following changes:
{% codeblock themes/icarus/layout/layout.jsx lang:diff >folded %}
{% codeblock &lt;icarus_directory&gt;/layout/layout.jsx lang:diff >folded %}
<div class={classname({
column: true,
'order-2': true,
@ -92,7 +92,7 @@ For example, to have the main content column wider on `widescreen`, you can make
'is-8-tablet is-8-desktop is-6-widescreen': columnCount === 3
{% endcodeblock %}
{% codeblock themes/icarus/layout/common/widgets.jsx lang:diff >folded %}
{% codeblock &lt;icarus_directory&gt;/layout/common/widgets.jsx lang:diff >folded %}
function getColumnSizeClass(columnCount) {
switch (columnCount) {
case 2:
@ -126,13 +126,13 @@ This help theme developers better reuse common components across different theme
components easy for average users.
To customize these components, copy the layout files from the `hexo-component-inferno` repository and place
them in the corresponding directories under `themes/icarus/layout`.
them in the corresponding directories under `<icarus_directory>/layout`.
For example, if you want to customize the Valine comment plugin, you can copy
[`src/view/comment/valine.jsx`](https://github.com/ppoffice/hexo-component-inferno/blob/0.2.4/src/view/comment/valine.jsx)
from the `hexo-component-inferno` repository to `themes/icarus/layout/comment/valine.jsx`.
from the `hexo-component-inferno` repository to `<icarus_directory>/layout/comment/valine.jsx`.
Also, remember to fix Node.js imports like the following:
{% codeblock themes/icarus/layout/comment/valine.jsx lang:diff %}
{% codeblock &lt;icarus_directory&gt;/layout/comment/valine.jsx lang:diff %}
- const { cacheComponent } = require('../../util/cache');
+ const { cacheComponent } = require('hexo-component-inferno/lib/util/cache');
{% endcodeblock %}
@ -231,7 +231,7 @@ If you don't want to enable a certain plugin or widget, delete it or comment it
For example, you can disable the comment plugins by commenting out the following lines:
{% codeblock themes/icarus/_config.yml lang:diff %}
{% codeblock _config.icarus.yml lang:diff %}
- comment:
- type: disqus
- shortname:

View File

@ -46,7 +46,7 @@ The gallery plugin of Icarus contains both [lightGallery](https://sachinchoolur.
[Justified Gallery](https://miromannino.github.io/Justified-Gallery/) extensions.
To enable it, set `plugins` > `gallery` to `true` in your theme configurations.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
gallery: true
{% endcodeblock %}
@ -115,7 +115,7 @@ You can also view the full image using lightGallery by clicking on any image.
You can use the KaTeX plugin to render \\(\TeX\\) expressions.
To enable KaTeX, please set `plugins` > `katex` to `true` in your theme configurations.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
katex: true
{% endcodeblock %}
@ -171,7 +171,7 @@ $$
You can use MathJax to render \\(\TeX\\), MathML, or AsciiMath expressions.
To enable MathJax, please set `plugins` > `mathjax` to `true` in your theme configurations.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
mathjax: true
{% endcodeblock %}
@ -356,7 +356,7 @@ your site's visitors and remind them to upgrade their browsers.
To enable it, please set `plugins` > `outdated_browser` to `true` in your theme configurations.
Click [here](https://bestvpn.org/outdatedbrowser/en) to see a live preview of this plugin.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
outdated_browser: true
{% endcodeblock %}
@ -369,7 +369,7 @@ plugins:
Page Loading Animations are enabled by Icarus by default.
To disable it, please set `plugins` > `animejs` to `false` in your theme configurations.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
animejs: false
{% endcodeblock %}
@ -377,7 +377,7 @@ plugins:
Also, to disable the page loading progressbar, please set `plugins` > `progressbar` to `false` in
your theme configurations.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
progressbar: false
{% endcodeblock %}

View File

@ -106,7 +106,7 @@ Please refer to it for a complete list of supported plugins and their configurat
6. Finally, set the search engine to Algolia in your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
search:
type: algolia
{% endcodeblock %}
@ -118,7 +118,7 @@ Please refer to it for a complete list of supported plugins and their configurat
1. Open theme configuration file and set search engine to Baidu:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
search:
type: baidu
{% endcodeblock %}
@ -154,7 +154,7 @@ Please refer to it for a complete list of supported plugins and their configurat
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
search:
type: google_cse
cx: 012345601234560123456:abcdefghijklmn
@ -168,7 +168,7 @@ Please refer to it for a complete list of supported plugins and their configurat
1. Insight is the default search engine of this site.
You can enable it using the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
search:
type: insight
{% endcodeblock %}

View File

@ -75,7 +75,7 @@ Use it with caution.
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: addthis
install_url: //s7.addthis.com/js/300/addthis_widget.js#pubid=ra-xxxxxxxxxxxxx
@ -91,7 +91,7 @@ Use it with caution.
1. You can activate AddToAny without user registration.
Just put the following code to your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: addtoany
{% endcodeblock %}
@ -116,7 +116,7 @@ Take the following steps if you want to customize the share buttons:
you need to copy the layout file
([src/view/share/addtoany.jsx](https://github.com/ppoffice/hexo-component-inferno/blob/0.2.2/src/view/share/addtoany.jsx))
of AddToAny from this repository
to `themes/icarus/layout/share/addtoany.jsx`.
to `<icarus_directory>/layout/share/addtoany.jsx`.
Then, replace the AddToAny code in `addtoany.jsx` and fix the package import in the file header.
For example, assume the following code is what you get from the last step:
@ -135,7 +135,7 @@ Take the following steps if you want to customize the share buttons:
then you should make the following changes to `addtoany.jsx`:
{% codeblock themes/icarus/layout/share/addtoany.jsx lang:diff >folded %}
{% codeblock &lt;icarus_directory&gt;/layout/share/addtoany.jsx lang:diff >folded %}
const { Component, Fragment } = require('inferno');
- const { cacheComponent } = require('../../util/cache');
+ const { cacheComponent } = require('hexo-component-inferno/lib/util/cache');
@ -193,7 +193,7 @@ Use other services as alternatives.
1. You can activate Baidu Share without user registration.
Just put the following code to your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: bdshare
{% endcodeblock %}
@ -215,7 +215,7 @@ Use other services as alternatives.
1. You can activate Share.js without user registration.
Just put the following code to your theme configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: sharejs
{% endcodeblock %}
@ -261,7 +261,7 @@ Use other services as alternatives.
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: sharethis
install_url: https://platform-api.sharethis.com/js/sharethis.js#property=xxxxxxxxxxxxx&product=inline-share-buttons

View File

@ -69,7 +69,7 @@ Use them with caution.
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
baidu_analytics:
tracking_id: 3f06f2b732a5b1034c989f74e28d0eea
@ -83,7 +83,7 @@ Use them with caution.
1. Set the `plugins` > `busuanzi` to `true` to enable [BuSuanZi web counter](https://busuanzi.ibruce.info/)
and display the number of visitors on the header of each blog post and the bottom of the page.
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
busuanzi: true
{% endcodeblock %}
@ -116,7 +116,7 @@ Use them with caution.
maps to the following theme configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
cnzz:
id: 123456789000
@ -149,7 +149,7 @@ Use them with caution.
{% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/google-analytics-get-code.png 360 '"Get Code - Google Analytics" "Get Code - Google Analytics"' %}
<br>
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
google_analytics:
tracking_id: UA-12345678-0
@ -179,7 +179,7 @@ Use them with caution.
{% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/hotjar-get-code.png 360 '"Get Code - Hotjar" "Get Code - Hotjar"' %}
<br>
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
hotjar:
site_id: 1234567

View File

@ -62,7 +62,7 @@ They will appear in the order of their definitions.
The `type` and `position` settings are required for every widget.
Here is an example:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
type: ... # Widget 1
@ -97,7 +97,7 @@ Please refer to it for a complete list of supported plugins and their configurat
You can showcase the post author/site admin information via the profile widget.
Its configuration is listed below:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -151,7 +151,7 @@ Some notes on the configuration:
To show the table of contents of the current post, add the following widget configuration to your theme
configurations:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
type: toc
@ -173,7 +173,7 @@ Post content...
You can display a list of external sites with the external links widget.
An example configuration is listed below:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: left
@ -189,7 +189,7 @@ widgets:
Use the following configuration to enable the recent posts widget:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -201,7 +201,7 @@ widgets:
Use the following configuration to enable the archives widget:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -213,7 +213,7 @@ widgets:
Use the following configuration to enable the categories widget:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -225,7 +225,7 @@ widgets:
Use the following configuration to enable the tags widget:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -278,7 +278,7 @@ To enable this widget, take the following steps:
Copy the ID after `uri=` (e.g., `feedforall/ABCD`) to the `feedburner_id` setting of the widget configuration:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: left
@ -296,7 +296,7 @@ Then, copy the values of `data-ad-client` and `data-ad-slot` from the AD HTML co
the `client_id` and `slot_id` setting of the widget configuration, respectively.
Here is an example:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: left

View File

@ -47,7 +47,7 @@ Icarus为你提供了几种内置的CDN提供商来承载Icaurs所用到的第
默认的CDN服务提供商配置为
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
providers:
cdn: jsdelivr
fontcdn: google
@ -122,7 +122,7 @@ https://custom.fontawesome.mirror/some.stylesheet.css
以上自定义配置需放到主题配置中的`providers`部分:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
providers:
cdn: 'https://some.cdn.domain.name/${package}/${version}/${filename}'
fontcdn: 'https://some.google.font.mirror/${type}?family=${fontname}'

View File

@ -66,7 +66,7 @@ providers:
对应到主题配置为:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: changyan
app_id: ????appid????
@ -122,7 +122,7 @@ providers:
对应的主题配置为:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: disqus
shortname: my-hexo-blog-1
@ -177,7 +177,7 @@ providers:
对应为下面的主题配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: disqusjs
shortname: my-hexo-blog-1
@ -206,7 +206,7 @@ providers:
1. 如要开启Facebook评论服务将`comment`的`type`设置为`facebook`即可。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: facebook
{% endcodeblock %}
@ -242,7 +242,7 @@ providers:
对应如下的Gitalk的配置
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: gitalk
client_id: xxxxxxxxxxxxxxxxxxxx
@ -281,7 +281,7 @@ providers:
下面是Gitment的示例配置
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: gitment
owner: you_github_name
@ -309,7 +309,7 @@ providers:
2. 将Isso服务器的HTTP URL填入到主题配置的相应配置项中。
例如如果你的Isso服务地址为`https://posativ.org/isso/api/`,你会有如下的评论配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: isso
url: posativ.org/isso/api
@ -373,7 +373,7 @@ providers:
对应的主题配置为:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: livere
uid: ABCD1234O0OxxxxXXXX000==
@ -426,7 +426,7 @@ providers:
对应下面的主题配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: utterances
repo: Your-GitHub-Username/Your-Public-Repo-Name
@ -449,7 +449,7 @@ providers:
此外,你可以参考[配置项](https://valine.js.org/configuration.html)来了解可选配置项的详情和可能的配置值。
下面是示例配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
comment:
type: valine
app_id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

View File

@ -13,7 +13,7 @@ providers:
iconcdn: loli
---
Icarus的默认主题配置文件为`themes/icarus/_config.yml`。
Icarus的默认主题配置文件为`_config.icarus.yml`。
此文件定义了站点全局的布局与样式设置,同时也控制了例如插件与挂件等外部功能的配置。
本文详细介绍了本主题的一般配置并且解释了Icarus使用哪些配置文件和它是如何生成并验证这些配置。
@ -40,8 +40,8 @@ Icarus的默认主题配置文件为`themes/icarus/_config.yml`。
Icarus使用此版本号来决定是否升级默认主题配置文件。
请不要自己更改这个版本号。
{% codeblock themes/icarus/_config.yml lang:yaml %}
version: 3.0.0
{% codeblock _config.icarus.yml lang:yaml %}
version: 4.0.0
{% endcodeblock %}
### 主题变体
@ -50,7 +50,7 @@ version: 3.0.0
此设置目前支持”`default`“和”`cyberpunk`“两种值。
你可以在{% post_link demo/Cyberpunk "此处" %}查看Cyberpunk变体的效果。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
variant: default
{% endcodeblock %}
@ -60,13 +60,13 @@ variant: default
此logo会显示在导航栏和页脚。
`logo`配置的值既可以是你的logo图片的路径或URL地址
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
logo: /img/logo.svg
{% endcodeblock %}
也可以像下面这样设置成文字:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
logo:
text: My Beautiful Site
{% endcodeblock %}
@ -75,7 +75,7 @@ logo:
你可以在`head`配置中指定你的网站favicon的路径或URL地址。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
head:
favicon: /img/favicon.svg
{% endcodeblock %}
@ -87,7 +87,7 @@ head:
仅在需要的时候在文章的front-matter中为这些设置赋值。
请参考[Hexo文档](https://hexo.io/zh-cn/docs/helpers.html#open-graph)来详细了解每个配置项。
{% codeblock themes/icarus/_config.yml lang:yaml >folded %}
{% codeblock _config.icarus.yml lang:yaml >folded %}
head:
open_graph:
# 页面标题 (og:title) (可选)
@ -132,7 +132,7 @@ head:
仅在需要的时候在文章的front-matter中为这些设置赋值。
请参考[Search for Developers](https://developers.google.com/search/docs/guides/intro-structured-data)来详细了解每个配置项。
{% codeblock themes/icarus/_config.yml lang:yaml >folded %}
{% codeblock _config.icarus.yml lang:yaml >folded %}
head:
structured_data:
# 页面标题 (可选)
@ -159,7 +159,7 @@ head:
`meta`设置每一个元素的值应为`<属性名>=<属性值>`的格式,其中`属性名`和`属性值`分别代表着`<meta>`标签的属性和值。
如果`<meta>`标签有多个属性和值,请使用`;`来分隔`<属性名>=<属性值>`。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
head:
meta:
- 'name=theme-color;content=#123456'
@ -170,7 +170,7 @@ head:
你可以通过`head`部分的`rss`设置来添加RSS链接信息。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
head:
rss: /path/to/atom.xml
{% endcodeblock %}
@ -181,7 +181,7 @@ head:
你可以通过向`menu`设置项中添加`<链接名>: <链接URL>`的方式添加任意导航栏菜单链接。
如要向导航栏右侧添加链接,请向`links`设置项中添加`<链接名>: <链接URL>`。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
navbar:
# 导航栏菜单项
menu:
@ -211,7 +211,7 @@ navbar:
`footer`部分定义了页脚右侧的链接。
链接的配置格式与`navbar`中`links`的配置格式完全一致。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
footer:
links:
Creative Commons:
@ -230,13 +230,13 @@ footer:
如果你已在Hexo中启用了代码高亮功能你可以通过`article`中的`highlight`设置来自定义代码块。
请从[highlight.js/src/styles](https://github.com/highlightjs/highlight.js/tree/9.18.1/src/styles)下列出的所有主题中
选择一个主题。
然后,复制文件名(不带`.css`后缀)到`theme`设置项中。
然后,复制文件名(不带`.css`后缀)到`theme`设置项中。
如要隐藏复制代码按钮,将`clipboard`设置为`false`。
如果你希望折叠或展开所有代码块,将`fold`设置为`"folded"`或`"unfolded"`。
你也可以将`fold`设置为空来禁止代码块折叠。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
article:
highlight:
# 代码高亮主题
@ -285,7 +285,7 @@ Post content...
你可以将`article`部分的`readtime`设置为`true`来显示文章字数统计以及预计阅读时间。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
article:
readtime: true
{% endcodeblock %}
@ -295,7 +295,7 @@ article:
你可以在你的文章/页面的底部展示你的作品的使用许可,许可链接可以是文字或者图标。
这里的配置与导航栏或者页脚的`links`配置一致:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
article:
# 文章许可协议
licenses:
@ -309,7 +309,7 @@ article:
设置`sidebar`中某个侧边栏的`sticky`为`true`来让它的位置固定而不跟随页面滚动。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
sidebar:
left:
sticky: false
@ -325,30 +325,23 @@ sidebar:
## 配置文件与优先级
除了在`themes/icarus/_config.yml`的默认主题配置文件外Icarus也会从如下位置获取替代配置
除了在`_config.icarus.yml`的默认主题配置文件外Icarus也会从如下位置获取替代配置
- `themes/icarus/_config.post.yml`和`themes/icarus/_config.page.yml`
- 位于`_config.yml`的站点配置文件
- 位于`_config.post.yml`和`_config.page.yml`的布局配置文件
- 文章/页面的[front-matter](https://hexo.io/docs/front-matter.html)
- 根目录下的站点配置文件`_config.yml`
- (已弃用) 位于`themes/icarus/_config.yml`的旧主题配置文件
- (已弃用) 位于`themes/icarus/_config.post.yml`和`themes/icarus/_config.page.yml`的旧布局配置文件
`_config.post.yml`和`_config.page.yml`与默认配置文件有着相同的格式和配置定义。
你可以在`_config.post.yml`中设置仅对所有文章生效的配置,而这些配置将覆盖默认配置文件中的配置。
例如,你可以在此配置文件中把所有的挂件放置在页面一侧来实现所有文章两栏布局,同时其他页面仍保持三栏布局:
### 布局配置文件
{% codeblock themes/icarus/_config.yml lang:yaml %}
widgets:
-
type: recent_posts
position: left
-
type: categories
position: right
-
type: tags
position: right
{% endcodeblock %}
布局配置文件遵循着与主题配置文件相同的格式和定义。
`_config.post.yml`中的配置对所有文章生效,而`_config.page.yml`中的配置对所有自定义页面生效。
这两个文件将覆盖主题配置文件中的配置。
{% codeblock themes/icarus/_config.post.yml lang:yaml %}
例如,你可以在`_config.post.yml`中把所有文章变为两栏布局:
{% codeblock _config.post.yml lang:yaml %}
widgets:
-
type: recent_posts
@ -361,9 +354,24 @@ widgets:
position: left
{% endcodeblock %}
类似的,`_config.page.yml`中的配置仅对所有Hexo页面(Pages)生效并覆盖默认配置文件中的配置。
同时所有其他页面仍保持三栏布局:
如果你想要在某个文章/页面中覆盖默认配置,你可以把这些配置放在那个文章/页面的front-matter中。
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
type: recent_posts
position: left
-
type: categories
position: right
-
type: tags
position: right
{% endcodeblock %}
### 文章/页面的Front-matter
如果你只想要在某个文章/页面中覆盖主题配置,你可以在那个文章/页面的front-matter中写下配置。
例如你可以像下面这样在一篇文章的front-matter中更改某篇文章的代码高亮主题
{% codeblock source/_post/some-post.md lang:yaml %}
@ -376,51 +384,54 @@ article:
# 文章标题
{% endcodeblock %}
上面的配置为那篇文章覆盖掉`_config.post.yml`和`_config.yml`中的`article.highlight`。
这种层次化的配置系统对于在页面个性化与优化上差异化对待不同访客十分有效。
上面的配置为那篇文章覆盖掉`_config.post.yml`和`_config.icarus.yml`中的`article.highlight`。
这种层次化的配置系统对于页面个性化和不同访客间的差异化优化十分有效。
比如你可以为根据你页面目标访客的国家和语言来开启更快的CDN或本地化的评论服务。
然而需要注意的是一些Hexo内定义的文章或页面属性不会覆盖掉其他配置源中的同名配置例如
- `title`
- `date`
- `updated`
- `comments` (not `comment`)
- `layout`
- `source`
- `photos`
- `excerpt`
然而需要注意的是一些Hexo定义的文章或页面属性不会覆盖掉其他配置源中的同名配置
`title`, `date`, `updated`, `comments` (not `comment`), `layout`, `source`, `photos`, 和`excerpt`。
最后上面列出的所有配置源中Icarus用到的配置项都会覆盖站点配置文件`_config.yml`中的同名配置项。
例如,`themes/icarus/_config.yml`中的`title`设置会覆盖掉`_config.yml`中的`title`,但`new_post_name`却不会,因为
### 站点配置文件
上面列出的所有配置源,包括主题配置文件,布局配置文件,和文章/页面的front-matter会覆盖掉站点配置文件中Icarus使用到的配置。
例如,`_config.icarus.yml`中的`title`设置会覆盖掉`_config.yml`中的`title`,但`new_post_name`却不会,因为
Icarus没有用到这个配置项。
另外,主题配置文件中的`theme_config`选项会与主题配置文件中的主题配置合并并覆盖掉同名配置。
然而,我们非常不推荐使用这个配置选项。
### 总结
总而言之,配置源的作用范围和优先级如下:
- 对于某个文章或页面
- front-matter覆盖所有下面的配置源。
- `themes/icarus/_config.post.yml`和`themes/icarus/_config.page.yml`覆盖所有下面的配置源。
- `themes/icarus/_config.yml`覆盖所有下面的配置源。
- `_config.yml`
- 文章/页面的front-matter覆盖所有下面的配置源。
- 布局配置文件覆盖所有下面的配置源。
- 站点配置文件中的`theme_config`选项覆盖所有下面的配置源。
- 主题配置文件覆盖所有下面的配置源。
- 站点配置文件。
- 对于所有的文章或页面
- `themes/icarus/_config.post.yml`或`themes/icarus/_config.page.yml`覆盖所有下面的配置源。
- `themes/icarus/_config.yml`覆盖所有下面的配置源。
- `_config.yml`
- 布局配置文件覆盖所有下面的配置源。
- 站点配置文件中的`theme_config`选项覆盖所有下面的配置源。
- 主题配置文件覆盖所有下面的配置源。
- 站点配置文件。
- 对于所有的文章,页面,和索引页
- `themes/icarus/_config.yml`覆盖所有下面的配置源。
- `_config.yml`
- 站点配置文件中的`theme_config`选项覆盖所有下面的配置源。
- 主题配置文件覆盖所有下面的配置源。
- 站点配置文件。
## 配置生成与校验
所有的Icarus主题配置均采用[YAML语言](https://yaml.org/)
当Hexo加载主题时Icarus会通过一系列[JSON Schema](https://json-schema.org/)来自动生成默认的配置文件`themes/icarus/_config.yml`。
这也是为什么你在主题目录下找不到示例配置文件(`_config.yml.example`)。
大多数的JSON Schema存放在`themes/icarus/include/schema`目录下,而其他的则存放在
所有的Icarus主题配置均使用[YAML语言](https://yaml.org/)编写
如果配置文件不存在Icarus会通过一系列[JSON Schema](https://json-schema.org/)来自动生成默认的配置文件`_config.icarus.yml`。
这也是为什么你在主题目录下找不到示例配置文件(`_config.yml.example`)。
大多数的JSON Schema存放在`<icarus_directory>/include/schema`目录下,而其他的则存放在
[ppoffice/hexo-component-inferno](https://github.com/ppoffice/hexo-component-inferno)仓库中。
你可以在你的`hexo`命令后附上`--icarus-dont-generate-config`来避免配置文件的自动生成。
@ -447,7 +458,7 @@ WARN [
{% endcodeblock %}
此外如果你的默认主题配置文件不是最新版本的话Icarus会运行迁移脚本将它升级到最新版本。
这些脚本存放在`themes/icarus/include/migration`目录。
这些脚本存放在`<icarus_directory>/include/migration`目录。
你可以在你的`hexo`命令后附上`--icarus-dont-upgrade-config`来禁止配置升级。
最后Icarus也会检查主题依赖的Node.js库是否安装并提醒你安装缺失的库。

View File

@ -36,7 +36,7 @@ providers:
本文介绍Icarus 3支持的赞赏按钮的安装配置。
若需同时展示多个按钮,只需像如下这样在主题配置的`donates`数组中添加多个按钮配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: ... # 按钮1
@ -74,7 +74,7 @@ donates:
2. 将如下配置添加到主题配置中:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: afdian
@ -93,7 +93,7 @@ donates:
3. 向主题配置中添加如下配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: alipay
@ -110,7 +110,7 @@ donates:
2. 将如下配置添加到主题配置中:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: buymeacoffee
@ -164,7 +164,7 @@ donates:
对应的主题配置为:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: paypal
@ -180,7 +180,7 @@ donates:
2. 将如下配置添加到主题配置中:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donate:
-
type: patreon
@ -198,7 +198,7 @@ donates:
3. 向主题配置中添加如下配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
donates:
-
type: wechat

View File

@ -37,7 +37,7 @@ providers:
Icarus运行在Node.js 8.3.0或更新的版本上。
它同时依赖Hexo 4.2.0或更新版本。
除此之外请确保所有的Node.js依赖已安装。
你可以在[`themes/icarus/package.json`](https://github.com/ppoffice/hexo-theme-icarus/blob/master/package.json)
你可以在[`<icarus_directory>/package.json`](https://github.com/ppoffice/hexo-theme-icarus/blob/master/package.json)
文件的`peerDependencies`部分下找到这些依赖。
同时从你的站点中移除所有无用的Node.js依赖否则它们可能会导致Icarus出现奇怪的问题。
@ -54,7 +54,7 @@ Icarus运行在Node.js 8.3.0或更新的版本上。
+ language: <语言名>
{% endcodeblock %}
你可以在`themes/icarus/languages`目录下找到所有可用的翻译。
你可以在`<icarus_directory>/languages`目录下找到所有可用的翻译。
`<语言名>`为不带后缀名的翻译文件名。
@ -66,10 +66,10 @@ Icarus运行在Node.js 8.3.0或更新的版本上。
</div>
</article>
如要改变页面的宽度,编辑`themes/icarus/include/style/responsive.styl`这个样式文件。
如要改变页面的宽度,编辑`<icarus_directory>/include/style/responsive.styl`这个样式文件。
此文件定义了不同屏幕尺寸下的页面容器宽度。
如要改变挂件或主内容宽度,编辑`themes/icarus/layout/common/widgets.jsx`和`themes/icarus/layout/layout.jsx`。
如要改变挂件或主内容宽度,编辑`<icarus_directory>/layout/common/widgets.jsx`和`<icarus_directory>/layout/layout.jsx`。
在这些文件中找到诸如`is-12``is-8-tablet`,和`is-4-widescreen`这样的CSS类名。
CSS类名中的数字标志着一个挂件或主内容所占据的栏数量。
数字后的屏幕尺寸,如`tablet`和`widescreen`,指代着栏数量生效的屏幕尺寸条件。
@ -77,7 +77,7 @@ CSS类名中的数字标志着一个挂件或主内容所占据的栏数量。
例如,为使主内容栏在宽屏(`widescreen`)下更宽,你可以做出如下修改:
{% codeblock themes/icarus/layout/layout.jsx lang:diff >folded %}
{% codeblock &lt;icarus_directory&gt;/layout/layout.jsx lang:diff >folded %}
<div class={classname({
column: true,
'order-2': true,
@ -88,7 +88,7 @@ CSS类名中的数字标志着一个挂件或主内容所占据的栏数量。
'is-8-tablet is-8-desktop is-6-widescreen': columnCount === 3
{% endcodeblock %}
{% codeblock themes/icarus/layout/common/widgets.jsx lang:diff >folded %}
{% codeblock &lt;icarus_directory&gt;/layout/common/widgets.jsx lang:diff >folded %}
function getColumnSizeClass(columnCount) {
switch (columnCount) {
case 2:
@ -117,13 +117,13 @@ CSS类名中的数字标志着一个挂件或主内容所占据的栏数量。
插件和挂件的布局文件已被移至一个单独的Node.js库中——[`hexo-component-inferno`](https://github.com/ppoffice/hexo-component-inferno)。
这样,主题开发者可以更好地在不同主题之间复用这些通用组件,并且普通用户可以更简便地覆盖这些内置组件。
若要自定义这些组件,从`hexo-component-inferno`仓库中拷贝布局文件并把它们放入`themes/icarus/layout`下的的相应目录中。
若要自定义这些组件,从`hexo-component-inferno`仓库中拷贝布局文件并把它们放入`<icarus_directory>/layout`下的的相应目录中。
例如如果你想要自定义Valine评论插件你可以从`hexo-component-inferno`仓库中拷贝
[`src/view/comment/valine.jsx`](https://github.com/ppoffice/hexo-component-inferno/blob/0.2.4/src/view/comment/valine.jsx)
到`themes/icarus/layout/comment/valine.jsx`。
到`<icarus_directory>/layout/comment/valine.jsx`。
同时像下面这样改正此文件头部的一些Node.js引用
{% codeblock themes/icarus/layout/comment/valine.jsx lang:diff %}
{% codeblock &lt;icarus_directory&gt;/layout/comment/valine.jsx lang:diff %}
- const { cacheComponent } = require('../../util/cache');
+ const { cacheComponent } = require('hexo-component-inferno/lib/util/cache');
{% endcodeblock %}
@ -218,7 +218,7 @@ excerpt: 这是一篇关于...
例如,注释掉这几行来禁用掉评论插件:
{% codeblock themes/icarus/_config.yml lang:diff %}
{% codeblock _config.icarus.yml lang:diff %}
- comment:
- type: disqus
- shortname:

View File

@ -46,7 +46,7 @@ Icarus的画廊插件同时包含了[lightGallery](https://sachinchoolur.github.
[Justified Gallery](https://miromannino.github.io/Justified-Gallery/)两种插件。
若要启用画廊插件,请将主题配置中`plugins` > `gallery`的值设置为`true`。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
gallery: true
{% endcodeblock %}
@ -113,7 +113,7 @@ plugins:
你可以使用KaTeX插件来渲染\\(\TeX\\)数学公式。
若要启用KaTeX插件请将主题配置中`plugins` > `katex`的值设置为`true`。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
katex: true
{% endcodeblock %}
@ -168,7 +168,7 @@ $$
你可以使用MathJax插件来渲染\\(\TeX\\)MathML或AsciiMath数学公式。
若要启用MathJax插件请将主题配置中`plugins` > `mathjax`的值设置为`true`。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
mathjax: true
{% endcodeblock %}
@ -349,7 +349,7 @@ A =
若要启用此插件,请将主题配置中`plugins` > `outdated_browser`的值设置为`true`。
点击[此处](https://bestvpn.org/outdatedbrowser/en)即可预览插件开启效果。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
outdated_browser: true
{% endcodeblock %}
@ -362,14 +362,14 @@ plugins:
Icarus默认启用网页载入动画。
若需禁止载入动画,请在你的主题配置中将`plugins` > `animejs`设置为`false`。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
animejs: false
{% endcodeblock %}
另外,若需禁用网页载入进度条,请在你的主题配置中将`plugins` > `progressbar`设置为`false`。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
progressbar: false
{% endcodeblock %}

View File

@ -112,7 +112,7 @@ providers:
6. 最后在主题配置中设置搜索引擎为Algolia
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
search:
type: algolia
{% endcodeblock %}
@ -124,7 +124,7 @@ providers:
1. 打开主题配置文件并设置搜索为百度搜索:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
search:
type: baidu
{% endcodeblock %}
@ -161,7 +161,7 @@ providers:
对应下面的主题配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
search:
type: google_cse
cx: 012345601234560123456:abcdefghijklmn
@ -175,7 +175,7 @@ providers:
1. Insight为本站默认的站内搜索引擎。
你可以通过下面的主题配置来启用它:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
search:
type: insight
{% endcodeblock %}

View File

@ -82,7 +82,7 @@ providers:
对应如下的主题配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: addthis
install_url: //s7.addthis.com/js/300/addthis_widget.js#pubid=ra-xxxxxxxxxxxxx
@ -99,7 +99,7 @@ providers:
1. 你可以启用AddToAny而无需注册用户。
仅需将下面的代码放到你的主题配置中:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: addtoany
{% endcodeblock %}
@ -119,7 +119,7 @@ providers:
<br>
4. 由于分享按钮是由[ppoffice/hexo-component-inferno](https://github.com/ppoffice/hexo-component-inferno)
提供你需要将AddToAny的布局文件[src/view/share/addtoany.jsx](https://github.com/ppoffice/hexo-component-inferno/blob/0.2.2/src/view/share/addtoany.jsx)从这个仓库中复制到`themes/icarus/layout/share/addtoany.jsx`。
提供你需要将AddToAny的布局文件[src/view/share/addtoany.jsx](https://github.com/ppoffice/hexo-component-inferno/blob/0.2.2/src/view/share/addtoany.jsx)从这个仓库中复制到`<icarus_directory>/layout/share/addtoany.jsx`。
然后,替换`addtoany.jsx`中AddToAny代码并修正文件头部的包引用。
例如,假设下面的代码是你从上一步获得的代码:
@ -138,7 +138,7 @@ providers:
那么你需要对`addtoany.jsx`做出如下修改:
{% codeblock themes/icarus/layout/share/addtoany.jsx lang:diff >folded %}
{% codeblock &lt;icarus_directory&gt;/layout/share/addtoany.jsx lang:diff >folded %}
const { Component, Fragment } = require('inferno');
- const { cacheComponent } = require('../../util/cache');
+ const { cacheComponent } = require('hexo-component-inferno/lib/util/cache');
@ -188,7 +188,7 @@ providers:
1. 你可以启用百度分享按钮而无需注册用户。
直接将下面的代码添加到你的主题配置中:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: bdshare
{% endcodeblock %}
@ -210,7 +210,7 @@ providers:
1. 你可以启用百度分享按钮而无需用户注册。
直接将下面代码添加到主题配置中:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: sharejs
{% endcodeblock %}
@ -256,7 +256,7 @@ providers:
对应下面的主题配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
share:
type: sharethis
install_url: https://platform-api.sharethis.com/js/sharethis.js#property=xxxxxxxxxxxxx&product=inline-share-buttons

View File

@ -68,7 +68,7 @@ providers:
对应的主题配置为:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
baidu_analytics:
tracking_id: 3f06f2b732a5b1034c989f74e28d0eea
@ -81,7 +81,7 @@ providers:
1. 将`plugins` > `busuanzi`设置为`true`来开启不蒜子访客计数器并在网页尾部和每篇博文的头部展示访问次数。
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
busuanzi: true
{% endcodeblock %}
@ -113,7 +113,7 @@ providers:
对应的主题配置为:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
cnzz:
id: 123456789000
@ -146,7 +146,7 @@ providers:
{% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/google-analytics-get-code.png 360 '"获取代码 - Google Analytics" "获取代码 - Google Analytics"' %}
<br>
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
google_analytics:
tracking_id: UA-12345678-0
@ -175,7 +175,7 @@ providers:
{% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/hotjar-get-code.png 360 '"获取代码 - Hotjar" "获取代码 - Hotjar"' %}
<br>
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
plugins:
hotjar:
site_id: 1234567

View File

@ -65,7 +65,7 @@ providers:
每个挂件必须包含`type`(挂件类型)与`position`(挂件展示位置)设置项。
示例如下:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
type: ... # 挂件1
@ -97,7 +97,7 @@ widgets:
你可以启用作者资料卡挂件来展示文章作者/网站站长的信息。
资料卡的配置如下所示:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -150,7 +150,7 @@ widgets:
若要展示文章目录,请在主题配置中添加如下挂件配置:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
type: toc
@ -172,7 +172,7 @@ toc: true
你可以使用友站链接挂件来展示外部网站的列表。
示例配置如下所示:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: left
@ -188,7 +188,7 @@ widgets:
使用如下挂件配置来开启最新文章挂件:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -200,7 +200,7 @@ widgets:
使用如下挂件配置来开启文章归档挂件:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -212,7 +212,7 @@ widgets:
使用如下挂件配置来开启文章分类挂件:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -224,7 +224,7 @@ widgets:
使用如下挂件配置来开启文章标签挂件:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: right
@ -275,7 +275,7 @@ Icarus的邮件订阅功能由Google Feedburner提供。
复制`uri=`后的ID(如`feedforall/ABCD`)到挂件配置的`feedburner_id`设置中:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: left
@ -292,7 +292,7 @@ Icarus的邮件订阅功能由Google Feedburner提供。
然后复制广告HTML代码中的`data-ad-client`和`data-ad-slot`值分别填入到挂件配置的`client_id`和`slot_id`项中。
示例如下:
{% codeblock themes/icarus/_config.yml lang:yaml %}
{% codeblock _config.icarus.yml lang:yaml %}
widgets:
-
position: left

View File

@ -10,136 +10,65 @@ toc: true
<a href="https://gitter.im/hexo-theme-icarus/community?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge">Chat on Gitter</a>
</p>
![Icarus](https://ppoffice.github.io/hexo-theme-icarus/gallery/preview.png?1 "Icarus Preview")
![](https://ppoffice.github.io/hexo-theme-icarus/gallery/preview.png?1 "Icarus Preview")
### :cd: Installation
**Method 1: Direct download**
Download & extract or `git clone` Icarus from GitHub to your blog's theme folder:
```shell
$ git clone https://github.com/ppoffice/hexo-theme-icarus.git -b <version> themes/icarus
```
**Method 2: Install via NPM (new in Hexo 5.0 and Icarus 4.0)**
## :cd: Installation
```shell
$ npm install hexo-theme-icarus
```
Then, activate Icarus in Hexo's configuration file:
```shell
$ hexo config theme icarus
```
### :gift: Features
Please refer to [Getting Started with Icarus](https://ppoffice.github.io/hexo-theme-icarus/uncategorized/getting-started-with-icarus/)
for more details.
**Cyberpunk Theme Variant**
## :gift: Features
### Cyberpunk Theme Variant
Tap into the future cyber world with the newly added Cyberpunk theme variant.
Inspired by [Cyberpunk 2077](https://www.cyberpunk.net).
![Icarus Cyberpunk](https://ppoffice.github.io/hexo-theme-icarus/gallery/screenshots/cyberpunk.png "Icarus Cyberpunk")
**Extensive Plugin Support**
### Extensive Plugin Support
Icarus includes plentiful search, comment, sharing and other plugins out of the box that makes your
blog feature-rich and powerful.
<table>
<tr>
<th><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Comment/">Comment</a></th>
<th><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Donation/">Donation</a></th>
<th><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Search/">Search</a></th>
<th><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Share/">Share</a></th>
<th><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Widgets/">Widgets</a></th>
<th><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/">Other Plugins</a></th>
</tr>
<tr>
<td>Changyan</td>
<td>Alipay</td>
<td>Insight</td>
<td>AddThis</td>
<td>Google AdSense</td>
<td>Baidu Analytics</td>
</tr>
<tr>
<td>Disqus</td>
<td>Buy Me A Coffee</td>
<td>Algolia</td>
<td>AddToAny</td>
<td>Archives</td>
<td>BuSuanZi Vistor Counter</td>
</tr>
<tr>
<td>DisqusJS</td>
<td>Patreon</td>
<td>Google CSE</td>
<td>Baidu Share</td>
<td>Categories</td>
<td>CNZZ Analytics</td>
</tr>
<tr>
<td>Facebook</td>
<td>Paypal</td>
<td>Baidu</td>
<td>Share.js</td>
<td>External Site Links</td>
<td>Light and Justified Gallery</td>
</tr>
<tr>
<td>Gitalk</td>
<td>Wechat</td>
<td></td>
<td>ShareThis</td>
<td>Recent Posts</td>
<td>Google Analytics</td>
</tr>
<tr>
<td>Gitment</td>
<td></td>
<td></td>
<td></td>
<td>Google Feedburner</td>
<td>Hotjar User Feedback</td>
</tr>
<tr>
<td>Isso</td>
<td></td>
<td></td>
<td></td>
<td>Author Profile</td>
<td>KaTex</td>
</tr>
<tr>
<td>LiveRe</td>
<td></td>
<td></td>
<td></td>
<td>Tags</td>
<td>MathJax</td>
</tr>
<tr>
<td>Utterances</td>
<td></td>
<td></td>
<td></td>
<td>Table of Contents</td>
<td>Outdated Browser Detection</td>
</tr>
<tr>
<td>Valine</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td>Page Loading Animations<br></td>
</tr>
</table>
**[Comment](https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Comment/)**
**Rich Code Highlight Theme Choices**
Changyan &middot; Disqus &middot; DisqusJS &middot; Facebook &middot; Gitalk &middot; Gitment &middot;
Isso &middot; LiveRe &middot; Utterance &middot; Valine
**[Donate Button](https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Donation/)**
Afdian.net &middot; Alipay &middot; Buy me a coffee &middot; Patreon &middot; Paypal &middot; Wecat
**[Search](https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Search/)**
Algolia &middot; Baidu &middot; Google CSE &middot; Insight
**[Share](https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Share/)**
AddThis &middot; AddToAny &middot; Baidu Share &middot; Share.js &middot; ShareThis
**[Widgets](https://ppoffice.github.io/hexo-theme-icarus/categories/Widgets/)**
Google Adsense &middot; Archives &middot; Categories &middot; External Site Links &middot;
Recent Posts &middot; Google Feedburner &middot; Tags &middot; Table of Contents
**[Analytics](https://ppoffice.github.io/hexo-theme-icarus/Plugins/Analytics/icarus-user-guide-web-analytics-plugins/)**
Baidu Statistics &middot; BuSuanZi Web Counter &middot; CNZZ Statistics &middot; Google Analytics &middot;
Hotjar
**[Other Plugins](https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/)**
LightGallery &middot; Justified Gallery &middot; KaTeX &middot; MathJax &middot; Oudated Browser &middot;
Page Loading Animations
### Colorful Code Highlight
Icarus directly import stylesheets from the [highlight.js](https://highlightjs.org/) package and makes more than
90 code highlight themes available to you.
@ -157,61 +86,66 @@ Icarus directly import stylesheets from the [highlight.js](https://highlightjs.o
</tr>
</table>
**Flexible Theme Configuration**
### Flexible Theme Configuration
Icarus allows you to configure your site on a per-page or per-layout basis.
<div class="table-overflow">
<table>
<tr>
<th>_config.yml</th>
<th>post.md</th>
<th>_config.page.yml</th>
</tr>
<tr>
<td>
{% codeblock %}
<tr>
<td style="border: 0;">
<img style="width: 256px; min-width: 256px" src="https://ppoffice.github.io/hexo-theme-icarus/gallery/screenshots/default-config.png">
</td>
<td style="border: 0;">
<div style="margin: -1em 0">
{% codeblock lang:yaml _config.icarus.yml %}
widgets:
- type: profile
position: left
- type: recent_posts
position: right
{% endcodeblock %}
</td>
<td>
{% codeblock %}
</div>
</td>
</tr>
<tr>
<td style="border: 0;">
<img style="width: 256px; min-width: 256px" src="https://ppoffice.github.io/hexo-theme-icarus/gallery/screenshots/post-config.png">
</td>
<td style="border: 0;">
<div style="margin: -1em 0">
{% codeblock lang:yaml post.md %}
widgets:
- type: profile
position: left
- type: recent_posts
position: left
{% endcodeblock %}
</td>
<td>
{% codeblock %}
</div>
</td>
</tr>
<tr>
<td style="border: 0;">
<img style="width: 256px; min-width: 256px" src="https://ppoffice.github.io/hexo-theme-icarus/gallery/screenshots/layout-config.png">
</td>
<td style="border: 0;">
<div style="margin: -1em 0">
{% codeblock lang:yaml _config.page.yml %}
widgets: null
{% endcodeblock %}
</td>
</tr>
<tr>
<td><img width="266" src="https://ppoffice.github.io/hexo-theme-icarus/gallery/screenshots/default-config.png"></td>
<td><img width="266" src="https://ppoffice.github.io/hexo-theme-icarus/gallery/screenshots/post-config.png"></td>
<td><img width="266" src="https://ppoffice.github.io/hexo-theme-icarus/gallery/screenshots/layout-config.png"></td>
</tr>
</div>
</td>
</tr>
</table>
</div>
<br>
**Responsive Layout**
### Responsive Layout
Give your audiences best viewing experience with Icarus's mobile-friendly responsive layout.
![Responsive Layout](https://ppoffice.github.io/hexo-theme-icarus/gallery/responsive.png)
### :hammer: Development
## :hammer: Development
This project is built with
@ -223,7 +157,7 @@ This project is built with
Please refer to the [documentation](https://ppoffice.github.io/hexo-theme-icarus/categories/) and
[contributing guide](https://github.com/ppoffice/hexo-theme-icarus/blob/master/CONTRIBUTING.md) for implementation details.
### :tada: Contribute
## :tada: Contribute
If you feel like to help us build a better Icarus, you can
@ -232,6 +166,6 @@ If you feel like to help us build a better Icarus, you can
:triangular_flag_on_post: [Report a bug](https://github.com/ppoffice/hexo-theme-icarus/issues/new) |
:electric_plug: [Suggest a new feature](https://github.com/ppoffice/hexo-theme-icarus/pulls)
### :memo: License
## :memo: License
This project is licensed under the MIT License - see the [LICENSE](https://github.com/ppoffice/hexo-theme-icarus/blob/master/LICENSE) file for details.