Using the TinyMCE template plugin in Drupal

311 comments

On my RC news blog there are quite a few elements that are used on a regular basis in news posts (eg specifications tables, etc). It's a major pain in the ass recreating these elements again and again, and now that I've got a few other writers on board, it's getting hard to keep everything consistent.

Tonight I decided to create about half a dozen small template snippets that would be used as the framework for these elements and allow the writers to just fill in the blanks. To pull it all together and make it easy to use, I used TinyMCE's template plugin to load the templates straight into the text editor.

It's a breeze to setup, here's how:

  1. In your TinyMCE module directory, find the plugin_reg.php file and add the following lines just before the return $plugins; line.
    $plugins['template'] = array();
    $plugins['template']['theme_advanced_buttons3'] = array('template');
    $plugins['template']['template_external_list_url'] = array(0=>"/templates/templates.js");
                   
  2. Enable the template plugin for the relevant users in your TinyMCE configuration (Site Configuration > TinyMCE).
  3. Create a directory called templates in the root of your site (or wherever you like, just remember to change the code in step 1) and create a file called templates.js with the contents:
    var tinyMCETemplateList = [
            // Name, URL, Description
            ["Specifications Table", "/templates/specifications.htm", "Creates a specification table"],
    ];             

    Create as many templates as you like, one line for each.
  4. Create .htm files for each of your templates with the contents:
            <!-- This will not be inserted -->
    <div class="mceTmpl">
            <!-- insert template content here -->
    </div>
                   
  5. Save and upload all the files.

You should notice a little template button (Template Icon) in your TinyMCE editor, which will load all the templates you specified in the templates.js file.

And here is how it will look when inserting the templates

TinyMCE Templates

NOTE: When you upgrade TinyMCE, be sure not to replace your modified plugin_reg.php.

Got any other TinyMCE tips or tricks to help make editing your posts better?

Update: Fixed a problem in the code producing the Invalid argument supplied for foreach() php error - Thanks to S Gifford for the solution.