惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

H
Help Net Security
爱范儿
爱范儿
V
Visual Studio Blog
Last Week in AI
Last Week in AI
阮一峰的网络日志
阮一峰的网络日志
雷峰网
雷峰网
Hugging Face - Blog
Hugging Face - Blog
博客园 - 【当耐特】
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
博客园 - 三生石上(FineUI控件)
博客园 - Franky
博客园 - 叶小钗
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
The Cloudflare Blog
大猫的无限游戏
大猫的无限游戏
人人都是产品经理
人人都是产品经理
M
MIT News - Artificial intelligence
罗磊的独立博客
L
LangChain Blog
Jina AI
Jina AI
IT之家
IT之家
J
Java Code Geeks
Microsoft Azure Blog
Microsoft Azure Blog
博客园_首页

Icarus

Getting Started with Icarus Icarus User Guide - Configuring the Theme FAQ Cyberpunk Theme Variant Upgrade Guide Custom Hexo Tag Helpers 自定义Hexo标签插件 Hexo Built-in Tag Helpers Icarus User Guide - CDN Providers Icarus User Guide - Comment Plugins Icarus User Guide - Donation Buttons Icarus User Guide - Other Plugins Icarus User Guide - Share Buttons Icarus User Guide - Search Plugin Icarus User Guide - Web Analytics Plugins Icarus快速上手 Icarus用户指南 - 主题配置 常见问题 升级指南
Icarus User Guide - Widgets
PPOffice · 2017-01-31 · via Icarus

This article covers widgets supported by Icarus 5. To display multiple widgets at once, simply add individual widget configuration to the widgets array. They will appear in the order of their definitions. The type and position settings are required for every widget. Here is an example:

_config.icarus.yml
1
2
3
4
5
6
7
8
9
widgets:
-
type: ...
position: left
...
-
type: ...
position: right
...

The following widgets are provided by ppoffice/hexo-component-inferno. Please refer to it for a complete list of supported plugins and their configuration details.

Profile

You can showcase the post author/site admin information via the profile widget. Its configuration is listed below:

_config.icarus.yml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
widgets:
-
position: right
type: profile

author: hulatocat

author_title: A GitHub Octocat

location: GitHub Inc.

avatar: https://octodex.github.com/images/hula_loop_octodex03.gif

avatar_rounded: false

gravatar:

follow_link: 'https://octodex.github.com/hulatocat'

social_links:
Github:
icon: fab fa-github
url: 'https://github.com/'
Icarus: 'https://github.com/ppoffice/hexo-theme-icarus'

Some notes on the configuration:

  • If you wish to use Gravatar instead of avatar as your profile picture, fill in the Gravatar email address in the gravatar setting and leave avatar empty;

  • There two acceptable formats for social_links:

    Icon:

    social_links
    1
    2
    3
    <link_name>:
    icon: <fontawesome_icon_class_name>
    url: <link_url>

    Text:

    social_links
    1
    <link_name>: <link_url>

Table of Contents

To show the table of contents of the current post, add the following widget configuration to your theme configurations:

_config.icarus.yml
1
2
3
4
5
6
widgets:
-
type: toc
position: left

index: true

Then, add toc: true to the front-matter of your post:

Post.md
1
2
3
4
title: A post with the table of contents
toc: true
---
Post content...

You can display a list of external sites with the external links widget. An example configuration is listed below:

_config.icarus.yml
1
2
3
4
5
6
7
8
widgets:
-
position: left
type: links

links:
Hexo: 'https://hexo.io'
Bulma: 'https://bulma.io'

Recent Posts

Use the following configuration to enable the recent posts widget:

_config.icarus.yml
1
2
3
4
widgets:
-
position: right
type: recent_posts

Archives

Use the following configuration to enable the archives widget:

_config.icarus.yml
1
2
3
4
widgets:
-
position: right
type: archives

Categories

Use the following configuration to enable the categories widget:

