Posts

Post Settings

Text Align

NexT allows to customize the text alignment in the posts. The text-align CSS property sets the horizontal alignment of a block element or table-cell box.

Values Effect
start The same as left if direction is left-to-right and right if direction is right-to-left.
end The same as right if direction is left-to-right and left if direction is right-to-left.
left The inline contents are aligned to the left edge of the line box.
right The inline contents are aligned to the right edge of the line box.
center The inline contents are centered within the line box.
justify The inline contents are justified. Text should be spaced to line up its left and right edges to the left and right edges of the line box, except for the last line.
justify-all Same as justify, but also forces the last line to be justified.
match-parent Similar to inherit, but the values start and end are calculated according to the parent’s direction and are replaced by the appropriate left or right value.
next/_config.yml
1
2
3
4
5
# Set the text alignment in the posts.
text_align:
# Available values: start | end | left | right | center | justify | justify-all | match-parent
desktop: justify
mobile: justify

Page Scroll

By default NexT scrolls page automatically to section which is under mark. You can disable it by editing value scroll_to_more to false in theme config file.

next/_config.yml
1
scroll_to_more: true

If you want to save page scroll position automatically in cookies, you can enable it by editing value save_scroll to true in theme config file.

next/_config.yml
1
save_scroll: false

Preamble Text

It’s a common need to show some part of article in home page and then give a link to full article. NexT gives 3 ways to control how article is shown in home page. In other words, you can use following ways to show summary of articles and a Read More button.

If you have added description and set its value to your article summary in front-matter, NexT excerpts description as preamble text in homepage by default. Without description, the full contents would be the preamble text in homepage.

You can disable it by editing value excerpt_description to false in theme config file.

next/_config.yml
1
excerpt_description: true

Use <!-- more --> in your article to break your article manually, which is recommended by Hexo.

Next would use 150 characters from article header automatically as preamble text by editing value auto_excerpt.enable to true.

You can configure it by editing value in auto_excerpt section in theme config file.

next/_config.yml
1
2
3
auto_excerpt:
enable: false
length: 150

It is recommended to use <!-- more --> which can not only control what you want to show better, but also let Hexo’s plugins use it easily.

Post Meta Display

NexT supports post created date, post updated date and post categories display.

By default NexT shows the description text of post meta. You can disable it by editing value post_meta.item_text to false in theme config file.

next/_config.yml
1
2
post_meta:
item_text: true

By default NexT shows the post created date in post meta section and created time in popup. You can disable it by editing value post_meta.created_at to false in theme config file.

next/_config.yml
1
2
post_meta:
created_at: true

By default NexT shows the post updated date in post meta section and updated time in popup. You can disable it by editing value post_meta.updated_at.enable to false in theme config file.


next/_config.yml
1
2
3
post_meta:
updated_at:
enable: true

By default, if updated/edited date is the same as created date, edited time would be displayed in popup message. You can disable it by editing value post_meta.updated_at.another_day to false in theme config file.
In other words:



  • If true, show updated date label only if updated date is different from created date (post edited in another day than was created).

  • And if post was edited in same day as created, edited time will show in popup title under created time label.

  • If false show anyway, but if post edited in same day, show only edited time.


next/_config.yml
1
2
3
post_meta:
updated_at:
another_day: true

By default NexT shows the post categorie in post meta section. You can disable it by editing value post_meta.categories to false in theme config file.

next/_config.yml
1
2
post_meta:
categories: true

Post Wordcount

3rd-party plugin hexo-wordcount was replaced by hexo-symbols-count-time in 6.x versions because hexo-symbols-count-time no have any external nodejs dependencies, no have language filter which causes better performance on speed at site generation.

Install hexo-symbols-count-time by run following command in site root dir:

$ npm install hexo-symbols-count-time --save

Activate this plugin in site config file by enabled any option:

By default NexT shows the number of post words in post meta section. You can disable it by editing value symbols_count_time.symbols to false in site config file.


hexo/_config.yml
1
2
symbols_count_time:
symbols: true

By default NexT shows the estimated reading time of post in post meta section. You can disable it by editing value symbols_count_time.time to false in site config file.


hexo/_config.yml
1
2
symbols_count_time:
time: true

By default NexT shows the number of all posts words in footer section. You can disable it by editing value symbols_count_time.total_symbols to false in site config file.


hexo/_config.yml
1
2
symbols_count_time:
total_symbols: true

By default NexT shows the estimated reading time of all posts in footer section. You can disable it by editing value symbols_count_time.total_time to false in site config file.


