Recall from the SmartTips lesson that we learned how to create a Mini Menu using a SmartTip. In this lesson, we will learn how to create a Mini Menu using a Launcher and a Smart Walk-Thru.
Provide next steps to your users by attaching a Mini Menu to the end of a Smart Walk-Thru.
Watch the video to know more. Note that the video doesn't support audio.
Attaching a Mini Menu to the end of a Smart Walk-Thru allows additional branching options, as well as the opportunity to replace a standard success message with an actionable success Mini Menu.
How to Create a Smart Walk-Thru Mini Menu?
Please note, the steps do not cover how to create a Launcher or Smart Walk-Thru as this was covered in Builder I, but how to design a Launcher and Smart Walk-Thru to act as a Mini Menu.
Scenario |
---|
The Eddie's team would like to add a Mini Menu Launcher that launches a Popup Mini Menu to each product page in order to guide users to other WalkMe content if they need it. They would like the Mini Menu to include links to the following previously built WalkMe content:
The Launcher text should say Need Help? and should match the site's colors and style. |
Step 1 - Create a Smart Walk-Thru and add a Popup step |
---|
We will create this Smart Walk-Thru with just a single Mini Menu Popup step which we will attach to a Launcher. When adding a Mini Menu to the end of a Smart Walk-Thru, you can simply add a Popup Step to the end of an already built Smart Walk-Thru. ![]() |
Step 2 - Add Text to the Popup step |
---|
![]() |
Step 3 - Create the Launcher |
---|
On any product page, select the product title. Choose a Launcher style created previously from the Gallery tab, or adjust the settings in the Design tab to match the Launcher color and style to the site. ![]() |
Step 4 - Set the Launcher Action |
---|
In the Action tab, set the Launcher to play the Mini Menu Smart Walk-Thru that we created in step 1. ![]() |
Step 5 - Troubleshoot your Launcher (Part 1) |
---|
Scroll up and down on the page and notice how the Launcher appears overtop of the navigation menu at the top of the screen. Switch to the Arrange tab and enable Arrange Layer Order (z-index). In this case, just enabling is enough to fix the issue. But in other cases, you may need to make further adjustments to make sure that the Launcher appears on the correct layer of the screen. ![]() |
Step 6 - Troubleshoot your Launcher (Part 2) |
---|
The Eddie's team wants the Launcher to appear on every product page, so let's preview the Launcher and navigate to a few different product pages. We want to make sure that the Launcher appears consistently on each different product page. After navigating to a few pages, we notice that it does not appear consistently or requires a page refresh to appear. To fix this, in the Selected Element tab, enable Appears and disappears as a result of user action in the Element's Behavior section. This is because the element that the Launcher is attached to "appears and disappears" when the user moves between different product pages. ![]() |
Step 7 - Test your Mini Menu |
---|
Use Preview Mode to test your Mini Menu. Click the Preview button at the bottom of the Editor. You'll want to make sure you're Previewing all the content associated with the Mini Menu. That includes the Launcher, Mini Menu Smart Walk-Thru, and Resources and other Smart Walk-Thrus linked to by the Mini Menu. Once Preview mode has loaded, click the Launcher to test the Mini Menu functionality. Make sure to click each link and make sure each link is working as expected. ![]() |
Summary |
---|
Congrats! You've created a Mini Menu using a Launcher & Smart Walk-Thru! If you are creating this for a live environment, make sure to publish all the content associated with the Mini Menu (Launchers, Smart Walk-Thrus, Resources, Surveys, etc.) when you are ready to publish your Mini Menu. |