topic How to create a widget for intro.js in Web AppBuilder Custom Widgets Questions

How to create a widget for intro.js

GarethYoung1 — Mon, 19 Nov 2018 08:56:55 GMT

Hi Robert,

How would I go about creating a widget that will launch a Intro.js tour. I've currently got it configured as a button on the header controller widget but would prefer it was a widget on its own (a bit like your URL widget) so when you click on it it starts the tour.

Thanks

Gareth

Re: How to create a widget for intro.js

RobertScheitlin__GISP — Mon, 19 Nov 2018 14:48:47 GMT

Gareth,

It is pretty simple. Here it is:

Adri2c Pérez Beneito‌

Re: How to create a widget for intro.js

GarethYoung1 — Mon, 19 Nov 2018 17:10:08 GMT

Thanks Robert.

I've added it to my application successfully:

However, I'd like to add it as a widget rather than a button but I'm not sure where to start with creating one of these?

Also is it possible to add the button to an info widget box?

Many thanks for all your help

Gareth

Re: How to create a widget for intro.js

RobertScheitlin__GISP — Mon, 19 Nov 2018 17:12:33 GMT

Gareth,

??? I have provided this as a widget already in my attachment.

Re: How to create a widget for intro.js

GarethYoung1 — Mon, 19 Nov 2018 17:30:57 GMT

I see thats for a buffer. Can I just re-use thatcode. I'm relatively new to javascript?

Re: How to create a widget for intro.js

RobertScheitlin__GISP — Mon, 19 Nov 2018 17:34:51 GMT

??? Gareth are you looking at my first reply to you and the attachment to that reply called IntroJS.zip? There is nothing about a buffer...

Re: How to create a widget for intro.js

Adri2cPérez_Beneito — Mon, 19 Nov 2018 21:22:54 GMT

Robert that's cool! That's a cleaner way to execute the function..

Cheers!

Re: How to create a widget for intro.js

GarethYoung1 — Tue, 20 Nov 2018 08:09:13 GMT

Robert, got it now. Thank you so much. Your help is very much appreciated

Re: How to create a widget for intro.js

GarethYoung1 — Tue, 20 Nov 2018 08:57:44 GMT

Robert, one further question, how do you make the widget have the ability to be added to a group?

Re: How to create a widget for intro.js

GarethYoung1 — Tue, 20 Nov 2018 12:48:35 GMT

This is the error that I get:

Re: How to create a widget for intro.js

RobertScheitlin__GISP — Tue, 20 Nov 2018 13:46:35 GMT

Gareth,

Because this is not an inPanel widget you can not group it. You would not want to group this widget anyway. When you group a widget and open the group the widegt would automatically start the into because the intro is initiated on widget startup.

Re: How to create a widget for intro.js

RobertScheitlin__GISP — Tue, 20 Nov 2018 17:24:33 GMT

Don't forget to mark this question as answered by clicking on the "Mark Correct" link on the reply that answered your question.