[2.4] Feature Request: Separate Mobile Category Logo and Mobile Category Banner Images
Is your feature request related to a problem? Please describe.
Yes.
Currently, Bagisto allows only one Logo image and one Category Banner image. The same image is used for both desktop and mobile devices.
This creates several issues:
- Desktop banner images are often cropped on mobile because of different aspect ratios.
- Important promotional text or product images become hidden on smaller screens.
- Merchants have to compromise by creating a single image that doesn't look optimal on either desktop or mobile.
- Store logos designed for desktop navigation often appear too small or unclear on mobile headers.
Many modern eCommerce platforms allow separate assets for desktop and mobile to provide a better user experience. This is especially important for mobile-first stores where most traffic comes from smartphones.
Describe the solution you'd like
I would like Bagisto to support separate mobile-specific images.
Store Branding
Add an optional field:
- Mobile Logo
Behavior:
- Desktop → Use Logo
- Mobile → Use Mobile Logo (if uploaded)
- Fallback → Use Desktop Logo
Category
Add an optional field:
- Mobile Banner Image
Behavior:
- Desktop → Use Banner Image
- Mobile → Use Mobile Banner Image (if uploaded)
- Fallback → Use Desktop Banner Image
This implementation would be fully backward compatible because existing stores would continue using the current images unless mobile-specific images are uploaded.
This feature would significantly improve responsive design, allow merchants to optimize images for different screen sizes, and eliminate the need for custom theme modifications or CSS workarounds.
Describe alternatives you've considered
Currently, the only alternatives are:
- Creating a single banner image that tries to work for both desktop and mobile, which often results in poor composition and cropped content.
- Using CSS media queries to hide or replace images, which requires custom theme development and is not manageable from the admin panel.
- Maintaining separate custom theme overrides, making future Bagisto upgrades more difficult.
- Using image-safe zones, which limits design creativity and still doesn't provide an optimal experience on all screen sizes.
None of these approaches are ideal because they require additional development effort for a feature that could be managed directly from the Bagisto admin panel.
Additional context
This feature would be particularly useful for stores that rely heavily on promotional banners, such as fashion, electronics, grocery, bakery, and gift stores.
Example:
Category: Birthday Cakes
Desktop Banner:
- 1920 × 700 (landscape)
Mobile Banner:
- 1080 × 1350 (portrait)
Using dedicated images for each device ensures better visual presentation, improved readability, and higher engagement.
Similarly, a dedicated Mobile Logo allows merchants to use a simplified or stacked logo that fits mobile headers without compromising branding.
The feature can be implemented in a fully backward-compatible way by making both "Mobile Logo" and "Mobile Banner Image" optional. If no mobile-specific image is uploaded, Bagisto can automatically fall back to the existing desktop image.
Source: bagisto/bagisto