We do something similar, except that we have a preview link on the page loading the editor. This approach can be used for a button in the editor, but this requires additional coding (I will describe this approach below).
The preview link looks something like this:
<a href="#" onclick="return doPreview();">Preview the page</a>
We have a doPreview function:
function doPreview() {
var hiddenForm = document.forms[ 'hidden_form' ];
hiddenForm.elements[ 'preview_content' ].value = CKEDITOR.instances.TextareaId.getData();
var liveForm = document.forms[ 'myform' ];
if ( ! liveForm ) {
alert( 'Error finding "myform" form.' );
return false;
}
hiddenForm.submit();
return true;
}
Finally, there is a form with hidden fields (hiddenForm):
<form name="hiddenForm" action="HTTP://www.yoursite.com/preview_template" method="POST" target="_blank">
<input type="hidden" name="preview_content" value="" />
</form>
, doPreview.
CKEditor .
.
.
$_POST ['preview_content'] ( ).
, , .
, CKEditor:
. :
http://docs.cksource.com/CKEditor_3.x/Tutorials
, .
JavaScript .
. , :
config.removePlugins = 'preview';
,