Skip to main content
Version: v2

Set Element Properties

Use the data-fs-element-properties data attribute in your HTML markup to capture attributes as element properties.

Element properties are available to search and analyze for all captured interactions that target elements with this attribute. Any Named Elements defined will be connected automatically to the properties captured at or above the depth of the corresponding element selector.

You can set the data-fs-element-properties data attribute on multiple elements in the same hierarchy. When conflicting properties are captured (i.e. the same name and type are captured for the same element interaction), the deepest property value captured is taken.

The data-fs-element-properties data attribute should be a valid JSON object with key-value pairs. Each JSON key indicates an attribute from which the value should be captured. The corresponding JSON value indicates the value type or an optional advanced object indicating override name and value type.

Key-Value Pairs
    key string required

    Name of attribute on element from which the value should be captured.

    value string/object required

    If string, indicates the value type of the attribute to be captured.
    If object, requires type field (string) indicating value type of the attribute to be captured and allows name field (string) to override captured element property name if the default attribute name is not desired.

Value Types

The allowed value types align with the types available for properties. Some single value types have special handling for better attribute type specific capture. All repeated value types are handled as JSON arrays with corresponding JSON type requirements.

TypeExamples
bool
1, t, true, 0, f, false
When the attribute value is not a valid bool value or does not exist, the resulting element property value falls back to attribute existence (i.e. value exists = true, value not exists = false)
bools
[true, false], [false]
date
2006-01-02T15:04:05Z, 2006-01-02
Values should be a valid ISO8601 datetime or date
dates
["2006-01-02T15:04:05Z", "2006-01-02"]
Values should be valid ISO8601 datetime or date strings
int
0, -123, 45
ints
[0, 1, 2], [6, -6]
real
12.345, 1, -0.5
reals
[12.345, 1], [5]
str
foo, bar, foo@bar
strs
["foo", "bar"], ["foo", "bar", "foo@bar"]

Limits

  • Capture up to 50 unique properties on a single element interaction.
  • Capture up to 500 unique properties across all element interactions.

Additional Information

Example Use

Capturing Properties on Add to Cart Button
<button
id='add-to-cart'
data-product-name='Baseball Cap'
data-price='23.99'
data-quantity='1'
data-fs-element-properties='{
"id": "str",
"data-product-name": {
"type": "str",
"name": "productName"
},
"data-price": "real",
"data-quantity": "int"
}'
/>

Results in the following element properties captured for any interaction on the button:

id (str): "add-to-cart"
productName (str): "Baseball Cap"
data-price (real): 23.99
data-quantity (int): 1