Page tree
Skip to end of metadata
Go to start of metadata

Web item templates are used in tandem with item blocks to define a layout for promoted items or content and their related details in your Interaction Studio (formerly Evergage) web campaigns. Web item templates format the content displayed inside an item block - similar to how a photograph or piece of art (item template) is displayed inside a picture frame (item block).

When you use web item templates, you won't need to copy template HTML across your web campaigns. You can create more than one template and customize each one to match your existing brand guidelines. Each campaign you create in Interaction Studio has its own type of item template. That means that the template you use for web campaigns are different from those used for triggered or open-time email campaigns as well as web campaigns, simplifying the way you promote recipes in your web or email-based digital communications.

Interaction Studio Classic Only

Please note, the contents of this article are intended for customers using Interaction Studio (formerly Evergage Classic). Do not adjust your beacon version to downgrade or upgrade.

This Article Explains

This article details how to create a web item template, how to publish it for use in email campaigns, and provides some additional information related to item templates.

Sections in this Article

Before creating Item Templates be sure that you have products in your catalog and trained recipes to use in your campaigns.

Create an Item Template

  1. Log into Interaction Studio as an administrator
  2. In the Channels & Campaigns section, select Web > Web Item Templates
  4. Enter a template Name
  5. Select the Item Type to render inside the Item Template. You can define an Item Template for Category, Product, Brand, Class, Gender, Style, Badge, Size, Article, Author, Keyword, Content Class, and Blog
  6. Enter the template Dimensions in pixel Width and Height
  7. Define the HTML template by adding the HTML code to be applied to each item in your catalog. The sample Item Template below renders a product image above the product name with a suggestion to "Shop Now" at the bottom. This template uses the dimensions 260 x 375.

    <div style="padding: 10px; font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 20px;">
        <div style="width: 260px; height: 375px;">
            <img src="${item.imageUrl}" style="max-width: 100%; max-height: 100%;">
        <!-- allocate enough height for 3 lines of text -->
        <div style="margin-top: 15px; height: 70px;">${}</div>
        <div style="font-weight: bold;"><span style="text-decoration: underline;">Shop now</span> ></div>

    When designing the HTML template for your web item template, confirm that images of different dimensions and names of varying lengths render as intended

  8. Click Insert Dynamic + to add dynamic message content fields to the HTML code

Preview Template 

Preview is available instantly on the upper part of the right rail. Enter an item name or ID to preview the template pre-filled with the details for that item.

  1. Enter an item name or ID
  2. Press [Enter]
  3. The new item will render immediately so you can make style adjustments as needed 
  4. Click SAVE to save your template