I want to add quicktags that do more than just add markup. For instance, I would like to add a quicktag to run a function do apply a js regex on the page content. How can I add a quicktag that executes a function?
To give a specific example, I would like to add a button that removes all markup tags in the entire post text. This is analogous to the predefined quicktags for finding unmatched tags, or "proofread", etc.
Topic quicktag html-editor Wordpress
Category Web
Simple example that will add a Quicktag button that calls a Javascript function when it is clicked...
<?PHP
function _add_my_quicktags(){ ?>
<script type="text/javascript">
QTags.addButton( 'alert', 'Alert Button', simple_alert );
function simple_alert() {
alert('hello, example callback function');
}
</script>
<?php
}
add_action('admin_print_footer_scripts', '_add_my_quicktags');
?>
UPDATE.... Adding a Callback function that utilizes the passed in variables...
// Add a button called 'abbr' with a callback function
QTags.addButton( 'abbr', 'Abbr', abbr_prompt );
// and this is the callback function
function abbr_prompt(e, c, ed) {
var prmt, t = this;
if ( ed.canvas.selectionStart !== ed.canvas.selectionEnd ) {
// if we have a selection in the editor define out tagStart and tagEnd to wrap around the text
// prompt the user for the abbreviation and return gracefully on a null input
prmt = prompt('Enter Abbreviation');
if ( prmt === null ) return;
t.tagStart = '<abbr title="' + prmt + '">';
t.tagEnd = '</abbr>';
} else if ( ed.openTags ) {
// if we have an open tag, see if it's ours
var ret = false, i = 0, t = this;
while ( i < ed.openTags.length ) {
ret = ed.openTags[i] == t.id ? i : false;
i ++;
}
if ( ret === false ) {
// if the open tags don't include 'abbr' prompt for input
prmt = prompt('Enter Abbreviation');
if ( prmt === null ) return;
t.tagStart = '<abbr title="' + prmt + '">';
t.tagEnd = false;
if ( ! ed.openTags ) {
ed.openTags = [];
}
ed.openTags.push(t.id);
e.value = '/' + e.value;
} else {
// otherwise close the 'abbr' tag
ed.openTags.splice(ret, 1);
t.tagStart = '</abbr>';
e.value = t.display;
}
} else {
// last resort, no selection and no open tags
// so prompt for input and just open the tag
prmt = prompt('Enter Abbreviation');
if ( prmt === null ) return;
t.tagStart = '<abbr title="' + prmt + '">';
t.tagEnd = false;
if ( ! ed.openTags ) {
ed.openTags = [];
}
ed.openTags.push(t.id);
e.value = '/' + e.value;
}
// now we've defined all the tagStart, tagEnd and openTags we process it all to the active window
QTags.TagButton.prototype.callback.call(t, e, c, ed);
};
you should write a tinymce plugin, then load it (using tinymce advanced plugin)
Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.