How Do I Adjust The Banner Block for Mobile Users?

How to Upload Mobile Images to a Banner Block in PhotoBiz

Overview

The Banner Block lets you create image-based sections on your website with optional text and buttons. Because phones and desktop screens use different shapes and sizes, the same banner image may not display the same way on every device.

PhotoBiz allows you to upload mobile-specific images for Banner Blocks. This ensures your banners look great on phones, especially when using vertical images or layouts that may crop differently across screen sizes.

In this guide, you will learn how to upload mobile images and control how your banners display on mobile devices.

STEP ONE

Log into your PhotoBiz account and click WEBSITE in the left-side menu.

This opens your Website Builder.

STEP TWO

Click the page that contains the Banner Block you want to update.

STEP THREE

Click the Banner Block to open its settings.

Locate the MOBILE IMAGES section. This is where you upload images that will display specifically for visitors viewing your website on a phone.

You can upload images from your computer, insert images from the Clipboard, or select images from the Stock Image Library.

Mobile users typically view websites in a vertical (portrait) orientation. For best results, use images that are 1080 x 1920 pixels or a similar 9:16 aspect ratio.

After uploading, thumbnails will appear in the Mobile Images section. These images will automatically display on mobile devices instead of the desktop banner images.

STEP FIVE (Optional)

Click on any mobile image thumbnail to customize its content.

You can add:

Title
Subtitle
Alt Text
Link to another page
Button text and link

You can also adjust:

Text alignment (left, center, right)
Vertical positioning (top, center, bottom)
Image alignment (left, center, right)

STEP SIX

Open the Banner Block layout settings and choose the layout you want to use.

Each banner type includes mobile size options:

Classic: Full Screen, Medium, Short, Thin
Carousel: Full Screen, Medium, Short, Thin
No Crop: Full Screen, Medium, Short, Thin
Modern Carousel: Full Screen, Medium, Short, Thin

Choose the layout that works best for your images, then click Save Changes.

FINAL STEP

View your website on a mobile device or use the mobile preview in your control panel to confirm your banner displays correctly.

Your mobile images will now appear for phone visitors, while your desktop images will continue to display on larger screens.

Additional Options and Helpful Notes

Mobile images are especially helpful when your desktop banner images are wide or horizontal. A separate mobile image gives you more control over how your content appears on smaller screens.

If you add multiple images to the Mobile Images section, they will display as a slideshow on mobile devices.

For best results:

Use vertical images for mobile banners
Keep important subjects near the center to prevent cropping
Avoid placing important text inside the image
Use the Banner Block title and caption fields for text instead
Preview your site on both desktop and mobile after saving

Important:

The Images section (desktop) and Mobile Images section are completely separate.

Desktop slideshow = images in the Images section
Mobile slideshow = images in the Mobile Images section

If mobile images are added, they will override the desktop images on phones. This is the most common reason banners appear different between desktop and mobile.

The control panel preview shows desktop images by default. If you do not switch to mobile preview, you may not see your Mobile Images.

Layout selection also affects how your images display:

Classic layouts may crop images to fill the space
No Crop layouts display the full image with spacing as needed
Carousel layouts work well with mixed image sizes

The Save Changes button automatically applies updates to your website. There is no separate publish button.

Previous Post Next Post

How To Link Banners

May 27, 2025

How To Use Banner Blocks

May 21, 2025

How To Add Text To Banners

May 27, 2025

How To Change The Fonts On Banners

December 9, 2025