TinyMCE Prism


You may in TinyMCE add plugins to be able to pase source code in a easy and clean way. This is the plugin use on the current page. To do so, add following:

Download the plugin here:

http://prismjs.com/download.html  

 

In TinyMCE init-script:

tinymce.init({
  selector: "textarea",  // change this value according to your HTML
  plugins: "codesample",
  toolbar: "codesample"
});

 

To the Page

<link rel="stylesheet" type="text/css" href="prism.css">
<script src="prism.js"></script>

 

To style the Code-block that is created, simply use the calss code, like this:

.code{
    width: 80%;
    margin: 7px auto;
}

 

TinyMCE docs:

https://www.tinymce.com/docs/plugins/codesample/

 


Published: 2016-08-25