Resource Center

Adobe Launch Guide

Ascend Adobe Launch Extension User Guide

 

Overview

This document provides a step-by-step guide for implementing Pepperjam’s pixels to your Adobe Launch instance.

Installing the Pepperjam Launch Extension

Step 1 - Launch Catalog

  • Navigate to your Adobe Launch instance and select your property.
  • Navigate within Launch to the Extensions tab and into the Catalog tab.
  • Search for Pepperjam and click Install.

Step 2 - Configuration

  • Enter your Container Tag ID and your Program ID
    • You will have the option to enter a static ID (great for single domain sites) or to enter in a data element (great for when you want to dynamically populate values)
    • The Container Tag ID can be found in Ascend™ on the Merchant Integrations page under the Container Tag tab. It is labeled as the Pepperjam Impression – Id.
    • Your Ascend™ Program ID, or PID, is in the header of every page in Ascend.
  • If you have configured a Custom Tracking Domain in Ascend™, toggle the Enable Custom Tracking Domain option. This will reveal a field into which you can enter your Custom Tracking Domain.

    • Only enter the hostname of your domain ( subdomain.domain.com ). Do not include the protocol ( https:// ).

    • Custom Tracking Domains are not available until you request one. They must be provisioned in Ascend™.

    • For more information on the Custom Tracking Domain provisioning process, please visit the Custom Tracking Domain Integration Guide in the Ascend™ Advertiser Knowledge Center.

 

Pepperjam Container Tag

Our container tag can be installed through Adobe Launch. Our container tag ensures persistent affiliate tracking amidst evolving browser changes, including ITP, and enables Ascend™ brands to easily leverage many of our integrated partnerships. Instructions on implementation and testing are below.

Step 1 - Edit or Create an All Pages Rule

If your Launch property already has a rule that is triggered on page load, it's usually best to use that one instead of creating a new one. If this is the case, please proceed to Step 2.

If your Launch property does not already have a rule that is triggered on page load:

  • In your Launch property, navigate to the Rules tab.
  • Click the Add Rule button.
  • In the Edit Rule screen, give it a name (e.g. All Pages | Page Load | Pepperjam Container).
  • Under Events, click + Add.
    • Select Core from the Extension dropdown.
    • Select an appropriate Page Load event (e.g. DOM Ready) from the Event Type dropdown.

Step 2 - Add Set Container Tag Action

  • Click + Add in the Actions section of the Rule.
  • Set the Action configurations.
    • Select Pepperjam from the Extension dropdown.
    • Select Set Container Tag from the Action Type dropdown.
  • Save & Build the container. At that time, your screen should look like this:

Step 3 - Test Container Tag

  • In a new tab in your browser, navigate to the site your Adobe Launch property is installed on.
  • Open the developer console.
    • Use the shortcut Option + ⌘ + J (on macOS), or Shift + CTRL + J (on Windows/Linux). The console will either open up within your existing Chrome window, or in a new window. You may have to select the Network tab.
  • Refresh the page and confirm the Pepperjam JavaScript file is loaded on the page.
    • If you have configured a Custom Tracking Domain, filter for your custom domain instead of pepperjam .

Pepperjam Conversion Tag

Step 1 - Edit (or Create) the Purchase Rule

If your Launch property already has a rule that is triggered on purchase, it's probably best to use that one instead of creating a new one. If this is the case, please proceed to Step 2.

If your Launch property does not already have a rule that is triggered on purchase:

  • In your Launch property, navigate to the Rules tab and create a new one.
  • Give it a name.
  • The event here should be triggered only when purchase information is available.

More about Purchase Rules

These are rules that fire whenever a purchase page is present. In a traditional multi-page web application, this can be a static order confirmation or ‘thank you’ page. In the case of a single page application (SPA), this can be a data layer puh, custom DOM event, or a history change.

  • If your Launch property doesn't already have a rule that is triggered on purchase and you're not sure what constitutes a purchase event on your site, reach out to one of your site's developers to help you determine what should trigger the purchase rule.

If you choose an event type that is not unique to the purchase page (e.g. Library Loaded (Page Top), Window Loaded, DOM Ready, etc.), you can use conditions to make sure that this rule only fires on a purchase page.

For example, you can use the Path Without Query String condition and specify what that path is. In the example below, we assume the path is either orders or thank-you.

Step 2 - Add Ecommerce Action

Set Ecommerce Action implements Pepperjam’s dynamic pixel on your confirmation page. The pixel captures details associated with each affiliate transaction like order ID and amount. No personally identifiable information (PII) may be passed through the pixel. PII includes but is not limited to: name, social security number, email address, phone number, physical address.

To add the dynamic pixel, follow these steps:

  • Click the + sign on the actions section of the Rule.
  • Set the action configurations.
  • Extension = Pepperjam Extension
  • Action Type = Set Ecommerce Action

Configure the Ecommerce Action

  • The Ecommerce action requires four variables: order ID, item ID, item price, and item quantity. These are usually set with data elements as to be dynamic, but can also be hardcoded. For more information on how to set these values, please see Using Data Elements in the Appendix.
  • For more information regarding the conversion information for Ascend, please click here.

Step 3 - Save Pepperjam Conversion Tag

Once you have entered your variables, click the save button and build button.

Step 4 - Test Conversion Tag

  • In a new tab in your browser, navigate to the site your Adobe Launch property is installed on.
  • Open the developer console.
    • Use the shortcut Option + ⌘ + J (on macOS), or Shift + CTRL + J (on Windows/Linux). The console will either open up within your existing Chrome window, or in a new window. You may have to select the Network tab.
  • Refresh the page and confirm the Ascend conversion pixel is loaded on the page and that the values being passed are correct.
    • If you have configured a Custom Tracking Domain, filter for your custom domain instead of pepperjam .

Appendix

Ecommerce Action Variables

This is a table of the variables available in the Set Ecommerce Action. For more information regarding the conversion information for Ascend, please click here.

Screenshot 2023-10-04 at 18.34.09.pngScreenshot 2023-10-04 at 18.34.19.png

 

Using Data Elements

As is the case with most Launch extensions, each of the variables used in the Pepperjam extension can be hardcoded to populate the same value for every transaction. However, it's more likely that the values you want to pass are actually dynamic—i.e. they are different for every transaction. To populate dynamic values in Launch, we can use Data Elements. Data Elements allow us to map data in a data layer or elsewhere on a page to a single "placeholder" value that we can easily add to our Actions. When the action is executed, each data element will be evaluated, and will return the value to which it is mapped. If we ever decide to change what the placeholder maps to, we can make the change in one place instead of having to update multiple rules.

Below are two examples of how we can use data elements to populate dynamic values:

Mapping to values in a data layer

This is considered best practice for populating values used in a tag manager. A data layer is a JavaScript object that lives in the global scope of a web page specifically to facilitate data collection. Common variable names for data layers are digitalData , appEventData , adobeDataLayer , etc.

  • If your site has an object specifically named dataLayer , this likely means it's using the Google gtag data layer. If this is the case, you may still be able to pull values from it, but it's generally not recommended for use with Adobe Launch.
  • If you're unsure of whether your site has a data layer or what the name of the data layer variable is, please reach out to one of your site's developers.

Configuring the data element

Depending on your data layer implementation, there are different ways to configure data elements in Launch.

  • If you're using digitalData , you can use the JavaScript Variable type from the Core extension:

  • If you're using the Data Layer Manager extension, you can use the Context Aware type:

  • If you're using the Adobe Client Data Layer extension, you can use the Data Layer Computed State type:

Mapping to values in the DOM

If your site doesn't have a data layer, you may need to "scrape the DOM" to get data. This involves querying elements in a tree-structured parsed representation of the page (known as the Document Object Model, or DOM). This is generally not best practice and should only be used as a last resort.

Code

Validating the Pepperjam tagging configuration

  • In a new tab in your browser, navigate to the site your Adobe Launch property is installed on.
  • Open the developer console.
    • Use the shortcut Option + ⌘ + J (on macOS), or Shift + CTRL + J (on Windows/Linux). The console will either open up within your existing Chrome window, or in a new window. You may have to select the Network tab.
  • Refresh the page and confirm the Ascend conversion pixel is loaded on the page and that the values being passed are correct.
    • If you have configured a Custom Tracking Domain, filter for your custom domain instead of pepperjam.