Contents x
      Product List Tracking
      • 2 Minutes to read
      • Print
      • Dark
        Light
      Contents

      Product List Tracking

      • 2 Minutes to read
      • Print
      • Dark
        Light
      Article summary

      The Product List Tracking extension allows you to analyze the products viewed and clicked in the catalog. Find more information here.

      Overview

      Value

      Description

      Data type

      Default value

      Required

      Where to analyze

      Request Parameter

      id

      Contains the product id or product name.

      String


      Yes

      E-Commerce > Products

      ba

      position

      Specifies the product position within the list.

      Number


      Yes

      E-Commerce > Product Position in List

      plp

      selector

      Specifies the element to be measured. You can pass the CSS selector of the element.

      String

      current 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.

      String


      -

      -

      -

      cost

      Contains the product price ("0" prices are allowed). If the quantity is greater than 1, use the total price.

      Number


      -

      Metrics

      • Value Product Views

      • Value Product Added to Cart

      • Value Purchased Products

      co

      quantity

      Contains the product quantity.

      Number


      -

      Metrics

      • Qty Product Views

      • Qty Product Added to Cart

      • Qty Purchased Products

      qn

      soldOut

      Indicates that the product is sold out or in stock. true means sold out false to in stock.

      Boolean


      -

      E-Commerce > E-Commerce Parameters

      cb760

      category

      Use this parameter to categorize products. Find more details below.

      Object


      -

      E-Commerce > Product Categories or metric


      ca[ID]

      parameter

      Use parameters to add additional information to a product. Find details below.

      Object


      -

      E-Commerce > E-Commerce Parameters or metric

      cb[ID]

      Further information

      parameter

      In contrast to categories, parameters can track different values with each product request. Find more details here.

      Before use, parameters must be set up under Mapp Q3 > Configuration > Custom Parameters > E-Commerce Parameter. The ID and data type (text/number) are defined for each parameter during setup. Find more info here.

      Example (parameter with ID "1"): {1:"position-1"}

      category

      With categories, you can add unique information for each product. You can track them onsite or import data. Learn about use cases here.

      Before use, categories must be set up under Mapp Q3 > Configuration > Categorisation > Content Groups. The ID and data type (text/number) are defined for each parameter during setup. Find more info here.

      Example (parameter with ID "1"): {1:"Woman"},

      Categories are assigned once to a page only: in the first-ever request of a page. We, therefore, recommend implementing page and content group tracking in parallel.

      See also How can I replace missing values ("-") in categories?

      Implementation Example

      <template>
  <a href="#" ref="product_list_element">Product</a>
</template>
 
<script>
export default {
  name: "example",
  mounted() {
    this.$webtrekk.extension("product_list_tracking"); // activate product list tracking
    this.$webtrekk.extension("product_list_tracking", "add", {
      selector: this.$refs.product_list_element,
      data: {
        id: "product id 1",
        position: 2,
        cost: 19.95,
        quantity: 1,
        soldOut: false,
        category: {1: "category-1", 5: "category-5"},
        parameter: {1: "parameter-1", 7: "parameter-7"}
      }
    });
  }
};
</script>
      <template>
  <div
    v-webtrekk.product_list_tracking="{
      data: { 
        id: 'product id 1',
        position: 2,
        cost: 19.95,
        quantity: 1,
        soldOut: false,
        category: {1: 'category-1', 5: 'category-5'},
        parameter: {1: 'parameter-1', 7: 'parameter-7'}
      }
    }"
  >
    product
  </div>
</template>

      Was this article helpful?
      What's Next