Custom Pages

NexT User Docs – Theme Settings - Custom Pages

Custom Page Support

Next allows users to add custom pages in menu.

In your terminal emulator, change to Hexo site dir. Use hexo new page custom_name to create a new custom_name page:

$ cd your-hexo-site
$ hexo new page custom_name

Front-matter is a block of YAML or JSON at the beginning of the file that is used to configure settings for your writings. Settings Front-matter values and more detailed can be found in Front-matter. You can also add contents in custom_name/index.md if you like.

1
2
3
title: custom_name
date: 2014-12-22 12:39:04
—

Add custom_name to menu by editing theme config file, like adding about page:

next/_config.yml
1
2
3
4
menu:
  home: / || home
  archives: /archives/ || archive
  about: /about/ || user

If you want to add Tags or Categories page, please continue reading.

Adding «Tags» Page

Adding «Tags» page and show «Tags» link in menu. «Tags» page will show all tags of site. If no article has tags, this page will leave blank.
Following code shows you a example of article with tags:

1
2
3
title: Tags Testing Article
tags: [Testing, Another Tag]
—
1
2
3
4
5
title: Tags Testing Article
tags:
  - Testing
  - Another Tag
—

Please read Hexo’s Docs of Categories & Tags to know how to add tags or categories for articles.

In your terminal emulator, change to Hexo site dir. Use hexo new page tags to create a new tags page:

$ cd your-hexo-site
$ hexo new page tags

Edit the new page and change the type to "tags", theme will show tags cloud automatically in this page. Page content looks like following:

1
2
3
4
title: Tags
date: 2014-12-22 12:39:04
type: “tags”
—

Add tags to menu by editing theme config file, like following:

next/_config.yml
1
2
3
4
menu:
  home: / || home
  archives: /archives/ || archive
  tags: /tags/ || tags

If you enable any comment system for your site, comments will be shown for all posts and pages.
See «How to Disable Comments on Page» if you want to do it for pages like tags or categories.

Tagcloud

By default, NexT has setted font color and size for tagcloud in tags page.
From NexT v7.0.2 you can customize them, just set related values in theme config file:

next/_config.yml
1
2
3
4
5
6
7
8
9
10
tagcloud:
  # If true, font size, font color and amount of tags can be customized
  enable: true

  # All values below are same as default, change them by yourself
  min: 12 # min font size in px
  max: 30 # max font size in px
  start: '#ccc' # start color (hex, rgba, hsla or color keywords)
  end: '#111' # end color (hex, rgba, hsla or color keywords)
  amount: 200 # amount of tags, chage it if you have more than 200 tags

Adding «Categories» Page

«Categories» page can be added in similar way as «Tags» page, only name there is difference: just need to replace tags with categories.

Adding Google Calendar Page

In your terminal emulator, change to Hexo site dir. Use hexo new page schedule to create a new schedule page:

$ cd your-hexo-site
$ hexo new page schedule

Front-matter is a block of YAML or JSON at the beginning of the file that is used to configure settings for your writings. Settings Front-matter values and more detailed can be found in Front-matter. You can also add contents in schedule/index.md if you like.

1
2
3
title: schedule
date: 2014-12-22 12:39:04
—

Add schedule to menu by editing theme config file:

next/_config.yml
1
2
3
4
menu:
  home: / || home
  archives: /archives/ || archive
  schedule: /schedule/ || calendar

Login to Google developers and add Google Calendar API, you will get your calendar ID and API KEY. More detailed documentation

You can enable it by editing values calendar.enable to true, and copy the value of calendar ID and API KEY in theme config file.


next/_config.yml
1
2
3
4
5
6
7
8
9
10
11
calendar:
  enable: false
  calendar_id: <required>
  api_key: <required>
  orderBy: startTime
  offsetMax: 24
  offsetMin: 4
  timeZone:
  showDeleted: false
  singleEvents: true
  maxResults: 250

Cheers Archive Page

By default NexT shows the cheers characters from ok to excellent according to the numbers of your posts. You can disable it by editing values cheers to false in theme config file.

next/_config.yml
1
cheers: false

Custom 404 Page

In your terminal emulator, change to Hexo site dir. Create a new folder called 404, then create a new page in it:

$ cd your-hexo-site
$ mkdir 404
$ touch 404/index.md

If you would like to enable commonweal 404(A service provided by Tencent in China), Edit 404/index.md like this:

---
title: 404
date: 1970-01-01 00:00:00
---
<script src="//qzonestyle.gtimg.cn/qzone/hybrid/app/404/search_children.js"
        charset="utf-8" homePageUrl="/" homePageName="Back to home">
</script>

You can also add any content you want to it.

Add 404 to menu by editing theme config file:

next/_config.yml
1
2
3
4
5
menu:
  home: / || home
  archives: /archives/ || archive
  schedule: /schedule/ || calendar
  commonweal: /404/ || heartbeat