The Product Image Banner allows you to display custom promotional images or GIFs directly on the Product Detail Pages (PDPs) of your mobile app.
With image banners, you can:
Highlight discounts, free shipping, special offers, product information, campaigns, or other important messages you want customers to notice while browsing your products.
Add multiple banners to a product page.
Choose where each banner appears on the product page.
Use conditions to control which products or customers see each banner.
Letās walk through the quick steps to add the product image banner to your product detail page.
How the Product Image Banner will look
Please take a look at the example below to see how your Product Image Banner will appear to your users.
How to add a product image banner
Follow the steps below to add and configure a product image banner on your product detail pages.
1- Navigate to the product page section
Go to your Shopney dashboard and navigate to Customization (1). Scroll down and look for Enable Product Image Banner (2).
2- Enable the product image banner
Enable the feature using the toggle (1). Then, click Configure (2) to start creating and managing your banners.
3- Choose which products or customers will see the banner
After clicking Configure, click Add New to create a Product Image Banner.
Under Display Conditions, you can set conditions that determine when your banner will appear.
You can configure your conditions to match:
No conditions - Banner will be visible in all products
All conditions - Display the banner only when all specified conditions are met.
Any conditions- Display the banner when at least one of the specified conditions is met.
Product conditions can be based on criteria such as product tag, product type, vendor, or metafield. Furthermore, customer conditions can be based on criteria such as customer tag, customer metafield and authentication status.
You can also use the available targeting conditions to control whether the banner is displayed to specific customers.
If you need more than one rule, click Add another condition to add additional conditions.
š” Tip
Use conditions to make your banners more relevant. For example, you can display a promotional banner only on products from a specific vendor or products with a specific product tag, such as āsummer-saleā. |
4- Upload your banner
Under Banner Customization, you can upload the image or GIF you want to display.
Click Upload Banner Image, select the image to upload.
You can check the Preview on the right side of the screen to see how the banner will appear in your app.
š Important Note
The supported file formats are PNG, JPEG, and GIF, with a maximum file size of 5 MB.
5- Choose the banner position
Once you've uploaded your banner, you can choose where it will appear on your product detail page. Use Move Up and Move Down to adjust the banner's position
The banner can be positioned around key Product Detail Page sections, including:
Product image
Product name
Variant selector
Quantity selector
Description
Recommended Products
Recently viewed products
Depending on the position you select, your banner can appear above or below these sections.
š Important Note
Due to the Mergen Themeās design structure, banner placement can only start below the product name. Placements around the product image are not available.
š” Tip
Use the mobile preview while adjusting the position to make sure your banner appears exactly where you want customers to see it. |
6- Add more banners if needed
You can add multiple Image Banners to the same Product Detail Page
Each banner can have its own:
Image or GIF
Visibility conditions
Position
This allows you to display different messages for different products or customers within your app.
š Important Note
If multiple banners are placed in the same area, they will not overlap. Instead, they will appear one below another in the order they are arranged.
š” Tip
You can combine multiple banners with different conditions to create more targeted experiences. For example, one banner could promote free shipping while another highlights a product-specific offer. However, avoid adding too many banners, as this can make your product detail page look crowded. |
7- Save your changes
Once you've finished configuring your banner, click Done.
Click Save and Update at the top of your dashboard and your banner will appear on the matching Product Detail Pages in your mobile app based on the conditions and position you've selected.
That's it! Now you know how to add and customize Image Banners on your product detail pages.
You can use Image Banners to highlight promotions, communicate free shipping, share product-specific information, and create a more engaging shopping experience directly within your mobile app.
Need Help?
If you encounter any issues while designing your app, our support team is here to assist you:
Contact our support team via live chat in your Shopney dashboard.
Visit our Help Center.