Skip to end of metadata
Go to start of metadata

Set up Placements with AST

This page contains a sample web page showing how Xandr's seller tag  (AST) functions can be implemented in the header and body of a sample client page.

See AST API Reference for more details on using the functions in this example.

On This Page

Step 1: Create the APN Object and Load the Xandr JavaScript Library

In line 5, we set up an empty AST object. In line 7, we create a function queue on that object which allows us to push functions into that queue with the information about the tags and be able to request bids from the Xandr ad server. In lines 10–15, we asynchronously load the client-side auction library from the Xandr CDN. If the script exists, we process it; otherwise, it is put in the queue.

This code can be pasted directly into your web page; no additional developer changes are required. You may separate the code into the head and body as shown below or, if you do not have access to the page head, you may put the entire tag in one code block in the body.

Deploying the AST tag into an external Javascript file or other customizations to the deployment of this code could result in unintended outcomes or loss of functionality, and will require customer action to test and utilize features in future AST releases. Xandr may not be able to troubleshoot or support in this instance.

Step 2: Set Global Page Options

Now we set the global page options with the setPageOpts function. Here, we set the member ID to 958 and define the page-wide targeting parameters (member is required in either setPageOpts or defineTag (below). This example uses age and gender. 

Step 3: Define Ad Tags

Next, we define all the ad placements we want on this page using the defineTag function. Here, we specify the following for each placement:

  • member: can override the global page option with member ID for this placement (optional; must be present if not specified in setPageOpts)
  • invCode: the placement code for this placement. (invCode OR tagId required)
  • tagId: the placement id for this placement (invCode OR tagId required)

  • sizes: if you are using multiple sizes, the first item in the list is the placement size and other sizes are promo sizes.
  • targetId: Any unique string; this must correspond to a unique div ID in the body of the page.
  • Other options available; see the AST API Reference.

Step 4: Load Tags

As soon as all the tags are defined, call the loadTags function. This function sends out ad requests for the tags in one ad call asynchronously.

Step 5: Define Location of Placements

In the body of the page, specify the location of each placement using div tags that correspond to the targetId elements from each of your defineTag calls. Use the showTag function to indicate that the placement is ready to receive an ad. Once this function is called, the impression will be marked as transacted and will be considered an "impression" for accounting purposes.

AST manages all the DOM elements inside the ad placeholder div tag programmatically. Since these elements may change, do not directly access any of the elements; use only the built-in AST functions, such as refresh. Accessing these elements directly may result in unexpected behavior, such as ads appearing in the wrong location on the page, duplicate ads, or blanks.

Related Topics