Changelog
All of the changes to the Kirby Live Preview plugin.
Get the Latest Version
Via Composer Recommended
composer require johannschopplich/kirby-live-preview
composer update johannschopplich/kirby-live-preview
Via ZIP Download
Download the latest version v2.4.1 and extract it to your site/plugins folder. If updating, replace the existing plugin folder with the new one.
What's New?
v2.4.1
July 11, 2025
🐞 Bug Fixes
- Non-Composer installation: Fixed plugin installation for projects that do not use Composer. Previously, manually downloading and extracting the plugin to
site/plugins/could fail due to missing autoloader configuration. The plugin now works correctly regardless of installation method.
v2.4.0
June 24, 2025
🚀 Features
- Kirby 5 license status integration: The plugin now displays its license status on the Panel's system page, following Kirby 5's plugin license management conventions. This provides a unified view of all plugin licenses alongside Kirby's own license information.
v2.3.3
May 2, 2025
🐞 Bug Fixes
- Template validation: The plugin now throws a descriptive exception if the
<head>tag is missing in your page template. Live Preview requires a<head>tag to inject the necessary JavaScript for real-time updates. Previously, templates without a<head>tag would fail silently. The error message now clearly indicates which template needs to be fixed.
v2.3.2
April 6, 2025
🐞 Bug Fixes
- Kirby 5 beta compatibility: Fixed compatibility with Kirby 5.0.0-beta.5, which introduced breaking changes to the Panel API. If you were experiencing issues with the preview not loading in Kirby 5 beta, update to this version.
v2.3.1
April 4, 2025
🐞 Bug Fixes
- Device preview scaling: Device previews are no longer scaled up when smaller than the preview section container. Previously, mobile device previews (390px) could be upscaled when the preview section was wider, resulting in blurry rendering. Device previews now maintain their native resolution.
v2.3.0
April 2, 2025
🚀 Features
- New button to open previews in a new tab.
- Device dimensions buttons to simulate different screen widths. The height is fixed at 100% of the preview section. The available devices are:
- Mobile: 390px
- Tablet: 768px
- Desktop: 1440px
v2.2.0
January 24, 2025
🐞 Bug Fixes
- Site-level field preview: Unsaved content from site-level fields is now correctly rendered in the preview. Previously, when editing site fields (in
site.yml), changes were not reflected in the preview until saved. Now, site-level content updates in real-time just like page-level content.
v2.1.0
January 20, 2025
🚀 Features
- Preview alternate pages: The new
pageIdsection property lets you preview a different page than the one being edited. This is useful for previewing how site-level changes affect a specific page, or for previewing template pages from a settings panel. - Improved sticky scroll behavior: Section height calculation for sticky previews has been improved, providing smoother scrolling behavior when editing content alongside the preview.
v2.0.0
December 20, 2024
Kirby Live Preview v2 is a major release with full support for Kirby 5. This major release requires a new license key. If you already have a license, you receive either a free upgrade to v2 or a 50% discount on your new license. Head over to the Kirby Tools Hub to get your discount or read more in the license compatibility guide.
🚀 Features
- Kirby 5 compatibility: Full support for Kirby 5, including compatibility with the new Panel architecture and updated APIs.
- Maintained Kirby 4 support: The plugin continues to work with Kirby 4 projects, allowing you to upgrade at your own pace.
v1.5.0
November 15, 2024
🚀 Features
- New
updateStrategyto control the preview update behavior. If set toblur, the preview is updated when any Kirby text-like, number-like, or blocks field loses focus.
To change the default strategy from interval to blur, set the updateStrategy property in your blueprint:
sections/live-preview.yml
type: preview
updateStrategy: blur
v1.3.0
June 18, 2024
🚀 Features
- Panel license activation: Activate and manage your license directly in the Kirby Panel without manual file editing. Click the activation link in the Live Preview section to enter your license details. Visit the Kirby Tools Hub to purchase or manage licenses.
- Packagist distribution: The plugin is now available via Packagist, simplifying Composer-based installations. The private Composer repository has been deprecated.
v1.2.0
March 25, 2024
🚀 Features
- Change rendering frequency with the
updateIntervaloption or disable it completely.
🐞 Bug Fixes
- Saving with
Cmd + Snow works correctly when the focus is on the preview frame.
v1.1.0
March 24, 2024
🚀 Features
- Resolve permalinks in
writerfields to redirect links to the corresponding Panel page. - Support detecting the preview mode in the frontend with the
data-preview-modeattribute in CSS and JavaScript:
assets/css/main.css
[data-preview-mode] .cookie-banner {
display: none;
}
assets/js/main.js
const isPreviewMode = document.documentElement.dataset.previewMode === "true";
- Support preview mode detection in the backend with the
previewModecontent key:
site/snippets/footer.php
$isPreviewMode = $page->previewMode()->isTrue();
v1.0.3
March 22, 2024
Initial Release
Kirby Live Preview v1.0 brings real-time content preview directly into the Kirby Panel. See your changes rendered instantly as you edit, without switching between the Panel and your website.
🚀 Features
- Real-time preview: Content updates are rendered in the preview iframe as you type, providing instant visual feedback.
- Panel section: Add the preview section to any blueprint with
type: preview. Works with pages and site blueprints. - Sticky layout support: Make the preview sticky in your blueprint layout for side-by-side editing alongside blocks and other fields.
- Panel link navigation: Click links in the preview to navigate to the corresponding Panel page instead of the frontend URL.
- Configurable refresh: Control the preview update behavior with the
updateIntervaloption.
For setup instructions, see the Getting Started guide.