Skip to content

Instantly share code, notes, and snippets.

@vihoangson
Last active October 25, 2018 14:03
Show Gist options
  • Select an option

  • Save vihoangson/6a886db7a90b1c90d560 to your computer and use it in GitHub Desktop.

Select an option

Save vihoangson/6a886db7a90b1c90d560 to your computer and use it in GitHub Desktop.
Make button shortcode for wordpress
<?php
// init process for registering our button
add_action('init', 'wpse72394_shortcode_button_init');
function wpse72394_shortcode_button_init() {
//Abort early if the user will never see TinyMCE
if ( ! current_user_can('edit_posts') && ! current_user_can('edit_pages') && get_user_option('rich_editing') == 'true')
return;
//Add a callback to regiser our tinymce plugin
add_filter("mce_external_plugins", "wpse72394_register_tinymce_plugin");
// Add a callback to add our button to the TinyMCE toolbar
add_filter('mce_buttons', 'wpse72394_add_tinymce_button');
}
//This callback registers our plug-in
function wpse72394_register_tinymce_plugin($plugin_array) {
$plugin_array['wpse72394_button'] = '/wp-content/themes/minn-lite/shortcode.js';
return $plugin_array;
}
//This callback adds our button to the toolbar
function wpse72394_add_tinymce_button($buttons) {
//Add the button ID to the $button array
$buttons[] = "wpse72394_button";
return $buttons;
}
?>
jQuery(document).ready(function($) {
tinymce.create('tinymce.plugins.wpse72394_plugin', {
init : function(ed, url) {
// Register command for when button is clicked
ed.addCommand('wpse72394_insert_shortcode', function() {
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[shortcode]'+selected+'[/shortcode]';
}else{
content = '[shortcode]';
}
tinymce.execCommand('mceInsertContent', false, content);
});
// Register buttons - trigger above command when clicked
ed.addButton('wpse72394_button', {title : 'Insert shortcode', cmd : 'wpse72394_insert_shortcode', image: '/wp-content/themes/minn-lite/shortcode.png' });
},
});
// Register our TinyMCE plugin
// first parameter is the button ID1
// second parameter must match the first parameter of the tinymce.create() function above
tinymce.PluginManager.add('wpse72394_button', tinymce.plugins.wpse72394_plugin);
});
@vihoangson
Copy link
Author

Preview

@gordonlangley
Copy link

Hello - this is fantastic and I have it working. Is there a version of this code where I can make an array of buttons, without duplicating all the code, which is what I've done to get two buttons?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment