boundsoff/module-page-builder-live-preview

Storefront viewer as new tab on browser which is updated on every changed in the page builder.

dev-develop 2026-07-26 17:40 UTC

Requires

• magento/module-page-builder: ^2.2.5

Requires (Dev)

• chillerlan/php-qrcode: ^5.0

MIT

Published on Packagist.org on 2026-07-31 14:24 UTC

README

1. About
2. Features
3. Usage
4. Basic installation
5. Tests
6. Links

About

In the original page builder editor when You want to see how the changes looks like in given storefront u gotta save it, open page and refresh every change U made.

This could lead to small mistakes and hard to make corrections. Also page is normally visible and visible for indexers or others not to mention performance is lowered by clearing cache all the time.

This module make it simple to work with these issues by adding feature called Live Preview, which allows to see the changes in separate browser window after the change is made without saving anything.

Every window is only available through the link with hash that can be shared or even open it with Your phone which can accurate see if it fits perfectly.

U can open every storefront available on multiple devices or browsers, and they will update all at once without refresh the page of those.

Features

• see the changes made in page builder without any save
• any storefront preview on separate tab
• any browser to get the preview
• any device to display the changes
• updated in background, no need to refresh the page to see the changes
• private preview without any cache rebuild
• can be share with anyone

Usage

1. Open content with page builder with fullscreen
2. On the right along with he viewports there is new CTA with live preview
3. Click it and then U will see dialog with store views list with store counter
4. By click any of them U will see details information with details information
   1. U can scan QR code with phone camera to open the preview
   2. There is a link display for U to use manually
   3. Copy button will get this link to Your clipboard and paste everywhere you want to
   4. Open button will just open new tab with current browser with the preview
   5. Back link will get U back for the list of store views
5. U can close dialog by click everywhere else inside of it

Basic installation

composer require boundsoff/module-page-builder-live-preview

php bin/magento module:enable --clear-static-content Boundsoff_PageBuilderLivePreview

php bin/magento setup:di:compile

php bin/magento setup:static-content:deploy

Tests

There are test to be run with the mftf Magento Functional Testing Framework

If u got setup this correctly, run it with this command

vendor/bin/mftf run:group boundsoff_live-preview

Links

1. Boundsoff
2. LICENSE
3. CHANGELOG