diff --git a/source/_posts/en/Widgets.md b/source/_posts/en/Widgets.md index eee1354..2c241ec 100644 --- a/source/_posts/en/Widgets.md +++ b/source/_posts/en/Widgets.md @@ -55,14 +55,10 @@ widgets: type: toc --- -
-This article is also available in: 简体中文. -
- -This article covers some widgets supported by Icarus 3. -If you need to display multiple widgets at once, simply add individual widget configuration +This article covers widgets supported by Icarus 3. +To display multiple widgets at once, simply add individual widget configuration to the `widgets` array. -They will appear in the order of their definition. +They will appear in the order of their definitions. The `type` and `position` settings are required for every widget. Here is an example: @@ -78,21 +74,28 @@ widgets: ... {% endcodeblock %} +
+
+This article is also available in +简体中文. +
+
+ -
- -Most of the widgets of Icarus are provided by -[ppoffice/hexo-component-inferno](https://github.com/ppoffice/hexo-component-inferno). -Please refer to it for a complete list of supported widgets and configuration details. - +
+
+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 list below: +Its configuration is listed below: {% codeblock themes/icarus/_config.yml lang:yaml %} widgets: @@ -123,30 +126,30 @@ widgets: Some notes on the configuration: -- If you wish to use [Gravatar](https://en.gravatar.com/) instead of the `avatar` setting as profile picture, - you can fill in the Gravatar email address in `gravatar` and leave `avatar` empty; +- If you wish to use [Gravatar](https://en.gravatar.com/) instead of `avatar` as your profile picture, + fill in the Gravatar email address in the `gravatar` setting and leave `avatar` empty; -- There two possible formats for `social_links`: +- There two acceptable formats for `social_links`: **Icon**: {% codeblock social_links lang:yaml %} - : - icon: - url: + : + icon: + url: {% endcodeblock %} **Text**: {% codeblock social_links lang:yaml %} - : + : {% endcodeblock %} ## Table of Contents -To show the table of contents of the current post, please add the following widget configuration to your theme's -configuration file: +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 %} widgets: @@ -155,7 +158,7 @@ widgets: position: left {% endcodeblock %} -Then, add `toc: true` to the front-matter of the post you wish to display the widget: +Then, add `toc: true` to the front-matter of your post: {% codeblock Post.md lang:yaml %} title: A post with the table of contents @@ -167,8 +170,8 @@ Post content... ## External Links -You can display a list of external sites and links to them using the external links widget. -An example of its configuration is listed below: +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 %} widgets: @@ -184,7 +187,7 @@ widgets: ## Recent Posts -Please use the following widget configuration to enable the recent posts widget: +Use the following configuration to enable the recent posts widget: {% codeblock themes/icarus/_config.yml lang:yaml %} widgets: @@ -196,7 +199,7 @@ widgets: ## Archives -Please use the following widget configuration to enable the archives widget: +Use the following configuration to enable the archives widget: {% codeblock themes/icarus/_config.yml lang:yaml %} widgets: @@ -208,7 +211,7 @@ widgets: ## Categories -Please use the following widget configuration to enable the categories widget: +Use the following configuration to enable the categories widget: {% codeblock themes/icarus/_config.yml lang:yaml %} widgets: @@ -220,7 +223,7 @@ widgets: ## Tags -Please use the following widget configuration to enable the tags widget: +Use the following configuration to enable the tags widget: {% codeblock themes/icarus/_config.yml lang:yaml %} widgets: @@ -233,23 +236,48 @@ widgets: ## Subscribe Email The email subscription feature of Icarus is provided by Google Feedburner. +To enable this widget, take the following steps: -1. To turn on this widget, please generate the RSS feed of your Hexo site using some Hexo plugins like +1. First, you need to generate the RSS feed of your Hexo site using a Hexo plugin like [hexo-generator-feed](https://github.com/hexojs/hexo-generator-feed). -2. Then, log into [Google Feedburner](https://feedburner.google.com) and add your RSS feed. - Click the "My Feeds" link on the top of the page when finished. +2. Then, go to [Google Feedburner](https://feedburner.google.com), log into your Google account, + and add your RSS feed by typing in the RSS feed address to the input box and click "Next". + + {% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/feedburner-homepage.png 360 '"Homepage - Feedburner" "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. + + {% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/feedburner-add-feed.png 360 '"Add Feed - Feedburner" "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. -3. Click the "Publicize" tab and then the "Email Subscription" link on the left side of the page. - Click the "Activate" button and find the following information in the HTML code on the "Email Subscription" + {% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/feedburner-feed-list.png 360 '"Feed List - Feedburner" "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. + + {% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/feedburner-activate-email.png 360 '"Activate Email Subscription - Feedburner" "Activate Email Subscription - Feedburner"' %} +
+ + +6. Find the following information in the HTML code on the "Email Subscription" page: {% codeblock Google Feedburner URL %} https://feedburner.google.com/fb/a/mailverify?uri=****** {% endcodeblock %} - Copy the ID after `uri=` (e.g., `feedforall/ABCD`) to the `feedburner_id` setting in the widget configuration. + {% img "box px-0 py-0 ml-auto mr-auto" /gallery/screenshots/feedburner-get-code.png 360 '"Get Code - Feedburner" "Get Code - Feedburner"' %} +
+ + 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 %} widgets: @@ -264,9 +292,9 @@ The email subscription feature of Icarus is provided by Google Feedburner. ## Google AdSense -Please log into [Google AdSense](https://www.google.com/adsense) and create a new AD. -Then, copy the values of `data-ad-client` and `data-ad-slot` from the HTML code of the AD to -the `client_id` and `slot_id` setting of the widget respectively. +Create a new AD on [Google AdSense](https://www.google.com/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, respectively. Here is an example: {% codeblock themes/icarus/_config.yml lang:yaml %} @@ -279,6 +307,10 @@ widgets: {% endcodeblock %} -
-Something wrong with this article? Click here to submit your revision. +
+
+Something wrong with this article? +Click here +to submit your revision.
+
diff --git a/source/gallery/screenshots/feedburner-activate-email.png b/source/gallery/screenshots/feedburner-activate-email.png new file mode 100644 index 0000000..b023fd9 Binary files /dev/null and b/source/gallery/screenshots/feedburner-activate-email.png differ diff --git a/source/gallery/screenshots/feedburner-add-feed.png b/source/gallery/screenshots/feedburner-add-feed.png new file mode 100644 index 0000000..fece406 Binary files /dev/null and b/source/gallery/screenshots/feedburner-add-feed.png differ diff --git a/source/gallery/screenshots/feedburner-feed-list.png b/source/gallery/screenshots/feedburner-feed-list.png new file mode 100644 index 0000000..e26d6d9 Binary files /dev/null and b/source/gallery/screenshots/feedburner-feed-list.png differ diff --git a/source/gallery/screenshots/feedburner-get-code.png b/source/gallery/screenshots/feedburner-get-code.png new file mode 100644 index 0000000..4190926 Binary files /dev/null and b/source/gallery/screenshots/feedburner-get-code.png differ diff --git a/source/gallery/screenshots/feedburner-homepage.png b/source/gallery/screenshots/feedburner-homepage.png new file mode 100644 index 0000000..defde8d Binary files /dev/null and b/source/gallery/screenshots/feedburner-homepage.png differ diff --git a/themes/icarus b/themes/icarus index ea0434b..4d65dd1 160000 --- a/themes/icarus +++ b/themes/icarus @@ -1 +1 @@ -Subproject commit ea0434b426216eb0ccc176d106de0fda893956f6 +Subproject commit 4d65dd13855a7d2ed2526867e024eb2240be1438