Our HTML5 library comes with a set of functions for receiving products from a product catalog.

To make use of our product functions you must specify "$productFeed", "$products" and optional "$numberOfProducts" as variables in your manifest.json file:

"variables": {
  "$productFeed": 6,
  "$products": "{{products}}",
  "$numberOfProducts": 4
}

In the example above the {{products}} macro will be populated with an array of max four product objects from product feed with ID 6.

product

ParameterTypeRequiredDescription
idstringYesA unique identifier of a specific item. Preferably the SKU of a product
processedAtlongYesUnix Timestamp when this item was processed in milliseconds
titlestringNoThe title of the item
descriptionstringNoA description of the item
linkstringNoA URL linking to the item's page on the website
imageLinkstringNoA URL to an image of the item
condition"new","used" or "refurbished"NoThe condition of the item
availability"in stock" or "out of stock"NoThe availability of the item
pricestringNoThe price of the item
extrasstringNoAdditional data wrapper

Example

The following example creates a <div> element and sets its text content to the first product's title.

<script type="text/javascript">
  html5.ready(function() {

    var firstProductTitle = html5.products.all()[0].title;
    document.getElementById("product").innerHTML = firstProductTitle;
  });
</script>
<p>First product: <span id="product">...</span></p>

Testing

To test certain products simply set the product IDs yourself in your manifest.json file. Don't forget to remove the $productIds variable before submitting the ad to our system.

"variables": {
  "$productFeed": 6,
  "$products": "{{products}}",
  "$numberOfProducts": 2,
  "$productIds": ['r2d2','stormtrooper']
}

Please read our JavaScript Reference for information about available product functions.

ClickTAG definition

When fetching item(s) from the feed and wishing to use imageLink as ClickTAG, it can be define as the example below:

window.open(itemLink,"_blank")

As the URL is already existing in the feed you will not have to use any of the functions html5.getClickTag() or html5.createClickTag().