This project is not covered by Drupal’s security advisory policy.
This module provides a more comprehensive, genuine and interactive version of the built-in node preview feature.
The live preview feature requires JavaScript; if JavaScript is disabled it will not apply its triggers, effectively retaining the built-in preview.
Installation/configuration
- Install and enable this module
- Enable live preview on a content type (admin/structure/types/manage)
- When live preview is enabled, you can customize which fields should be visible during live preview, and the order of these.
How it works
This module provides most of it's UI using JavaScript. When it's initiated, some markup is created and class names are added to change the layout. The original edit form is left untouched, but gets it's children hidden and reordered as configured.
The preview is constructed using an elaborate method* which "fools" Drupal's theme system to utilize the default theme (and not the administration theme), and uses drupal_render_page to acquire the final markup. It will yield markup of the entire page (from <html> to </html>), with the rendered node manually placed inside the system content block.
The actual preview is fetched using AJAX (provided from a custom FAPI ajax callback) and displayed in an iframe.
As an optional feature, a visual diff can be shown using PHP-FineDiff. The diff shows changes from when the edit form was first built, in other words; unsaved changes.
The preview is currently updated every 10 seconds, or when the "Update" button is clicked.
Demo
A short demonstration screencast can be found here (from 2014-12-17).
* Initial "proof of concept" - the method is likely to change
Development status
The module has quite a bit of work left before it's ready for a stable release. It has been tested OK with a wide range of different sites and field types. If you stumble upon a field type or any other customization which causes problems with live preview, create an issue.
That being said, using this module shouldn't cause any critical situations as it never intervenes with the node or the node form (besides from adding a button and javascripted behaviour).
Known issues
- Errors when rendering title fields (related to #2040055)
- Some issues with field_collection fields having flexslider_entityreference fields. This is due to an edge case and will be fixed in the next release of flexslider_entityreference module.
Planned and suggested features/changes
- Better page rendering in a more "real" manner, so that it looks 100% like it would on the applicable path
- Rewrite CSS; it's currently not very thought-through, and doesn't look very good
- Draggable divider (to adjust preview width). Toggle show/hide of left pane.
- More layout options for the live preview UI (top/bottom, left/right etc..)
- Better detection of form changes, so that reloads only happen on actual changes
- Ability to preview a piece of content in the context seen by the visitor - i.e. as a referenced entity, a views display, panels content etc.
- Revision handling (side-by-side)
- Provide an API
If you have any suggestions/feedback, feel free to create an issue and tell us about it.
Project information
Minimally maintained
Maintainers monitor issues, but fast responses are not guaranteed.- Project categories: Content editing experience
4 sites report using this module- Created by bendikrb on , updated
This project is not covered by the security advisory policy.
Use at your own risk! It may have publicly disclosed vulnerabilities.
