Created
July 13, 2011 00:55
-
-
Save Mottie/1079524 to your computer and use it in GitHub Desktop.
Adding WordPress Quicktag Buttons to a WP Plugin
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/************************************************ | |
Adding WordPress Quicktag Buttons to a WP Plugin | |
************************************************/ | |
?> | |
<style> | |
/* Simulate the input buttons styles */ | |
#ed_toolbar button { | |
display: inline-block; | |
vertical-align: middle; | |
margin: 0; | |
padding: 0; | |
min-width: 26px; | |
height: 24px; | |
-moz-border-radius: 3px; | |
-webkit-border-radius: 3px; | |
border-radius: 3px; | |
border: #c3c3c3 1px solid; | |
background: url(<?php echo bloginfo('wpurl') . '/wp-admin/images/fade-butt.png' ?>) repeat-x; | |
} | |
#ed_toolbar button:hover { | |
border: #aaa 1px solid; | |
background: #ddd; | |
} | |
/* toolbar button images in span */ | |
#ed_toolbar button span { | |
display: inline-block; | |
background: transparent no-repeat center center; | |
padding: 4px 2px; | |
width: 16px; | |
height: 16px; | |
} | |
/* toolbar custom button image */ | |
#_custom span { | |
background-image: url(<?php echo bloginfo('wpurl') ?>/wp-content/plugins/my-plugin-directory/my-plugin-icon.png); | |
} | |
</style> | |
<?php | |
add_action('admin_footer', 'my_plugin_add_button'); | |
function my_plugin_add_button(){ | |
echo <<<EOT | |
<script>/* <![CDATA[ */ | |
var j, n, | |
last = edButtons.length, | |
tbar = ''; | |
// add a new editor button as follows: | |
// edButtons[edButtons.length] = new edButton('BUTTON ID', 'BUTTON TEXT', 'OPENING TAG', 'CLOSING TAG', 'ACCESSKEY'); | |
// Example: edButtons[edButtons.length] = new edButton('_h1', 'H1', '<h1>', '</h1>', -1); | |
edButtons[edButtons.length] = new edButton('_h1', 'h1', '<h1>', '</h1>', "h"); | |
edButtons[edButtons.length] = new edButton('_h2', 'h2', '<h2>', '</h2>', -1); | |
edButtons[edButtons.length] = new edButton('_h3', 'h3', '<h3>', '</h3>', -1); | |
edButtons[edButtons.length] = new edButton('_h4', 'h4', '<h4>', '</h4>', -1); | |
edButtons[edButtons.length] = new edButton('_h5', 'h5', '<h5>', '</h5>', -1); | |
edButtons[edButtons.length] = new edButton('_h6', 'h6', '<h6>', '</h6>', -1); | |
edButtons[edButtons.length] = new edButton('_custom', '<button>', '[myplugin_short_code]', '', -1); | |
// Don't change anything below | |
// *************************** | |
for ( j = last; j < edButtons.length; j++) { | |
n = edButtons[j]; | |
if (/<button>/g.test(n.display)) { | |
// matched opening tag => add a button | |
tbar += '<button id="' + n.id + '" type="button" class="ed_button" onclick="edInsertTag(edCanvas, ' + j + ');"><span></span></button>'; | |
} else { | |
// add an input | |
tbar += '<input type="button" id="' + n.id + '" accesskey="' + n.access + '" class="ed_button" onclick="edInsertTag(edCanvas,' + j + ');" value="' + n.display.replace(/\"/g,'\"') + '" />'; | |
} | |
} | |
document.getElementById('ed_toolbar').innerHTML += tbar; | |
/* ]]> */</script> | |
EOT; | |
} | |
?> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment