Advanced Settings

Besides normal Theme Settings and Third-party Services, NexT supports some advanced settings which makes NexT customizable.
Please note that those settings may lead to abnormal behavior if they are wrong. Change them only when you know for what they are.

Third-party JS Libraries

This feature is located under vendors section in theme config file.

# Available values: local, jsdelivr, unpkg
internal: local

# Internal version: 3.1.0
# anime: //
# anime: //

# Internal version: 5.13.0
# fontawesome: //
# fontawesome: //


internal: local is used to set how to load the internal library, e.g. source/js/utils.js. Set internal to jsdelivr or unpkg to load them from the corresponding CDN.

And next part is the config of each library. Each config is in format of libname: CDN URL. For example:

anime: //

You can set it to a proper CDN URL, which can make static assets (JavaScript Third-party Library) load faster. Now NexT contains following third-party library:

Name Original Link Internal Version
Anime.js 3.1.0
FontAwesome 5.13.0
Animate.css 3.1.1

If you leave it blank, NexT will use jsDelivr as the default CDN provider. The reason that jsDelivr is chosen is because it is fast everywhere, and jsDelivr has the valid ICP license issued by the Chinese government, it can be accessed in China pretty well.

And we also provide other optional CDNs, including the famous UNPKG and CDNJS.
Particularly, if you are a Chinese blogger or most of your visits come from China, please note that the CDNJS is blocked in some parts of China, don't use it as your CDN provider.

If you want to try the other CDNs not included in the optional list, you would better use the corresponding version.
«Internal version» is the version that NexT tested and uses. And if you need other versions you need to test them first.


We extended the Hexo filter and added theme_inject, so user can add the desired custom content to any injection point.


hexo.extend.filter.register('theme_inject', function(injects) {
// ...

A injects argument will get passed into the function, so we can use it add custom code in injectPoint as following.

For inject view:

// The name of same `injectPoint` suggest be unique. If same, it will override low priority configurations.
// `locals` and `options` is the same as partial
// `order` defines the order of injection, which by default depends on the priority of injection.
hexo.extend.filter.register('theme_inject', function(injects) {
// it will put code from this filePath into injectPoint.
injects.[injectPoint].file(name, filePath, [locals, options, order]);
// it will put raw string as code into injectPoint.
injects.[injectPoint].raw(name, raw, [locals, options, order]);

You have to note filePath, it must be absolute path or relative to hexo_dir.

For inject style:

hexo.extend.filter.register('theme_inject', function(injects) {
// it will put styleFile into injectPoint.

These are many injectPoint, defined in injects-point.js

module.exports = {
views: ['head', 'header', 'sidebar', 'postMeta', 'postBodyEnd', ..., 'footer', 'bodyEnd'],
styles: ['variable', 'mixin', 'style']

custom_file_path also uses this API, see default-injects.js. It will consume custom name in view inject points. So if you use custom_file_path, please not use custom.


One: load a custom script. We can add it in bodyEnd.

hexo.extend.filter.register('theme_inject', function(injects) {
injects.bodyEnd.raw('load-custom-js', '<script src="js-path-or-cdn.js"></script>', {}, {cache: true});

Two: add a custom my-favourite-food.swig to sidebar.

Step1: you should create my-favourite-food.swig in any path(e.g. source/_data/) as below. You can get variable from hexo or local defined in filter.

{% for food in foods %}
{% endfor %}

Step2: add filter to load it.

hexo.extend.filter.register('theme_inject', function(injects) {
injects.sidebar.file('my-favourite-food', 'source/_data/my-favourite-food.swig', {
foods: ['apple', 'orange']

Three: want to have big header, put big-header.styl to NexT.

Of course, you need to create this file first(e.g. source/_data/big-header.styl).

h1 {
font-size: 2rem;

And then add it in filter.

hexo.extend.filter.register('theme_inject', function(injects) {'source/_data/big-header.styl');


We also support hexo's plugin system, which makes it easy to extend functions without modifying the source code of the core module. You can see to learn how to create a plugin.