What is Inspect Mode?
Inspect Mode allows you to visually interact with your site to identify page elements, provide aggregate statistics on page elements, and create or add those elements to a search. Inspect Mode can be activated on any session playback at any time in the playback.
You don’t need to be a web wizard anymore to search on those fiddly bits of code (also known as CSS selectors). Think of it as a WYSIWYG editor for Fullstory Omnisearch.
How do I use Inspect Mode to build searches?
While playing a session, click Page Insights in the top right of the playback screen and then toggle to Inspect Mode.
Click any part of the page you want to know more about. This can include buttons, text, links, white space, pictures, etc. You can also scroll to bring other parts of the page into the viewport. And be sure to hover and use your mouse's zoom feature to increase or decrease specificity.
For example, let's say you're trying to find sessions where people clicked the Add to Cart button – you would start playing a session, click Page Insights > Inspect Mode, then click on the Add to Cart button within the playback screen.
Once you've clicked on something that interests you, we'll suggest the related Optimized and Full CSS selectors you might want to use in your search. (What's the difference? Find out here!)
You can click on a suggestion or keep what you've already got. You can also click in the text field to manually refine the CSS path, if that's something you're comfortable with.
When you're ready, click Add to search or Create new search. You'll be taken back to the main search screen with a simple search that has been created for that selector. You can now change the scope of that search by adding other user or event criteria. You can also save the search as a segment so you don't lose all your hard work!
If HTML elements have a disabled attribute, they cannot be selected with the Inspect Mode tool. A workaround for this is to use your browser's Inspect Mode to find appropriate selectors and manually create elements and/or searches.
Pro-tip: If you find an element you like, but want to scroll through its child elements, hold SHIFT + scroll on your mouse, trackpad, or Nintendo Power Glove(tm). This might be useful if, for example, you want to select not one menu item from your nav bar, but the entire nav bar. Now you’re scrolling through the DOM like a boss!
How do I use Inspect Mode to exclude elements from being captured?
Account admins can also use Inspect Mode to easily identify text fields and other areas where customers will enter sensitive information, so that those elements will never be captured by Fullstory.
Using the same steps as above, find the element within your page, then click 'Create data capture rule' and save the element's CSS selector as an exclusion.
Warning: this means you will no longer be capturing that field in any of your sessions. Be sure to read more about that here.