When building a tour, you might need to connect your pointers to a specific element on your page. Otherwise, it would not be possible to place the pointer correctly aiming at your element and darken the area around the element.


What Are Element Selectors?

Element selectors are unique identifiers in the HTML code of your webpage that help pinpoint elements. Examples:

  • Classes: .help-button or class="help-button"
  • IDs: #login_bttn or id="login_bttn"
  • Attribute combinations: These can include multiple properties to ensure unique identification.

Use the Usetiful Plugin for Chrome

The easiest way to get element selectors is by using the Usetiful extension for Chrome. To get the Usetiful extension Click here.

Once installed and signed in with your Usetiful credentials, follow these steps:


Note: If the Usetiful plugin doesn’t open, check if it’s active. Click the puzzle icon in your Chrome browser's toolbar, then locate and activate the Usetiful extension.



A: Select Elements When Creating a Tour

  • In the Usetiful editor, locate the element selector field and click the crosshair button next to it.
  • Enter the page URL where the tour step is displayed and click "Open page".
  • The browser navigates to the URL, and the Usetiful extension opens automatically.
  • Hover over the desired element to highlight it. Click the element to copy the selector directly into the tour editor.


B: Manually Open the Usetiful Plugin

  • Navigate to the desired webpage and click the Usetiful extension icon in Chrome.
  • Select "Open panel" to display the plugin panel at the bottom of the screen.
  • Enable Element Selection Mode (if not active).
  • Hover over the element you want and click it to copy the selector to your clipboard. Paste it into the editor.


To learn about How to Work with Dynamic Element Selectors, click here.

To learn about How to Select Elements in a Dropdown, click here.


The Usetiful plugin simplifies finding selectors, even for complex dynamic elements or dropdowns. However, if you need to find selectors manually, please refer to our detailed guide: How to Manually Find Element Selectors Using Chrome DevTools.