How to Preview CMS Pages & Blocks in Magento 2

Editing CMS content in Magento is straightforward. Previewing those changes before they go live is not. This guide covers every option available, from native Magento features to third-party tools.

The problem: Magento has no built-in CMS preview

If you've ever edited a CMS page or block in Magento 2, you've probably noticed the same thing: there's no preview button. You make your changes, hit save, and the content is immediately live on the storefront. There's no way to check how it looks before your customers see it.

This is a well-known limitation of Magento Open Source (formerly Community Edition). Unlike platforms such as WordPress or Shopify, Magento's CMS editor doesn't provide a built-in preview for pages or blocks.

For simple text edits, this might be acceptable. But for larger changes, such as updating landing pages, reworking promotional banners or redesigning block layouts, publishing blind is risky. Broken formatting, misaligned images and missing content can all slip through.

Option 1: Save and check (the default workflow)

The most common approach among Magento developers and merchants is simply:

1. Edit the CMS page or block in the admin panel.
2. Save it.
3. Open the storefront in another tab and refresh.
4. If something's wrong, go back and fix it.

This works, but every edit is immediately visible to customers. If you're making a series of changes (updating copy, swapping images, adjusting layout), visitors may see a half-finished page while you're still working on it.

When this approach falls short

• Multi-step edits. Changing several blocks that make up a single page leaves the page inconsistent between saves.
• Approval workflows. There's no way to show a stakeholder or client what a page will look like before it's published.
• High-traffic stores. Publishing a broken layout on a homepage or landing page, even briefly, hurts the customer experience.
• Coordinated launches. If a promotion changes several CMS pages and blocks, there's no way to prepare everything and publish it all at once.

Option 2: Use a staging or development environment

Many teams maintain a staging environment: a copy of the production store where they can make and review changes safely.

1. Make your CMS changes on the staging site.
2. Review them on the staging storefront.
3. When satisfied, repeat the changes by hand on production.

Pros

• Full visual preview in a realistic environment.
• No risk to the live store while editing.

Cons

• Manual duplication. You make every change twice, once on staging and once on production. Copy-paste errors are common.
• Environment drift. Staging and production diverge over time, so the preview on staging may not match production.
• Slow feedback loop. Switching environments, logging in, finding the right page and comparing all take time.
• No block preview. CMS blocks don't have their own URL. To preview a block change, you have to find a page that renders the block and check it there.

Option 3: Adobe Commerce Content Staging

Adobe Commerce (formerly Magento Enterprise / Commerce Edition) includes a Content Staging module. It lets you create scheduled "campaigns" with content changes and preview them before they go live.

How it works

• You create a campaign with a start and end date.
• You stage changes to CMS pages, blocks, products, categories and other entities within that campaign.
• A preview mode shows the storefront as it will look when the campaign is active.
• At the scheduled time, the changes are applied automatically.

Limitations

• Only available on Adobe Commerce. It isn't part of Magento Open Source, and Adobe Commerce licences start at tens of thousands of dollars per year, which puts it out of reach for most small and mid-sized merchants.
• Complexity. Content Staging changes Magento's database schema, adding versioning to every staged entity. That makes the database more complex, can affect performance, and makes debugging harder.
• Conflicts. Overlapping campaigns that change the same entity can be difficult to manage.
• Extension compatibility. Many third-party extensions aren't fully compatible with Content Staging, which leads to unexpected behaviour.

Option 4: Preview with MageDrop (free)

MageDrop is a free tool built to solve the preview problem in Magento Open Source. It adds preview, staging, scheduled deploys and rollback for CMS pages and blocks, as well as categories and products, without changing your Magento database schema.

How to preview a CMS page

1. Install the MageDrop companion module on your Magento store.
2. Open any CMS page in the Magento admin.
3. Make your changes in the editor.
4. Open the MageDrop menu in the button bar and choose Quick Preview.
5. Click Open Preview in the dialog. The storefront opens in a new tab, showing the page exactly as it will look with your changes applied.

Your changes are not saved or published: the preview is generated from the form as it is. Customers keep seeing the existing live content.

How to preview a CMS block

Blocks are trickier because they don't have their own URL: they're embedded in pages, widgets or templates. MageDrop handles this:

1. Open the CMS block in the Magento admin.
2. Make your changes.
3. Choose Quick Preview from the MageDrop menu, then Open Preview.
4. The storefront opens with the block's new content shown wherever the block appears.

Browse to any page that includes the block, and you'll see the updated version rendered in place.

Previewing several changes together

To preview changes across several pages and blocks as a group, such as a campaign that updates the homepage, a landing page and a sidebar block, use a release:

1. Create a release in the MageDrop dashboard.
2. Stage changes from each CMS page and block into that release with Save & Stage.
3. Click Preview on the release.
4. Browse the storefront with every staged change applied at once.

This gives you the complete picture of how the store will look once everything is deployed together.

Sharing previews for approval

Preview links are shareable. Copy the link and send it to a colleague, client or stakeholder. They see the preview on the live storefront without a Magento admin account or a MageDrop login, and each person gets their own isolated preview: their visit doesn't affect anyone else. Links expire after two hours, and you can make a new one at any time.

How MageDrop preview works under the hood

MageDrop doesn't save anything to Magento until you deploy. During a preview:

• The preview is stored in your browser session.
• The Magento module overlays the staged changes in memory as each page renders.
• The full page cache is handled automatically: preview pages are cached separately, so they're never shown to regular visitors.
• When you exit the preview, everything returns to normal.

Comparison of preview options

Getting started with MageDrop

MageDrop is free to use. To set up preview for your Magento store:

1. Create a MageDrop account and add your store.
2. Install the companion module on your Magento store; see the installation guide.
3. Paste the module token from your MageDrop dashboard into the module's settings.
4. Start previewing: Quick Preview is in the MageDrop menu on every CMS page, block, category and product edit screen.

For a detailed walkthrough, see the full documentation.