How to setup Banner campaigns

1. Define the banner slots in Custobar under Settings -> Advanced Settings -> Web tracking script. Then later on when you create your banner campaigns, you define where the banner goes by using these slots.

Slot : The name for the slot in Custobar, this is the one you then choose as the slot when activating the campaign

CSS Selector: This is the selector that you add to the site, so that Custobar knows where on the site to push the banner


2. Define in your web-site template, where the Custobar banner will be placed.

3. Create a banner template in Custobar (Settings/Content templates). One sample template can be found below. The sample below is a “hero” image style banner.

4. Create the banner campaign event in Custobar:

  • Set the campaign audience with the audience selector tool


In the activation tab, you have to define which slot the banner should be visible on in the “Banner slot” field. This is the name you defined in the “Slot” field under the Settings/Web tracking script. At the moment there is no validation for this field so make sure you type it correctly. You can find the names in this example on step 1.


In the activation tab, you can also define the start and end date of the banner campaign.


5. When you have the audience chosen and the slot where the banner will show up and you have decided on the length of the banner campaign then you can activate it from the green “ Activate campaign action ” at the bottom.

NOTE : This sample template is with the width 1056 and the templates can and has to be modified according to your sites settings. You can for example use the product modules from your Custobar to lift up product recommendations on your site too. Just remember that the templates has to be modified according to your layout.

Sample banner template

This sample banner template looks like this. It is a simple hero image sized slot to which you can simply drag the image that you want from Custobar:


And the code can be found here :

    <div class="cb-module-wrapper">
        {% if content %}
            {{ content|safe }}
        {% else %}
            <table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" width="1056" style="margin: auto;" class="email-container cb-module">
                    <td bgcolor="#ffffff">
                        <img src="/static/email-editor/placeholders/image-landscape.png" alt="" border="0" align="center" class="cb-module-image" style="width: 100%; background: #dddddd; font-family: helvetica; font-size: 15px; mso-height-rule:                             exactly; line-height: 20px; color: #555555;">
        {% endif %}    
    {{ editor_scripts|safe }}