Implement Target without a tag manager

Information about implementing Adobe Target without using a tag manager (Adobe Launch or Dynamic Tag Management).

Note: Adobe Launch is the preferred method for implementing Target and the at.js library. The following information is not applicable when using Adobe Launch to implement Target.

This section contains the following information:

at.js Configurations

Information to help you set several settings on the at.js Settings page.

Note: Adobe Launch is the preferred method for implementing Target and the at.js library. The following information is not applicable when using Adobe Launch to implement Target.
Note: You can override settings in the at.js library, rather than configuring the settings in the Target Standard/Premium UI or by using REST APIs. For more information, see targetGlobalSettings().

To open the Settings page:

  1. Click Setup > Implementation.

  2. Select at.js > Edit at.js Settings.

Content Delivery Settings

Please consult with Client Care before changing these settings. These settings are required for most implementations.

Setting Description
Autocreate global mbox

Select whether to embed the global mbox call in the at.js file to automatically fire on each page load.

Changing this setting affects both at.js and mbox.js.

Global mbox name

Select a name for the global mbox. By default, this name is target-global-mbox.

Special characters, including ampersands (&), can be used in mbox names with at.js.

Changing this setting affects both at.js and mbox.js.

Advanced Settings

Setting Description
Client Code

The client code is a client-specific sequence of characters often required when using the Target APIs.

This setting cannot be changed.

IMS Organization ID

This ID ties your implementation to your Adobe Experience Cloud account.

This setting cannot be changed.

Profile Lifetime

This setting determines how long visitor profiles are stored. By default, profiles are stored for two weeks. This can be increased up to 90 days.

To change the Profile Lifetime setting, contact Client Care.

X-Domain

Determines whether the browser sets cookies in your own domain (1st party cookies), Target's domain, or both.

Changing this setting affects both at.js and mbox.js.

Timeout

If Target does not respond with content within the defined period, the server call times out and default content is displayed. Additional calls continue to be attempted during the visitor's session. The default is 5 seconds.

Changing this setting affects both at.js and mbox.js.

The at.js library uses the timeout setting in XMLHttpRequest. The timeout starts when the request is fired and stops when Target gets a response from the server. For more information, see XMLHttpRequest.timeout on the Mozilla Developer Network.

If the specified timeout occurs before receiving the response, default content is shown and the visitor might be counted as a participant in an activity because all data collection happens on the Target edge. If the request reaches the Target edge, the visitor is counted.

Consider the following when configuring the timeout setting:

  • If the value is too low, users might see default content most of the time, although the visitor could be counted as a participant in the activity.

  • If the value is too high, visitors might see blank regions on your web page or blank pages if you use body hiding for extended periods of time.

To get a better understanding of mbox response times, look at the Network tab in your browser's Developer Tools. You can also use third-party web performance monitoring tools, such as Catchpoint.

Note: The visitorApiTimeout setting ensures that Target doesn't wait for the Visitor API response for too long. This setting and the Timeout setting for at.js described here do not affect each other.
Legacy Browser Support
Note: The Legacy Browser Support option is available in at.js version 0.9.3 and earlier. This option was removed in at.js version 0.9.4. For a list of browsers supported by at.js, see Supported browsers.

Legacy browsers are older browsers that do not fully support CORS (Cross Origin Resource Sharing). These browsers include: Internet Explorer browsers earlier than version 11 and Safari versions 6 and below. If Legacy Browser Support is disabled, Target does not deliver content or count visitors in reports on these browsers. If this option is enabled, it is recommended to do quality assurance across older browsers to ensure a good customer experience.

Code Settings

Setting Description
Library Header

Add any custom JavaScript to include at the top of the library.

Library Footer

Add any custom JavaScript to include at the bottom of the library.

Download at.js

Instructions to download the at.js library using the Target interface or the Download API.

Note: Adobe Launch is the preferred method for implementing Target and the at.js library. The following information is not applicable when using Adobe Launch to implement Target.
Important: The Target team maintains only two versions of at.js—the current version and the second-latest version. Please upgrade at.js as necessary to ensure that you are running a supported version. For more information about what's in each version, see at.js version details.

Download at.js Using the Target Interface

To download at.js from the Target interface:

  1. Click Setup > Implementation.

  2. Select at.js.

  3. Click Download at.js.

Download at.js Using the Target Download API

