Support » Plugins » Add a button to TinyMCE with popup dialog box?

  • I need to add a button to my tinymce editor for my theme that will insert a shortcode. The shortcode has 5 options, and I know that the person that I am building the theme for won’t remember them all. So I want to be able to have a dialog box popup (similar to the link button dialog) that’ll allow her to fill out a form that will auto insert the full shortcode. How Do I do this?

    (function() {
    tinymce.create('tinymce.plugins.BrettsYouTube', {
    init : function(ed, url) {
    ed.addButton('brettsyoutube', {
    title : '',
    image : url+'/youtube.png',
    onclick : function() {
    idPattern = /(?:(?:[^v]+)+v.)?([^&=]{11})(?=&|$)/;

    //I want to replace this with the dialog
    var vidId = prompt("YouTube Video", "Enter the id or url for your video");

    var m = idPattern.exec(vidId);
    if (m != null && m != 'undefined')
    ed.execCommand('mceInsertContent', false, '[youtube id="'+m[1]+'"]');
    createControl : function(n, cm) {
    return null;
    getInfo : function() {
    return {
    longname : "Brett's YouTube Shortcode",
    author : 'Brett Terpstra',
    authorurl : '',
    infourl : '',
    version : "1.0"
    tinymce.PluginManager.add('brettsyoutube', tinymce.plugins.BrettsYouTube);

  • The topic ‘Add a button to TinyMCE with popup dialog box?’ is closed to new replies.