Some links need not to be preloaded with InstantClick. Blacklisting allows you to do that.

What to blacklist

What to blacklist, and to NOT whitelist:

Some links are already blacklisted internally, and can’t be whitelisted:

Blacklist a link

To blacklist a link, add it a data-no-instant attribute.

<a href="/blog/" data-no-instant>Blog</a>

Blacklist a group of link

It may sometimes be more convenient to blacklist a group of links, instead of adding data-no-instant attributes to all of them.

To blacklist all links in a parent element, add data-no-instant to that element.

Whitelist a link or group of links

If you’ve blacklisted a parent element and would like to whitelist a link (or all the links in a sub-parent), add a data-instant attribute to that link or sub-parent.

What’s happening behind the scenes is InstantClick goes through all the parent elements, from the current link to <html>, if it finds a data-no-instant attribute it considers the link blacklisted and stops looping through the parents. If it finds a data-instant it considers the link whitelisted.

If you’d like to blacklist all links by default, and then whitelist links one by one, or whitelist only links in a container, add a data-no-instant attribute to the <body> and a data-instant attribute to the container/links.

Whitelist mode

The following is deprecated and will likely be removed in 4.0. It’s only useful to know if you’re dealing with a website that has it activated (the true argument is passed to InstantClick.init).

The Correct Way™: If you want to accomplish the same as the whitelist mode, just add data-no-instant to your <body>, as described in “Whitelist a link or group of links”.

The whitelist mode is enabled by passing a true argument to InstantClick.init.

1 2 3 4 5
/* or */
InstantClick.init(50, true);
/* or */
InstantClick.init('mousedown', true);

Documentation table of contents

Getting started

Go further