To download at.js using the API.

  1. Get your client code.

    Your client code is available at the top of the Setup > Implementation > Edit at.js Settings page of the Target interface.

  2. Get your admin number.

    Load this URL:

    https://admin.testandtarget.omniture.com/rest/v1/endpoint/<client code>

    Replace <client code> with the client code from Step 1.

    The result of loading this URL should look similar to the following example:

    {
      "api": "https://admin6.testandtarget.omniture.com/admin/rest/v1"
    }

    In this example, "6" is the admin number.

  3. Download at.js.

    Load this URL with the following structure:

    https://admin<admin number>.testandtarget.omniture.com/admin/rest/v1/libraries/atjs/download?client=<client code>&version=<version number>
    • Replace <admin number> with your admin number.

    • Replace <client code> with the client code from Step 1.

    • Replace <version number> with the desired at.js version number (for example, 1.6.2).

      Important: The Target team maintains only two versions of at.js—the current version and the second-latest version. Please upgrade at.js as necessary to ensure that you are running a supported version. For more information about what's in each version, see at.js version details.

    Loading this URL starts the download of your customized at.js file.

at.js Implementation

at.js should be implemented in the <head> element of every page of your website.

A typical implementation of Target not using a tag manager like Adobe Launch or Dynamic Tag Management looks like this:

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>Title of the Page</title>
    <!--Preconnect and DNS-Prefetch to improve page load time-->
    <link rel="preconnect" href="//<client code>.tt.omtrdc.net">
    <link rel="dns-prefetch" href="//<client code>.tt.omtrdc.net">
    <!--/Preconnect and DNS-Prefetch-->
    <!--Data Layer to enable rich data collection and targeting-->
    <script>
        var digitalData = {
            "page": {
                "pageInfo": {
                    "pageName": "Home"
                }
            }
        };
    </script>
    <!--/Data Layer-->
    <!-- targetPageParams(), targetPageParamsAll(), Data Providers or targetGlobalSettings() functions to enrich the visitor profile or modify the library settings-->
    <script>
        targetPageParams = function() {
            return {
                "a": 1,
                "b": 2,
                "pageName": digitalData.page.pageInfo.pageName,
                "profile": {
                    "age": 26,
                    "country": {
                        "city": "San Francisco"
                    }
                }
            };
        };
    </script>
    <!--/targetPageParams()-->

    <!--jQuery or other helper libraries should be implemented before at.js if you would like to use their methods in Target-->
    <script src="jquery-3.3.1.min.js"></script>
    <!--/jQuery-->
    <!--Target's JavaScript SDK, at.js-->
    <script src="at.js"></script>
    <!--/at.js-->
</head>

<body>
    The default content of the page
</body>

</html>

Consider the following important notes:

  • The HTML5 Doctype (e.g., <!doctype html>) should be used. Unsupported or older doctypes could result in Target not being able to make a request.

  • Preconnect and Prefetch are options that might help your web pages load faster. If you use these configurations, ensure that you replace <client code> with your own client code, which you can obtain from the Setup > Implementation > Edit at.js Settings page.

  • If you have a data layer, it is optimal to define as much of it as possible in the <head> of your pages before at.js loads. This placement provides the maximum ability to leverage this information in Target for personalization.

  • Special Target functions, such as targetPageParams(), targetPageParamsAll(), Data Providers, and targetGlobalSettings() should be defined after your data layer and before at.js loads. Alternatively, these could be saved in the Library Header section of the Edit at.js Settings page and saved as part of the at.js library itself. For more information on these functions, seeat.js functions.

  • If you use JavaScript helper libraries, such as jQuery, include them before Target so you can leverage their syntax and methods when building Target experiences.

  • Include at.js in the <head> of your pages.

Track Conversions

The Order Confirmation mbox records details about orders on your site and allows reporting based on revenue and orders. The Order Confirmation mbox can also drive recommendation algorithms, such as "People who bought product x also bought product y."

Note: If users make purchases on your website, we recommend implementing an Order Confirmation mbox even if you use Analytics for Target (A4T) for your reporting.
  1. In your order details page, insert the mbox script following the model below.
  2. Replace the WORDS IN CAPITAL LETTERS with either dynamic or static values from your catalog.
    Note: Use comma delimiting to separate multiple product IDs.

    Tip: You can also pass order information in any mbox (it does not need to be named orderConfirmPage). You can also pass order information in multiple mboxes within the same campaign.

    <script type="text/javascript">
    adobe.target.trackEvent({
        "mbox": "orderConfirmPage",
        "params":{ 
            "orderId": "ORDER ID FROM YOUR ORDER PAGE", 
            "orderTotal": "ORDER TOTAL FROM YOUR ORDER PAGE", 
            "productPurchasedId": "PRODUCT ID FROM YOUR ORDER PAGE, PRODUCT ID2, PRODUCT ID3" 
        }
    });
    </script> 

The Order Confirmation mbox uses the following parameters:

Parameter Description

orderId

Unique value to identify an order for conversion counting.

The orderId must be unique. Duplicate orders are ignored in reports.

orderTotal

Monetary value of the purchase.

Do not pass the currency symbol. Use a decimal point (not a comma) to indicate decimal values.

productPurchasedId (Optional)

Comma-separated list of product IDs purchased in the order.

These product IDs display in the audit report to support additional reporting analysis.