Kentico CMS 7: Design preview
Defining various types of design elements is an integral part of developing websites. Version 7 makes this process easier by allowing you to look at the final results directly while working with the code, without the need to leave the editing interface or switch between browser tabs.
One of the most requested features on
Kentico uservoice was the possibility of seeing a page preview while editing the code of a transformation. We’ve extended this requirement, and a design preview will be provided for all parts of the system that affect the design and appearance of the website.
This includes the editing interface for CSS stylesheets, transformations, page layouts, web part containers and web part layouts.
Design preview in action
There will be a button available in the appropriate parts of the interface that switches the standard editing form to preview mode.
This splits the area into an editing section containing the code editor (maximized by default) and a preview section showing a selected page.
You can switch between a horizontal or vertical preview layout to get the most convenient editing environment based on your screen resolution and the dimensions of the viewed page.
You can select which page you wish to preview, so it’s easy to verify that your changes are displayed correctly for all occurrences of the currently edited item. When editing in
CMS Desk, the currently selected document will be shown be default.
If possible, the page will automatically zero in on the given component. For example, when editing a transformation, the page will scroll down to the web part that uses the given transformation to display data.
The document preview is automatically refreshed whenever the changes in the code are saved.
The section displaying the page works just like the Preview mode of CMS Desk, which means that you can also preview documents that aren’t published on the live site yet.