Ok, so the way to do this…I think…
1) Create your own plugin with a php file and a js file.
2) Hook into the front_end_editor_loaded action in your php file like:
function add_code_button() {
echo "<script type='text/javascript' src='".plugins_url('/code_button.js', __FILE__)."'></script>";
}
add_action('front_end_editor_loaded', 'add_code_button');
3) Add js to register a button to CLEditor (got this from: here):
(function($) {
$.cleditor.buttons.pastecode = {
name: "pastecode",
image: "**** PUT YOUR IMAGE FOR THE BUTTON HERE! ****",
title: "Code",
command: "inserthtml",
popupName: "pastecode",
popupClass: "cleditorPrompt",
popupContent: "Paste the code:<br /><textarea cols='40' rows='3'></textarea><br /><input type='button' value='Ok' />",
buttonClick: pastecodeClick
};
// Handle the hello button click event
function pastecodeClick(e, data) {
// Wire up the submit button click event
$(data.popup).children(":button")
.unbind("click")
.bind("click", function(e) {
// Get the editor
var editor = data.editor;
// Get the entered name
var codeblock = $(data.popup).find("textarea").val();
var html = '<pre>' + codeblock + '</pre>';
// Insert some html into the document
editor.execCommand(data.command, html, null, data.button);
// Hide the popup and set focus back to the editor
editor.hidePopups();
editor.focus();
});
}
})(jQuery);
