Overview
While creating a Guide step (tooltip/input) or a Hotspot (beacon icon), you need to connect it to an HTML element of your page. However, some conflicts may occur due to your HTML structure and layout.
Please check the most common scenarios below and see if one or more is happening to your materials.
When my selected HTML is absent on the targeted page, another HTML element is highlighted
When switching between pages, an incorrect HTML element is being highlighted
I have to keep relocating my HTML element because my selection is getting lost
The solution
All the issues above can be easily fixed by using a Custom CSS Selector from the Chrome Extension so that UserGuiding can be highly specific when locating your HTML element.
Please watch our video tutorial for more details or check this article.
Important: You may conclude that the selected HTML element does not have a unique attribute to be used as a CSS selector. In such a case, please ask your development team to manually add an attribute to it so that you can implement our solution.