Search code examples
phpdrupaldrupal-7escapingckeditor

How can I insert a PHP code in CKEditor from a plugin?


I'm using Drupal 7 and the CKEditor module for a WYSIWYG textarea. I need to insert a PHP code like <?php echo "Hello World!"; ?> in the Full HTML text format, it isn't needed to see the Hello World in the WYSIWYG mode, but it has to be in the source mode.

The config file sites\all\modules\contrib\ckeditor\ckeditor.config.js has the config.protectedSource.push(/<\?[\s\S]*?\?>/g); // PHP Code line and the Full HTML text format has the PHP evalutaor checked.

So, if I write <?php echo "Hello World!"; ?> in the source mode it works perfectly.

Now I want to add a button in the CKEditor tool bar to add the next code when the button is clicked: <div id="phpcode"><?php echo "Hello World!"; ?></div>.

The code in my plugin.js is:

editor.addCommand('phpcode', {
    exec : function() {
        code = editor.document.createElement('div');
        code.setAttribute('id', 'phpcode');
        code.setHtml('<?php echo "Hewllo World"; ?>');
        editor.insertElement(code);
    }
});

But the result is (Notice that the <?php and ?> are commented.):

<div id="phpcode"><!--?php echo "Hewllo World"; ?--></div>

If I change the code.setHtml() for code.setText() the result is (Notice that the < and > are escaped):

<div id="phpcode">&lt;?php echo "Hewllo World"; ?&gt;</div>

How can I insert a PHP code clicking in a CKEditor toolbar button?


Solution

  • The solution is so easy. Just change the insertElement function for insertHtml function:

    editor.addCommand('phpcode', {
        exec : function() {
            editor.insertHtml('<div id="phpcode"><?php echo "Hewllo World"; ?></div>');
        }
    });