Can I see the live site URL while editing a funnel or website?

Yes. The live site URL is displayed directly in the builder interface while you are editing, so you do not have to leave the page to access the URL.

🥳 Celebrate Our Launch With a $200 LIFETIME Discount OFF The Premium Plan Use: BIRTHDAY2024

This offer expires 9/30/2024, at 11:59 PM EST

BizStackPro all-in-one digital marketing platform dashboard.

Customizing Your Funnel and Website for Mobile and Desktop Views – BizStackPro Help

Customizing Your Funnel and Website for Mobile and Desktop Views

Q: Should I use Mobile Only and Desktop Only sections for all layout changes?

No. It is recommended to use Mobile Only and Desktop Only sections only when necessary, such as for layout and spacing changes. Overusing them creates duplicate content that must be updated separately for each view.

Q: How do I make a section desktop-only or mobile-only?

Edit your page, click on the section, row, column, or element, go to the Advanced tab in its Settings, and adjust the Visibility icons for desktop and mobile. You can then use the view icons in the top menu to preview each version.

Q: Are there any settings that can be different for desktop and mobile at the same time?

Yes. Font sizes are the only element that supports simultaneous desktop and mobile settings, allowing different font sizes for each view without duplicating elements.

Q: How do I adjust left and right spacing between columns?

Select a column in the builder and use the Margin Left and Margin Right options in the style settings. Adjust these margins to create the desired spacing between columns, then save your changes.

Q: Do column margin adjustments apply to mobile layouts?

Currently, margin adjustments for columns apply only to desktop layouts. Mobile layout support for this feature will be added in a future update.

Q: Can I use column margin controls on existing pages?

No. The Margin Left and Margin Right settings for columns are available only on new pages created after the column spacing update was released.

Optimize every page for any device using view-specific visibility controls, mobile/desktop previews, responsive font sizes, and column spacing tools—without creating unnecessary duplicate sections.

Browse Help Center See All Plans & Features

Making Pages Work Better Across Mobile and Desktop Devices

A page that looks clean on desktop can quickly become difficult to read or navigate on mobile devices when spacing, layouts, and text sizes are not adjusted properly.

BizStackPro’s Site Builder includes responsive preview tools, visibility controls, mobile and desktop-specific settings, and spacing adjustments to help optimize layouts across different screen sizes.

Overusing duplicated mobile-only or desktop-only sections can create unnecessary maintenance work, inconsistent updates, and harder-to-manage page structures over time.

This guide explains how to manage responsive layouts, control visibility settings, adjust font sizes for different devices, optimize column spacing, and preview pages effectively inside BizStackPro.

Before duplicating sections for different devices, it helps to understand how responsive visibility controls and mobile previews work inside the Site Builder.

Overview

The BizStackPro funnel and website builder includes built-in desktop and mobile previews, making it easier to ensure your design looks great on any device.

To fine-tune layouts, you can hide specific sections, rows, columns, and elements so they appear in only one view. Use these controls strategically to avoid duplicate content that must be maintained separately.

Rule of thumb: Build the page once, then only duplicate sections when a layout must be fundamentally different between desktop and mobile.

Use Desktop Only and Mobile Only sections (sparingly)

The builder can hide certain elements so they only appear in one view—desktop or mobile. Once an element becomes view-specific, updates made in one view do not automatically sync to the other, which can double your work if overused.

Recommended approach

Build the full layout for desktop first.
Switch to mobile view and identify only the sections that need a different layout or spacing.
Duplicate only those sections and set one copy to Desktop Only and the other to Mobile Only.
Edit the Mobile Only version without affecting the desktop layout.

Make a section/element desktop-only or mobile-only

Open your funnel/website and click Edit.
Click the blue Edit Page button.
Select the section, row, column, or element you want to control.
Open the Advanced tab in the settings panel.
Under Visibility, toggle the desktop/mobile icons:
- Enabled view icon = visible on that device.
- Disabled view icon = hidden on that device.
Use the top toolbar desktop/mobile preview icons to verify both versions.
Click Save.

Important: Once an element is view-specific, changes are independent for each view. Keep a single shared version whenever possible.

Font sizes can be different for desktop and mobile

Font sizes are the only setting that supports separate desktop and mobile values without duplicating content. You can use one text element and configure its font size for each view to improve readability.

Tip: If the layout is fine but the text feels too large/small on mobile, adjust font sizes first before duplicating sections.

Live site URL display inside the builder

The builder displays the live site URL while you’re editing, so you can copy/open it without leaving the editor.

Why this helps

Share live links with a client or teammate quickly.
Open the live page in a new tab for device testing.
Confirm you’re editing the correct page before publishing.

Column spacing: Margin Left and Margin Right

Column margins give you more control over horizontal spacing between columns on desktop layouts. This is useful when default padding doesn’t create the spacing you want.

How to adjust column spacing

Select the column you want to adjust.
In the style settings, locate Margin Left and Margin Right.
Increase/decrease values to create the desired spacing between columns.
Click Save and preview the page.

Current limitations: Column margin adjustments apply to desktop only, and these controls are available only on new pages created after the column spacing update.

Desktop only: mobile support is planned for a future update.
New pages only: existing pages created before the update won’t show these controls.
Per-column: margins must be set per column (not global).

Best practices for mobile and desktop optimization

Build desktop first: lock your structure before refining mobile.
Duplicate only when needed: use Desktop Only/Mobile Only for true layout differences.
Use font sizing smartly: adjust mobile font sizes without duplicating text elements.
Preview constantly: switch between desktop and mobile preview icons often.
Test live: use the live URL shown in the builder for quick front-end validation.

Make every page look great everywhere

Use responsive previews, visibility controls, and device-friendly typography to create pages that feel polished on desktop and mobile—without maintaining two versions of everything.

🚀 See All Plans & Features

Opens in a new tab.

Frequently Asked Questions

Should I use Mobile Only and Desktop Only sections for all layout changes?

No—use them only when necessary (usually layout and spacing). Overusing them creates duplicate content you must update twice.

How do I make a section desktop-only or mobile-only?

Select the section/row/column/element, go to Advanced, and toggle Visibility for desktop and mobile. Then preview each view using the top toolbar icons.

Are there any settings that can be different for desktop and mobile at the same time?

Yes—font sizes can be set separately for desktop and mobile without duplicating the text element.

Can I see the live site URL while editing?

Yes—the builder displays the live URL while you edit, so you can copy or open it quickly.

How do I adjust left and right spacing between columns?

Select a column and use Margin Left and Margin Right in the style settings to adjust spacing.

Do column margin adjustments apply to mobile layouts?

Not currently—column margin adjustments apply to desktop layouts only. Mobile support is planned for a future update.

Can I use column margin controls on existing pages?

No—these controls are available only on pages created after the column spacing update was released.

📚 Browse More Help Guides

Build responsive pages without double work

Optimize typography and spacing first, then duplicate only the sections that truly need a different layout. You’ll ship faster—and maintain fewer moving parts.

✅ View Plans & Features

Cleaner layouts. Better mobile experience.

📚 Browse More Help Guides

Disclaimer: This site is NOT endorsed by Google, Facebook or YouTube in ANY WAY. All trademarks & Logo / branding are the property of their respective owners. Please Note: This site was created in BizStackPro by Ken George II (An Affiliate of BizStackPro) and may contain affiliate links.