TinyMCE + code block

178 Posts

salik Reply #1, 18 years, 1 month ago

Hi, I need to write some tutorials for my clients and I need to use Modx snippet’s call to show them how to use it. But, unfortunately TinyMce changes all [[ ]] [! !] and so ... into html entites (it’s called like this? wink

)

How can I input code blocks, like here on the forum

I want to have it like this :)

Regards,

Mike

//Why use windows since there is a door?//

☆ A M B ☆
24,524 Posts

sottwell Reply #2, 18 years, 1 month ago

I use <pre> blocks styled with css. You can use code blocks if you prefer.

But the MODx tags have to be encoded, or MODx will attempt to process them as usual. For example, if you try to use [*content*] in an example, you’ll get duplicate content blocks! So [*content*&#193 is how you have to represent it. The same with snippets and chunks.

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

2,310 Posts

bunk58 Reply #3, 18 years, 1 month ago

There is a plugin, I’ve named it "DisplayCode", can’t remember if it’s the original name or not :

// plugin for MODx for not parsing Snippet, Chunk and Doc Var tags
// author: Marc Hinse, www.modxcms.de, [email protected]
// Version 1.0
// 17.07.07

function replace_modxtags($matches){
    global $modx;
    $code_entities_match = array('[', ']','{', '}');
    $code_entities_replace = array(
                        '<span class="bracket">[</span>',
                        '<span class="bracket">]</span>',
                        '<span class="bracket">{</span>',
                        '<span class="bracket">}</span>',
                    );
    $code = str_replace($code_entities_match,$code_entities_replace,$matches[1]);
    return '<pre>'.$code.'</pre>';
}

$modx->documentObject['content']=preg_replace_callback("#<pre>(.*?)</pre>#s", "replace_modxtags", $modx->documentObject['content']);

Check the "OnLoadWebDocument" System Event for the plugin.
In your docs just surround the snippet call etc. with pre tags :

<pre>[!Fisheye!]</pre>

The plugin adds some span tags :

<pre><span class="bracket">[</span>!Fisheye!<span class="bracket">]</span></pre>

I’m using it here.