- 2 Minutes to read
- Print
- DarkLight
Teaser Tracking
- 2 Minutes to read
- Print
- DarkLight
With teaser tracking, you can analyze your onsite teasers' views, clicks, and engagement. Learn more about it here.
Overview
Value | Description | Data type | Default value | Required | Where to analyze | Request Parameter |
---|---|---|---|---|---|---|
name | Specifies the teaser name. E.g., "16554_winter-sale" |
| Yes | Navigation > Teaser - Performance > Teaser Name | ck521 | |
selector | Specifies the element to be measured. You can pass the CSS selector of the element. |
|
| - | - | |
shadowRoot | If your content to be measured is inside a shadow DOM element, specify the CSS selector of the shadow DOM element. If you have defined a CSS selector as the "selector", it will refer to the "shadowRoot" selector you have defined. |
| - | - | ||
rank | Specifies the teaser placement. E.g., "Position_6" |
| - | Navigation > Teaser - Performance > Teaser Performance | ck520 | |
content | Specifies the teaser content. E.g., "News" |
| - | Navigation > Teaser - Performance > Teaser Performance | ck526 | |
variant | Specifies the teaser variant and is often used for testing. E.g., "A". |
| - | Navigation > Teaser - Performance > Teaser Performance | ck522 | |
seen | When set to |
|
| - | ck523 | |
type | Specifies the teaser conversion type.
|
|
| - | ck527 | |
goal | Specifies the teaser conversion goal.
|
|
| - | - | |
value | Specifies the teaser conversion value that will be assigned to the teaser in case of an order.
|
|
| - | - |
Implementation Example
<template>
<a href="#" ref="teaser_element">Teaser</a>
</template>
<script>
export default {
name: "example",
mounted() {
this.$webtrekk.extension("teaser_tracking"); // activate teaser tracking
this.$webtrekk.extension("teaser_tracking", "add", {
selector: this.$refs.teaser_element,
data: {
name: "My products",
rank: "header",
content: "My products overview",
variant: "products"
},
conversion: {
type: "click",
goal: "order",
value: "10%"
}
});
}
};
</script>
<template>
<div>
<a
v-webtrekk.teaser_tracking="{
data: {
name: 'My products',
rank: 'header',
content: 'My products overview',
variant: 'products'
},
conversion: {
type: 'click',
goal: 'order',
value: '10%'
}
}"
href="#"
>Teaser</a
>
</div>
</template>