Named Elements

Named Elements let you assign your own names to complex elements like CSS selectors. This helps make your FullStory data more meaningful and easy to understand. After you name an element, you can search for it by name when analyzing your data. 

Getting Started with Named Elements

There are two ways to set up Named Elements: from Inspect Mode and from Settings. 

Creating a Named Element from Inspect Mode

1. While watching a session, go to Page Insights > Inspect Mode. 
2. Click on the element you'd like to name, then click Create Element.
   1. For Elements that have already been created and defined, when clicking on these you will be presented with the Edit Element option.
3. Name your element and add a description. 
4. Choose which platform(s) you'd like to monitor the element selector on (Web, iOS and/or Android)
5. Click "or" to assign the same name to multiple selectors.
6. Select any Element Capture Options that you'd like to apply to this element.
7. Save your Element.

Creating a Named Element from Settings

1. Go to Settings > Data Management > Elements.
2. Click "Create Element." 
3. Name your element and add a description. 
4. Add the selector you'd like to name.
   1. Choose which platform(s) you'd like to monitor the element selector on (Web, iOS or Android)
5. Click "or" to assign the same name to multiple selectors.
6. Select any Element Capture Options that you'd like to apply to this element
   1. "Watch this Element" helps you determine if an element rendered on the page and if it was visible in the user’s viewport. Click here to learn more about Watched Elements.
   2. If you'd like this element to be excluded from being classified as a Rage Click or Dead Click, check those boxes accordingly.
7. Click "Save."

Using Named Elements

After you create a Named Element, you can search for it by name when building segments, funnels, metrics, journeys and dashboards. Use an Element filter to see a list of all elements in your account. 

FAQ

Are Named Elements retroactive?
Yes! After you create a Named Element, you can use it to search through all past and future FullStory data. However, Named Elements are not retroactive in Heatmaps, Journeys or Segment and Dimensionality Cards. While searches for Named Elements apply to sessions retroactively, the event log within those sessions is not updated in sessions that were captured prior to the Named Element being created.

Are Watched Elements retroactive?
No. Read more on this here.

Will FullStory let me know if my site's CSS changes and my element no longer makes sense?
No, FullStory will not alert you that your Named Element no longer exists on your site. 

Do Named Elements work with webhooks?
No, Named Elements don't work with FullStory webhooks or other webhook-based integrations like Zapier. Please use custom events defined via the FullStory JavaScript API for those integrations. 

What's the difference between a Defined Event and a Named Element?
Named Elements apply to CSS selectors only whereas Defined Events allow you to assign a name to specific user behavior. You can reference a Named Element when creating a Defined Event (for example, clicked element “Add to Cart” when the Visited URL starts with /category-listing”). 

Will the platform option be visible for all FullStory accounts, regardless if an account is using FullStory for Mobile Apps?

Yes. All platform checkbox options (Web, iOS, and Android) will be visible in the element definition for any FullStory account.

Will existing elements have the platform element selected?

For accounts with FullStory for Mobile Apps, FullStory will not pre-select Web, iOS, or Android checkboxes. The checkboxes will be unselected and an Admin will be prompted to select the Web, iOS, or Android once opening the element definition.

For accounts without FullStory for Mobile Apps, the web checkbox will be selected by default. iOS and Android checkboxes will also be displayed, but aren’t selectable or active.

If I have two independent legacy elements for web and iOS, will those get combined into one element to manage?

No. For legacy elements, FullStory will not combine the two element definitions into one. The element definitions will remain separate.

Can I combine two separate elements into one existing element definition or one new element definition?

Yes. An Admin can combine two element definitions into one. If two element definitions are combined into one existing definition, the new selector added to the existing element definition will be considered “new” and will not be retroactive.

An example of this would be having one existing web element definition and one existing iOS element definition that you want to combine into one element definition. If you add the iOS element definition to the existing web element definition, the iOS selector added is considered a “new” definition and is not retroactive.

How do I group elements together that have slightly varying CSS Selectors?

You can accomplish this by naming an element. When you name an element, it will take precedent for aggregations in Page Insights/Heatmaps. This creates an accurate count insight of the heatmap for all clicks on the elements you are interested in tracking.