---
title: Preview Visual Builder content
slug: cms-13/docs/preview-visual-builder-content
docTags: 
createdAt: 2026-07-30T20:22:02.255Z
---

Preview your Visual Builder content to verify layout, styling, and responsiveness before publishing. The preview panel displays the experience as you build it. It can display any content for any channel.  Visual Builder integrates the **Outline** and **Preview** panels so that hovering over a section in the **Outline** panel also highlights the corresponding section in the **Preview** panel and vice versa.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/-E2vMIKJMkhaipGpXWe2E_22e97b0bdfb5d25909389a835df67709b0cd663d1551553937d0a1bafaaa6b9b-image.png)

When you click an element in the **Preview** panel, the section opens in the **Outline** panel for you to work on.

### Adjust panel size

Drag the vertical bar between the panels to resize them and create more editing space.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/CW3zJ_yWphSSKRVjjExy9_c3b0e36abe708f56303d815268f69d1780aad8bc8a8e0488e618c841e5e925dc-image.png)

### Preview on desktop, tablet, or mobile devices

Click the view icons to display your content in desktop, tablet, or mobile views. Custom view options are not available.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/mRJXIVblqvfDo8iDR0ELa_595bd7de31341769749bcac3801d37f0ee2dc795abe540b8751fbcdd8409261f-image.png)

- **Desktop view**

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/4slHDkvpPnvUjb_IRpliD_f39ca62e486998fd503da93abf86b0efe5bc8ed1ed8f552aad0c1e986339e7af-image.png)

- **Tablet view**

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/TzmkOevOPfatYw7RgVNeQ_03c00cf349dbf4f42a2d4e66cfe93fc22ae4785a38ed4baf7704a92f37f6ed29-image.png)

- **Mobile view**

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/hZJLrURocj5dpavWiWLGy_8c4a65179c7fe9eaca2641e4cd21e55f83a08af1601e3ca01690a527b06b7d34-image.png)

### Preview content as visitors see it

Click **Preview** in the top toolbar to view the page as visitors see it, without editing outlines or overlays. Hover over the toolbar buttons to see their names. Click **Preview** again to return to editing.

![Screenshot of the Visual Builder top toolbar where the Preview button is highlighted next to Publish](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/xSAehwpoMT7wJQF_SWgFH_preview-image-cms-13-40.png)

In CMS 13.4.0 and later, **Preview** is available in Visual Builder and split view.