hexo/_config.yml
1
2
symbols_count_time:
total_time: true

After the plugin enabled, you may adjust options in symbols_count_time section in theme config file:

By default NexT shows the words counts and estimated reading time in a separated line. You can add them into one line by editing value symbols_count_time.separated_meta to false in theme config file.


hexo/_config.yml
1
2
symbols_count_time:
separated_meta: true

By default NexT shows the text description of the words counts and estimated reading time in post meta section. You can disable it by editing value symbols_count_time.item_text_post to false in theme config file.


hexo/_config.yml
1
2
symbols_count_time:
item_text_post: true

By default NexT doesn’t shows the text description of the words counts and estimated reading time in footer section. You can enable it by editing value symbols_count_time.item_text_total to false in theme config file.


hexo/_config.yml
1
2
symbols_count_time:
item_text_total: false

awl means the average Word Length (chars count in word). You can check this here.


hexo/_config.yml
1
2
symbols_count_time:
awl: 4

wpm means the average words per minute. You can check this here.


hexo/_config.yml
1
2
symbols_count_time:
wpm: 275

Post Codeblock

By default NexT defines the default value of codeblock border radius as 1. You can configure it by editing border_radius values in codeblock section in theme config file.

hexo/_config.yml
1
2
codeblock:
border_radius:

NexT supports the copy-and-paste functionality of codeblock.

You can enable it by editing value copy_button.enable to true in theme config file.


hexo/_config.yml
1
2
3
codeblock:
copy_button:
enable: false

By default NexT doesn’t show copy results of the copy-and-paste functionality. You can also enable it by editing value copy_button.show_result to true in theme config file.


hexo/_config.yml
1
2
3
codeblock:
copy_button:
show_result: false

With style option, you can change your copy button style.
There are two style available currently: default(Just leave it empty) and flat.


hexo/_config.yml
1
2
3
codeblock:
copy_button:
style: flat

Code Highlight Theme

NexT uses Tomorrow Theme to support code highlight.
Default style is white (normal) and there are 5 styles to choose:

  • normal
  • night
  • night blue
  • night bright
  • night eighties

Change the value of highlight_theme to choose the highlight style you like, for example:

next/_config.yml
1
2
3
4
# Code Highlight theme
# Available values: normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: night

WeChat Subscribing

Show your WeChat public account QRcode after each article, subscribing blog by simply scanning.

  1. Download your QRcode from WeChat Public Platform, and save it under source/uploads/ site directory.
  2. Edit theme config file like following:

    next/_config.yml
    1
    2
    3
    4
    wechat_subscriber:
    enable: true
    qcode: /uploads/wechat-qcode.jpg
    description: Welcome to scan the WeChat Public Account QRcode and subscribe my blog!

Reward (Donate)

More and more platform (WeChat public accounts, Weibo, Jianshu, Baidu Reward) supports reward (donate). To catch paid reading trends, we added reward feature, supports WeChat Pay, Alipay and Bitcoin. What you need is:

  1. Get your WeChat Pay / Alipay / Bitcoin receive money QRcode image(s) and put into source/images under theme directory or upload it(them) to an image cloud to get the absolute HTTP address(es).
  2. Set needed values in theme config file:

    next/_config.yml
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    # Reward (Donate)
    reward_settings:
    # If true, reward would be displayed in every article by default.
    # You can show or hide reward in a specific article throuth `reward: true | false` in Front Matter.
    enable: false
    animation: false
    #comment: Donate comment here

    reward:
    #wechatpay: /images/wechatpay.png
    #alipay: /images/alipay.png
    #bitcoin: /images/bitcoin.png

You can also add QRcode of other platforms, e.g.

next/_config.yml
1
2
paypal: /images/paypal.png
monero: /images/monero.png

NexT supports the related posts functionality according to hexo-related-popular-posts.

Post Edit

NexT supports the edit functionality of your posts.

You can enable it by editing value post_edit.enable to true in theme config file.

hexo/_config.yml
1
2
post_edit:
enable: false

You should create a source repository of your post files. The url setting depends on the source project in github.

  • For site repository
    • Link for view source: url: https://github.com/.../tree/master/source/_posts/
    • Link for fork & edit: url: https://github.com/.../edit/master/source/_posts/
  • For post repository
    • Link for view source: url: https://github.com/.../_posts/tree/master/
    • Link for fork & edit: url: https://github.com/.../_posts/edit/master/
hexo/_config.yml
1
2
post_edit:
url: