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
0
votes
0 answers

Running ng2 tour demo

What are the necessary steps to get the tour demo to work after downloading the source code? I've tried multiple times but it gives me these errors after using the command ng serve: ERROR in…
0
votes
0 answers

Bootstrap Tour v0.11 not working

I am using Bootstrap Tour v0.11, but I am unable to activate the tour. I want to start the tour with a button so I added a click function. However, when I check the console, I get a SyntaxError on my element. Here is my button and div I want to…
0
votes
1 answer

Multi-page bootstrap tour, not shown popover in the second page

I use yii2 as a backend framework, I want to make tour for my app, but bootstrap tour popover not shown on the second page, I create an asset bundle for bootstrap tour and register it in the layout, bootstrap tour work correctly on the first page…
masih
  • 47
  • 8
0
votes
3 answers

Bootstrap tour start button

I use bootstrap in my site and to explain my site I would like to use bootstrap tour. I have implement this in my test page and work fine. But the tour start when load the page, and I want starting a tour when click a button. I have follow this…
Frankie
  • 490
  • 8
  • 23
0
votes
1 answer

How do I select just the first element of a specific class in Bootstrap Tour?

I have many divs with the class .contact-box on the page that my Tour is executed on. I don't want to select all, just the first one. I tried this: { element: "#page-wrapper div.contact-box:first-of-type", title: "Player Info", …
marcamillion
  • 32,933
  • 55
  • 189
  • 380
0
votes
2 answers

Bootstrap Tour Not Working

I am testing out Bootstrap Tour for a very simple test page that I have setup. The content displays but the tour functionality does not kick in for some reason. Could someone tell me what I could be doing wrong? Thanks :) Please find my code…
Mustafa
  • 337
  • 7
  • 14
0
votes
1 answer

Bootstrap Tour Unable to work on dropdown

I am using http://bootstraptour.com/ to do a tour of features in an application. I am trying to get the tour to work with a native bootstrap dropdown. The dropdown contents are hidden and when the tour gets to that step I am adding the CSS class…
Rob
  • 333
  • 5
  • 25
0
votes
1 answer

Not working BootstrapTour with meteor 1.4

I am using flowkey:bootstrap-tour package for BootstrapTour in meteor 1.4. but this package not working with my App. Here is my codes for this : let tour = new Tour({ name: "tour", debug:true, container: "body", steps: [ …
0
votes
1 answer

How to handle multi page tours with Bootstrap-Tour and dynamic paths?

I can't for the life of me figure out how to get Bootstrap Tour to work across multiple dynamic url pages. My tour starts on the users page / and I'm having them click a photo gallery and want tour to continue from that gallery page…
Jeff Wilbert
  • 4,400
  • 1
  • 20
  • 35
0
votes
1 answer

Angular ui Tour - not scrolling

I just implemented Angular Ui Tour (https://github.com/benmarch/angular-ui-tour) on my site, everything seems to work, except scrolling to the opened dialog. I created and started the tour like…
user5638730
  • 495
  • 2
  • 9
  • 22
0
votes
1 answer

I used Bootstrap tour on my site. The tour works for the first time and then, it stops working. How do i resolve this error?

It works for the first time. So, i must have all my dependencies correct. Here's my tour code. var tour = new Tour({ name: 'First Tour.' steps: [ { element: "#no1", title: "NUMBER", content: "Enter the no. of…
0
votes
0 answers

Div tag around 's in a table

I want to add a tags inside a
tag for implementing Bootstrap Tour. I've tried the below code,
0
votes
0 answers

access widget's HTML element

There is a HTML widget loaded along with a webpage, when I do inspect element on it, the code shows as I need to access the widget's HTML elements in bootstrap tour for which I wrote following code (viewAll is the class name of one of the…
surm
  • 167
  • 2
  • 11
0
votes
2 answers

Bootstrap tour template not applying id on all buttons

I added an id to the next button to style it following the template tag in bootstrap tour. I applied a new id to the next button but it only applies it to the first one, not the latter stages. Does anyone know why? template: "
m33bo
  • 1,334
  • 1
  • 17
  • 34
0
votes
0 answers

Angular Bootstrap tour 'end tour' when clicked stops the tour for good

I have a tour currently running on my site, but it doesn't seem to actually keep track of if the user has clicked End Tour. Meaning that if they click it once, it ends the tour, but then when they revisit the page, the tour will automatically start…
1 2 3
8 9
hhh iii jjj