The Promo Banner is a horizontally scrolling element always on the top of your Home Screen.
For the Vertical Mode, it will scroll out of screen when user scrolls up.
For the Horizontal Mode, it will always remain in place.
STEP 1:
Go to Design > Banners and look for “Home Page Slideshow“.
Make sure it’s status “Enabled”. Click on the blue Edit icon on the right.
STEP 2:
When in the Edit screen, you should see at least one Banner being setup for you.
If there are none, click the blue + button (bottom right corner).
Add a Banner image and a Title. Titles do not appear anywhere in the app. Jump here to learn how about Banner Images sizes.
Set the Left to Right Sort Order (smaller number is Left).
There are 3 behaviors you can set up
1. Launch a Product Category
To set the banner to launch a Product Category, cut and paste this code into the “Link” box. Replace the blue-text with the category name that you want to link to. This must be the same name that is set up in your Catalog > Categories.
pbai://?category=category_nameNote: if you have setup a Category page, then it will launch that Page. If the Category does not have a “page”, then it will launch the next screen, which will be typically the list of Products in that Category.
2. Launch a Product SKU
To launch any particular product (like a 4×6 Print in this example) copy and paste the code below and change the blue-text to the SKU code that is listed for that product. This SKU is the one in your spreadsheet that corresponds to the product SKU provided by your PSP.
pbai://?sku=6x4-2a. Embedding a promo price
There is an option to automatically apply a discount for this SKU by adding the code below:
pbai://?sku=6x4&price=0.04@promoCode=10OFF
Note that the “promoCode” must be the same label that you have created in the Marketing > Coupon section. (learn how to create promo codes here)
3. Launch an external webpage
You can also launch an external website by simply typing in the http address (URL) of the target webpage. Note that this will launch an embedded browser and load the page accordingly. This is useful for additional promotional details, customer support information, special announcements etc.
Warning: We do NOT recommend launching a webstore, as users will have to upload every single image before editing, and also transact and pay “outside” of the app, although they may think that they are transacting within the app. Orders they make through your webstore will not show up in the Order History of the app. This has shown to create confusion and customer service problems.
Preparing Promo Banners
VERTICAL MODE
In the Vertical Mode, Banners are fixed to an aspect ratio of 5:2; so given most phone screen sizes are around 1080px in width, that means you should prepare an image that is 1080 x 432px.
HOWEVER, if you should expect to ever need to change your home screen layout to the Horizontal Mode in future, then you should cater for a taller image. (read on)
HORIZONTAL MODE
The top 25% of available screen height is for Promotional Banners, and the remainder 75% is split into 2 equal rows for the Categories. The promo banner will be slightly taller than 2.5:1 as you can see in the side-by-side comparison above.
To ensure your banner works in all cases and phones, prepare them as below:
1080 x 500px with a 40px vertical safety margin
