Configuring Banner Images
The banner images are large, prominent visuals displayed on your website or app to attract attention. They are commonly used for:
🔹 Marketing & Promotions — showcase offers, discounts, or new launches
🔹 Branding — display your brand’s vibe with logos, slogans, or themed visuals
🔹 Navigation — guide users to specific sections via sliders or clickable banners
Common Traits of Banner Images
Wide and horizontal format
Can include text overlays (e.g., “50% OFF”, “Order Now”)
Used on homepages, category headers, sliders, carousels, or in email campaigns
How to Configure Banner Images in Atlas
Upload Image
Go to Atlas → Meraki → Gallery.
Click Upload Image.
Assign for Web or App
After uploading, click Settings for the image.
In the Image Type dropdown:
Select Web Banner or Mobile Web Banner for website banners.
Select App Banner for app banners.
Location Group Assignment (Optional)
In Image Settings → Location Group, select a location group to display banners only for those outlets.
If no location group is selected → the banner will appear for all locations by default.
Add a Clickable Link (Markup)
In Markup field, you can add HTML to hyperlink the banner image to a specific URL.
Example:
<div style="display:inline-block; width:100%; padding:19px 105px 58px;"> <a href="YOUR-WEBSITE-URL" style="left:1%; position:absolute; top:1%; width:1000px; height:200px; padding-right:10px; padding-left:10px;"> </a> </div>
📌 Note:
Works only for Web.
For App banners, hyperlink requests must be submitted to the UrbanPiper Support Team.
No need to publish the menu/site after adding/editing banners.
Allow ~5 minutes for updates to reflect.
Recommended Aspect Ratios
Web Banners → 1.6:1 to 1.8:1
Mobile Banners → 2:2
Last updated
Was this helpful?