How to determine what elements should be defined? Is there a faster way to define elements?
Hey
Great question! I love that you are looking into managing and defining/naming your data as it helps to create structure and meaning. When it comes to data management, two main processes come to mind which are Named Elements + Defined Events. Named Elements let you assign your own names to complex elements like CSS selectors, where Defined Events let you assign your own names to user behavior events you track in FullStory such as common searches or complex URL’s.
To determine what to define, let’s say you had an ecommerce site that sells furniture and you want to view sessions where users interacted with an Add to Cart button on your “Outdoor Furniture” category. Because the site has multiple Add to Cart buttons, you can’t simply search for Add to Cart, but have to find the Add to Cart URL that includes /outdoor-furniture. With defined events, you can quickly and easily set up a Custom Event for the specific Add to Cart button you want to monitor. You name it “Add to Cart - Outdoor Furniture,” and now you can type that into OmniSearch and see data for that button. There’s more on this example and defined events here!
As for Named Elements, let’s say you want to view sessions where people clicked the sign in button thats located on your homepages header but finding that specific element is really difficult because it’s listed as a complex CSS selector. If you take this element and name it [Header] Sign in Button, similar to Defined Elements, it will make it much easier to locate through search and differentiate between other components of your site.
You can define these events/elements through your settings or by quickly using inspect mode during a session replay. If you have events setup in other systems like Adobe Analytics, Segment, or Tealium, you can automatically pull those in via out of the box integrations or data layer capture!
I hope this helps
Hi
- Create a Metric for Clicked anything events.
- Then choose to Group by Element / CSS Selector.
- Then click the Dimensionality icon to see an itemized list.
The last step will show you either the CSS Selector or the more user-friendly Named Element.
The above Dashboard Card created from the Metric shows that while the “Checkout Button (Cart)” element has been named, the first entry has not (because the raw selector is shown). Given it’s the most clicked element on the list, it probably should be named. I would then create a Named Element for button.cta-checkout
with the name “Checkout Button (CTA)”.
You can then refine the first step to include a specific Visited URL or Page to locate other unnamed elements using the same approach.
Reply
Enter your username or e-mail address. We'll send you an e-mail with instructions to reset your password.