With Product Tours, you can create a sequence of messages to guide customers around your product to drive faster adoption. You can create a sequence of posts, images, videos, and social proof to guide customers.
Here are the steps for the programmable product tours -
Step 1. Start function
faqBotStartJsonOnboarding(<variable contains the onboarding code say myOnboardingCode>);
Step 2: To define the onboarding code in the onboarding variable.
Say your variable is myOnboardingCode, it should contain either of these two functions i.e. faqbotInsertOnboardingBanner or faqbotInsertOnboarding with the right DOM, 'next'/'finish', question id and index. Last function call shall have the mandatory 'finish'.
Example
var myOnboardingCode = "faqbotInsertOnboardingBanner('next', 78, 0); faqbotInsertOnboarding('HTML > BODY:nth-child(2) > SECTION:nth-child(6) > DIV:nth-child(1) > DIV:nth-child(2) > DIV:nth-child(3) > DIV:nth-child(1)', 'finish', 82, 1);";
faqBotStartJsonOnboarding(myOnboardingCode);
List of functions:
- faqbotInsertOnboardingBanner: To put a banner on the centre of the page (not associated with any element).
- Parameters (in the same order):
- Button: 'next' or 'finish' small case last function should have 'finish'
- Question Id: Number
- Index: number, starts from 0 and should be 1 higher than the previous function.
- faqbotInsertOnboarding: To put the onboarding on an element
- Parameters (in the same order):
- Dom Path: DOM of the element.
- Button: 'next' or 'finish' small case last function should have 'finish'
- Question Id: Number
- Index: number, starts from 0 and should be 1 higher than the previous function.
Q. How to get the DOM Path of an element?
Inspect element, right-click, and copy selector to find the DOM path of the element.