Products.cmfplone: can't see preview of final page while editing

[djay]

user problem

You can have custom diazo, custom css, interactions with the portlets and footers etc. Tinymce styles are only ever a simulation of what it will look like on the final page.

options

1. side-by-side live preview like in craft cms - https://viget.com/extend/why-we-love-craft-cms
   
   
   
   • or perhaps a preview button like http://castlecms.io
   
   
   • 
   
   
2. Mosaics is sort of a solution but is still not going to let you see what the real page will look like.
   
   
   
   • you are likely not going to theme mosaic so won't look like the final themed version
   
   
3. not load tinymce in an iframe
   
   
   
   • makes theming more complex as tinymce and all plone UI has to work within your theme. complications such as js comflicts and css conflicts can be a pain
   
   
   • only works for the single richtext portion. Not markdown or other kinds of fields.
   
   

[thet]

Option 3. could be:
3) Inline TinyMce, which is not loaded in an iframe and thus using the styles of the page as they are. I've recently added some enhancements to mockup to support that properly:
https://github.com/plone/mockup/pull/568

I think this does only solve the textediting part of the problem. You won't see the title and other stuff rendered as it is on the front page.

[tomgross]

There is a feature request in p.a.mosaic for 2: https://github.com/plone/plone.app.mosaic/issues/99

[djay]

@thet edit the original issue. It's a wiki
@tomgross The idea with these kind of issues to contain all the options in one places, not spread the debate around the place

[espenmn]

Brainstorming: Maybe this can be done 'with just UI'. If plone.app.iterate is installed, and 'check out' looks like 'Edit' to the user, and 'Check in' looks like 'save', the 'preview' could just open the copy in its own window ?

[tkimnguyen]

Yet another pointer to Castle ... we have a Preview button in the toolbar that shows you how the page will appear to an anonymous viewer. You can also select device type (phone, tablet, phablet, desktop).

[hvelarde]

I like this also; +1 on adding such feature upstream Plone.