How to Customize Mobile View Settings on Your Zibster Website
Overview
Your Zibster website is fully mobile responsive, so your pages automatically adjust for desktop, tablet, and mobile screens. For blocks that use supported grid-based layouts, you can also control whether the content displays in one vertical column or two vertical columns on phones.
The MOBILE VIEW setting is available for supported grid-based layouts in the Images Block, List Block, Blog Block, Products Block, Services Block, Scheduler Block, and Mood Boards Block. You can set a global Mobile View preference for your website or override that setting on an individual supported block.
This guide walks you through both options and explains how Banner Blocks handle mobile images separately.
What Does Mobile View Control?
The MOBILE VIEW setting controls how supported grid-based layouts display on phones.
You can choose between:
- One vertical column
- Two vertical columns
Mobile View settings are available for supported grid layouts in the:
- Images Block
- List Block
- Blog Block
- Products Block
- Services Block
- Scheduler Block
- Mood Boards Block
Your global Mobile View setting establishes the default for supported grid-based blocks across your website. If you customize Mobile View on an individual block, that block uses its own setting instead of the global setting.
Need to Upload Custom Banners for Mobile?
Banner Blocks handle mobile display differently from grid-based blocks.
If your banner image is cropping awkwardly on phones, you can upload a separate mobile image for that Banner Block. This gives you more control over image cropping and composition on smaller screens.
Related article: How to Upload Mobile Images to a Banner Block in Zibster
Global Mobile View Settings
Use the global Mobile View setting when you want to establish the default number of columns for supported grid-based blocks throughout your website.
STEP ONE
Log in to your Zibster account and click WEBSITE in the left-side menu.
This opens your Website Builder, where you can manage your website pages, blocks, and design settings.
STEP TWO
Click DESIGN at the top of your Website Builder.
This opens the design area, where you can manage global styling settings for your website.
STEP THREE
Click EDIT DESIGN SETTINGS.
Your website design settings will open in the panel on the right side of your screen.
STEP FOUR
Click STYLING in the right-side menu and scroll to the MOBILE VIEW section.
Choose whether supported grid-based layouts should display in one vertical column or two vertical columns on phones.
FINAL STEP
Click SAVE CHANGES to apply your Mobile View setting.
Your changes automatically apply to your website. There is no separate publish button.
Preview your website on a phone to confirm that your supported grid-based blocks display in the column layout you selected.
Customize Mobile View for an Individual Block
You can override your global Mobile View setting on an individual supported block. This is helpful when one grid-based section needs to display differently from the rest of your website on phones.
For example, you may want most grids on your website to display in two columns while a specific Blog Block or List Block displays in one column.
STEP ONE
Log into your Zibster account and click on WEBSITE in the left-side menu.
STEP TWO
Click the page containing the block you want to customize.
This opens the page editor so you can view and manage the blocks on that page.
STEP THREE
Click the block you want to update.
You can also click the pencil icon in the upper-right corner of the block and click ADVANCED to open the settings for that specific block.
STEP FOUR
Click STYLING in the right-side menu and locate the MOBILE VIEW section.
Choose whether the block should display in one vertical column or two vertical columns on phones.
The setting you choose here overrides the global Mobile View setting for this block.
FINAL STEP
Click SAVE CHANGES.
Your Mobile View selection applies to this block only. It does not change the global setting or the Mobile View settings for other blocks on your website.
Preview the page on a phone to confirm that the block displays in the column layout you selected.
Additional Options and Helpful Notes
Global vs. Individual Mobile View Settings
Your global MOBILE VIEW setting establishes the default mobile column layout for supported grid-based blocks across your website.
If you change MOBILE VIEW on an individual block, that setting overrides the global Mobile View setting for that block only.
This allows you to create a consistent mobile layout across your website while customizing individual sections when needed.
Supported Mobile View Blocks
Mobile View is available for supported grid-based layouts in the:
- Images Block
- List Block
- Blog Block
- Products Block
- Services Block
- Scheduler Block
- Mood Boards Block
The Mobile View option depends on the block and layout you are using. If the selected layout does not use a supported grid, the MOBILE VIEW setting may not be available.
Banner Blocks Use Mobile Banners Instead
Banner Blocks use a separate mobile banner feature instead of the Mobile View grid setting.
Desktop banners are typically designed for wide screens, while phones use a narrower, vertical display. Zibster allows you to upload a separate mobile image to a Banner Block so you have more control over cropping and image composition on phones.
If your banner image does not display the way you want on mobile, see How to Upload Mobile Images to a Banner Block in Zibster.
Troubleshooting & FAQs
Why did changing the global Mobile View setting not affect one of my blocks?
The block may have its own Mobile View setting. Individual block settings override the global Mobile View setting for that specific block.
Open the block, click STYLING, and review its MOBILE VIEW setting.
Why don't I see Mobile View settings on every block?
Mobile View is designed for supported blocks and layouts that display content in a grid.
Supported blocks include the Images Block, List Block, Blog Block, Products Block, Services Block, Scheduler Block, and Mood Boards Block.
The option may not appear if the selected block layout does not use a supported grid.
Should I use one column or two columns on phones?
A single column gives each item more horizontal space. This can work well when you want larger images, longer text, or more room for individual items.
Two columns allow visitors to see more items on the screen at the same time. This can work well for images, blog posts, products, services, scheduling options, Mood Boards, and other visual grids.
Preview both options on a phone and choose the layout that works best for your content.
Why does my Banner Block still crop differently on mobile?
Banner Blocks use mobile banners instead of the Mobile View grid setting.
If your desktop banner does not crop well on phones, upload a separate mobile image to the Banner Block.
I saved my changes but do not see the new mobile layout. What should I check?
Refresh the live page and confirm that you are viewing the block you updated.
If you changed the global Mobile View setting, check whether the block has an individual MOBILE VIEW setting that is overriding the global option.
Also confirm that the block is using a supported grid-based layout. The Mobile View setting may not apply to layouts that do not use a grid.
Need Help?
Zibster Support Hours: Monday–Friday, 9am–6pm EST
Phone: 844.353.3412
Channels: Phone, Live Chat, Support Ticket