_config.icarus.yml
1
2
3
4
widgets:
-
position: right
type: categories

Use the following configuration to enable the tags widget:

_config.icarus.yml
1
2
3
4
5
6
7
widgets:
-
position: right
type: tags
order_by: name
amount: 20
show_count: true

Google Feedburner

To enable Google Feedburner email subscription widget, take the following steps:

  1. First, you need to generate the RSS feed of your Hexo site using a Hexo plugin like hexo-generator-feed.

  2. Then, go to Google Feedburner, log into your Google account, and add your RSS feed by typing in the RSS feed address to the input box and click “Next”.

    Homepage - Feedburner
  3. Next, fill in the “Feed Title” on the next page. Click “Next” to continue customizing your feed or click “Skip directly to feed management” to finish.

    Add Feed - Feedburner
  4. When finished adding the feed, click the “My Feeds” link on the top of the page. Click your newly added feed on the “My Feeds” page.

    Feed List - Feedburner
  5. Switch to the “Publicize” tab and click the “Email Subscription” link on the left side of the page. Enable “Email Subscription” by clicking the “Activate” button.

    Activate Email Subscription - Feedburner
  6. Find the following information in the HTML code on the “Email Subscription” page:

    Google Feedburner URL
    1
    https://feedburner.google.com/fb/a/mailverify?uri=******
    Get Code - Feedburner

    Copy the ID after uri= (e.g., feedforall/ABCD) to the feedburner_id setting of the widget configuration:

    _config.icarus.yml
    1
    2
    3
    4
    5
    6
    7
    widgets:
    -
    position: left
    type: subscribe_email

    description: Subscribe to get the lastest update!
    feedburner_id: feedforall/ABCD

Google AdSense

Create a new AD on Google AdSense. Then, copy the values of data-ad-client and data-ad-slot from the AD HTML code to the client_id and slot_id setting of the widget configuration, respectively. Here is an example:

_config.icarus.yml
1
2
3
4
5
6
widgets:
-
position: left
type: adsense
client_id: ca-pub-xxxxxxxx
slot_id: xxxxxxx

follow.it

To enable follow.it email subscription widget, take the following steps:

  1. First, you need to generate the RSS feed of your Hexo site using a Hexo plugin like hexo-generator-feed.

  2. Go to follow.it and enter the URL to your RSS feed file in the text input under “Add the follow feature to your site”, e.g., http://example.com/atom.xml. Then, click “Next”.

    Enter Feed URL - follow.it
  3. Click the “Continue” button on the “Define the follow form’s design” page.

    Create Form - follow.it
  4. Search for action= and copy the link between double quotes after action=. Paste the action link you copied to the action_url setting of the widget configuration. After that, click “Done”.

    Copy Action URL - follow.it
    _config.icarus.yml
    1
    2
    3
    4
    5
    6
    7
    widgets:
    -
    position: left
    type: followit
    description:
    action_url: https://api.follow.it/******
    verification_code: ''
  5. Click the “Continue” button or the “Skip this” link to skip the “Pick the Follow icons you want” page and “Show a pop-up for maximum conversion” page.

  6. At the “Connect your feed to a follow.it account” page, enter your email address that you will use to create a follow.it account and manage followers in the text input. Then, click “Start”.

    Connect Account - follow.it
  7. You will then receive an email from follow.it. In that email, search for <meta name="follow_it-verification-code" content="******"/> and copy the content value between double quotes after content=. Paste the content value you copied to the verification_code setting of the widget configuration.

    Copy Verification Code - follow.it
    _config.icarus.yml
    1
    2
    3
    4
    5
    6
    7
    widgets:
    -
    position: left
    type: followit
    description:
    action_url: https://api.follow.it/******
    verification_code: ******
  8. Generate and push your site to your server.

  9. Go back to follow.it and register an account using your email.

  10. Go back to the first email you receive and click on the “Click here to claim it” link to claim your feed.

Verify Claim - follow.it

Something wrong with this article? Click here to submit your revision.