Questions tagged [bootstrap-tour]

Bootstrap Tour is a quick and easy way to build your product tours with Twitter Bootstrap Popovers.

Overview:

Bootstrap Tour is based on Bootstrap Popovers. It allows you to quickly set tours, easily defining the steps and their content.

Usage:

var tour = new Tour();

tour.addSteps([
  {
    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"
  }
]);

tour.init();
tour.start();

Links:

Bootstrap Tour documentation
Project's Github page

126 questions
11
votes
2 answers

Bootstrap Tour doesn't remember where I left

I'm having trouble initiating Bootstrap Tour on a multipage tour once I get to the second page. I have the tour start with a click event and localStorage is set to false. The tour starts fine with the click event but then, when I go to the second…
ceyer
  • 113
  • 1
  • 4
6
votes
7 answers

Bootstrap Tour not working at all

Trello Inspired
Elton
  • 415
  • 3
  • 7
  • 14
5
votes
3 answers

Bootstrap Tour Prev button not going to Previous page

For clarification there are two pages: index.html ( from this page with the help of next buttons on the pop-up I traverse to the second page mentioned below) product_detail.html (from this page if i want to go back to index.html using prev button,…
Amit Singh
  • 2,267
  • 4
  • 25
  • 50
4
votes
1 answer

Skipping steps in bootstrap tour using conditional if / else checks with goTo()

first time asking a question here so I'm hoping I have all the information but feel free to ask for clarification if I'm missing something. I'm trying to create a tour through a page using the bootstrap tour library. I can get it to start, and for…
Duckful
  • 53
  • 1
  • 6
4
votes
0 answers

Validation before onNext() in Bootstrap Tour

I am using Bootstrap Tour for a guided tutorial on how to use our tool. Upon clicking the Next >> button however, I would like to make sure some javascript variables are correct before allowing the user to continue. How can I prevent the onNext()…
PaulG
  • 6,920
  • 12
  • 54
  • 98
4
votes
1 answer

Bootstrap Tour : dont move to next step if current step input filed is empty

In the bootstrap walkthrough we have next and prev buttons. In this on click next button we move to next step. But I want to add condition in that If that input filed is empty then walkthrough should not move to next it should stay on current step…
eegloonew
  • 89
  • 1
  • 8
4
votes
3 answers

Bootstrap-Tour with angularJS

I am currently working on a project where I have to show a tour on the page. I took a look at Bootstrap-Tour and it was not so bad. I am working in angluarJS controllers. So I create a Tour, add some steps to it and create a button which fire off…
Timsen
  • 4,066
  • 10
  • 59
  • 117
3
votes
3 answers

Reactour - how to disable next step until correct user action?

I'm using the Reactour library in order to build a user tour in React (duh), which is easy enough for simple steps, but I can't figure out how to prevent the user from going further in the tour until they complete the action associated with the…
yev
  • 65
  • 1
  • 6
3
votes
0 answers

How can I keep my target element for my bootstrap-tour center of the screen instead of the current step?

For example. Here is a screenshot of the current webpage with half of the target element offscreen. In this instance, the current step in the tour is centered on screen, but is there a way I could show both on the screen (my steps and my target…
3
votes
0 answers

bootstrap tour for dynamic content

i have a tour like below, after first next is done i go fetch dynamic html content using ajax, this is inserted into html body. the next step references an element that was pulled from Ajax request. problem is my next step does not show any popover…
Justin Homes
  • 3,739
  • 9
  • 49
  • 78
3
votes
6 answers

How to make bootstrap-tour work?

I have this code in a page. I'm trying to make bootstrap-tour work but it's not happening. What am I doing wrong? What am I missing here?
ST''
  • 46
  • 1
  • 1
  • 5
3
votes
4 answers

Disable highlighted area while using Bootstrap Tour

Good day! I just started using Bootstrap Tour on our project and I seem to like it because of its simple yet functional interface. But I just have one tiny issue - how do I get the elements being highlighted by the tour to be temporarily…
2
votes
0 answers

Highlight multiple elements in bootstrap-tour

I am using bootstrap tour highlight feature for a page. Apart from the element I have attached tour guide to, I want to highlight some other element as well without the tour guide being attached to the second element. Is there any possible work…
2
votes
1 answer

Popovers for "Bootstrap Tour" not working

I've been trying to install a tour onto my site using "Bootstrap Tour", I'm very new to Javascript and coding in general and I've been at it all day. Figured I'd come on here to ask people who are more experienced. hi1 works sometimes, but even…
Matt H
  • 91
  • 6
2
votes
1 answer

Bootstrap Tour only loads when I scroll the page

I have a problem with the Bootstrap tour. My problem When I redirect from one page to the other the init function will be called but does not automatically continue the tour. So the bootstrap tour gets not displayed. The page contains also an AJAX…
Julian Schmuckli
  • 3,681
  • 11
  • 37
  • 64
1
2 3
8 9