Skip to main content
How to create a banner?
Written by Martyna Woźniszczuk
Updated over a week ago

To create a banner go to the Recommendations tab in the menu on the left, then click Add banner. The banner editor will open. The process of creating a banner consists of four steps.

Step 1: Select the placement for the recommendation widget, i.e. where to display the banner?

In the Select the placement for the recommendation widget tab select the place on the page where you want to place the banner.

Etap 2: Widget settings, i.e. who should be displayed the banner?

In the Widget settings tab select the target group i.e. define which users are to see the banner.

If you want to display the banner to all users of your shop, click Add new group and then select all.

If you want to display a banner to a specific group of users, use other predefined groups or create a group based on e.g. a visit to a website with a given phrase in the URL.

Regarding the latter, in the article How to create a banner for users visiting a given category you will find detailed instructions.

In this article a birthday target group was chosen.

The banner will be displayed only to those users who are in the given group. After creating the target group, go to Advanced settings (under the list of groups) to define the capping (limiting the number of banner views to a given user at a given time) and the banner display schedule.

Step 3: Widget creator, i.e. what should the banner look like?

Go to General settings in the column on the left, then give your banner a name.

Then edit the image by clicking the Photo field in the column on the left.

If you want to add a new picture field, click Add element and Add image.

To select a photo/image that is already loaded on your account (e.g. if you have uploaded photos to other creations), click on the photo field in the Image url section and select the appropriate file from your media library.

You can also upload a new picture from your computer. In the Upload tab, you can add images in two ways:

Setting the CTA

Go back to the main Image section and expand the CTA button tab.

Set CTA enabled to Yes and enter the address of the page (including http://) to which the user should be directed after clicking on the banner.

Adding text boxes and colour fields

In addition to images, you can also add rectangles and text boxes to the banner. The settings section for these items will appear when you click on them.

Position and size of the banner

In the Position tab, you can adjust the size of the banner by setting its exact width and height, and the distance from the left and top. You can also stretch the banner directly in the field where it is visible.

Remember! The banner you create in our customer's panel is not responsive, i.e. its size will not scale when you open it on a mobile device. If you want to add a banner in the mobile version, you need to create a new one with the correct size.

Step 4: Summary

In the Summary tab, check whether all the settings are correct – if so, click Save. Remember that the banner is not in live mode yet.

Activating the banner, i.e. what to do to make it live?

In the Recommendations tab, find your banner in the list at the bottom of the page and activate it by clicking on the circle next to its name.

Placing a banner on the website

In the Recommendations Widgets tab, you can see the website structure, which defines the places of recommendation frames and banners.

HomePage means the place (subpage) on the website, Top means the position on a given subpage and the list shows widgets and banners assigned to a given subpage.

From the selected place on the website, click Get snippet.

Insert the displayed <div> code on your shop's website where you want to display the banner.

You can display multiple banners in one place on the shop's page. In this case, they will be displayed alternately.

Did this answer your question?