# Intro.js [![Build Status](https://travis-ci.org/usablica/intro.js.svg?branch=master)](https://travis-ci.org/usablica/intro.js) [![](https://data.jsdelivr.com/v1/package/npm/intro.js/badge)](https://www.jsdelivr.com/package/npm/intro.js) [![npm](https://img.shields.io/npm/dm/intro.js)](https://www.jsdelivr.com/package/npm/intro.js) > User Onboarding and Product Walkthrough Library

## Where to get You can obtain your local copy of Intro.js from: **1)** This GitHub repository, using ```git clone https://github.com/usablica/intro.js.git``` **2)** Using yarn ```yarn add intro.js``` **3)** Using npm ```npm install intro.js --save``` **4)** Download it from CDN ([1](http://www.jsdelivr.com/projects/intro.js), [2](https://cdnjs.com/libraries/intro.js)) ## How to use Intro.js can be added to your site in three simple steps: **1)** Include `intro.js` and `introjs.css` (or the minified version for production) in your page. Use `introjs-rtl.min.css` for Right-to-Left language support. > CDN hosted files are available at [jsDelivr](http://www.jsdelivr.com/projects/intro.js) (click Show More) & [cdnjs](https://cdnjs.com/libraries/intro.js). **2)** Add `data-intro` and `data-step` to your HTML elements. To add hints you should use `data-hint` attribute. For example: ```html ```` See all attributes [here](https://introjs.com/docs/intro/attributes/). **3)** Call this JavaScript function: ```javascript introJs().start(); ```` Optionally, pass one parameter to `introJs` function to limit the presentation section. **For example** `introJs(".introduction-farm").start();` runs the introduction only for elements with `class='introduction-farm'`. ## Documentation Please visit [Documentation](http://introjs.com/docs). ## Using with: Intro.js has many wrappers for different purposes. Please visit [Documentation](http://introjs.com/docs) for more info. ## Build First you should install `nodejs` and `npm`, then first run this command: `npm install` to install all dependencies. Now you can run this command to minify all static resources: npm run build ## Contributors ✨

_bozdoz
💻 📖

## Support/Discussion - [Stackoverflow](http://stackoverflow.com/questions/tagged/intro.js) ## License ### Commercial license If you want to use Intro.js for a commercial application, theme or plugin the commercial license is the appropriate license. With this option, your source code is kept proprietary. Purchase a commercial license at [introjs.com](http://introjs.com/#commercial) ### Open-source license GNU AGPLv3

	Stars	Issues	Version	Updated	Created
anno.js			1.0.3	9 years ago	9 years ago
bootstrap-tour	4,426	194	0.12.0	7 years ago	11 years ago
hopscotch	4,194	100	0.3.1	7 years ago	9 years ago
intro.js	22,590	74	7.2.0	9 months ago	10 years ago
shepherd			2.8.0	5 years ago	11 years ago

anno.js vs bootstrap-tour vs hopscotch vs intro.js vs shepherd

Downloads in past1 Month3 Months6 Months1 Year2 Years5 YearsAll time

Stats

Popular Searches

Sick of boring JavaScript newsletters?

Downloads in past