Quick Start

Here you can find a simple way to add a basic introduction and hints to your page.

Requirements

Before you start, make sure you have Intro.js installed. Read the Install Intro.js page to install the dependencies.

After installing Intro.js, add data-intro and data-step to your HTML elements.

For example:

<a href='http://example.com/' data-intro='Hello step one!'></a>

See all Tour attributes on the Tour HTML Attributes page.

Then, call this JavaScript function:

introJs().start();

Optionally, pass one parameter to introJs function to limit the presentation section.

introJs(".introduction-farm").start();

runs the introduction only for elements with class='introduction-farm'.

To add hints you should use data-hint attribute on elements.

For example:

<a href='http://example.com/' data-hint='Hello step one!'></a>

Then call this JavaScript function to add the hints to the page:

introJs().addHints();