The easiest way to show people how to use your website.
Not using Bootstrap? It works anyway!
If you are using Bootstrap, include bootstrap-tour.min.css
and bootstrap-tour.min.js
:
<link href="bootstrap.min.css" rel="stylesheet">
<link href="bootstrap-tour.min.css" rel="stylesheet">
...
<script src="jquery.min.js"></script>
<script src="bootstrap.min.js"></script>
<script src="bootstrap-tour.min.js"></script>
Otherwise, just include bootstrap-tour-standalone.min.css
and bootstrap-tour-standalone.min.js
:
<link href="bootstrap-tour-standalone.min.css" rel="stylesheet">
...
<script src="jquery.min.js"></script>
<script src="bootstrap-tour-standalone.min.js"></script>
// Instance the tour
var tour = new Tour({
steps: [
{
element: "#my-element",
title: "Title of my step",
content: "Content of my step"
},
{
element: "#my-other-element",
title: "Title of my step",
content: "Content of my step"
}
]});
// Initialize the tour
tour.init();
// Start the tour
tour.start();
Do you want to do more? Read the full documentation.
Code licensed under the MIT license.
Documentation licensed under CC BY 3.0.