Editing PHP in TinyMCE 3.2.x
Here is quick and dirty way to add PHP editing capabilities to your TinyMCE.
Javascript
On the JavaScript side initiate TinyMCE as you normally would, and add setup editor event ( in bold below)<script type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "advanced",
theme_advanced_buttons1 : "mybutton,bold,italic,underline",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
plugins : 'inlinepopups',
setup : function(ed) {
//This event (onBeforeSetContent)gets executed when the setContent method is called
//gets executed when the setContent method is called but before the contents gets
//serialized and placed in the editor.
ed.onBeforeSetContent.add(function(ed, o) {
//replace all instances of <?php and ?> with HTML entities
o.content = o.content.replace(/<\?/gi, "<?");
o.content = o.content.replace(/\?>/gi, "?>");
});
}
});
</script>
PHP
On the PHP side take the TinyMCE content and convert the HTML entities back to <?php and ?>
$content = str_replace("<?php", "<?php", $content);
$content = str_replace("?>", "?>",$content);
Note
When using this technique it is recommended to use Code Editor instead of WYSIWYG interface to write PHP code. You may also want to create a simple CSS class to wrap and hide code from inexperienced users. For example you could create something like this:
CSS
.php_code{
border:1px dotted #C63;
padding:2px 2px 2px 15px;
width:100px;
height:12px;
background:url(php_code.gif) no-repeat center left;
color:#fff;
}
Inside TinyMCE wrap your PHP code with: <div class="php_code"><?php ?></div>. Users would then see something like this:
instead of your PHP code.
Emir Plicanic owns and operates a web design company (