Using the TinyMCE template plugin in Drupal
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:
- In your TinyMCE module directory, find the plugin_reg.php file and add the following lines just before the return $plugins; line.
- Enable the template plugin for the relevant users in your TinyMCE configuration (Site Configuration > TinyMCE).
- 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. - Create .htm files for each of your templates with the contents:
<!-- This will not be inserted -->
<div class="mceTmpl">
<!-- insert template content here -->
</div>
- Save and upload all the files.
You should notice a little template button (
) 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
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.
Comments
I've always wanted to do
I've always wanted to do this, thanks.
"Create a directory called templates in the root of your site..."
Why not add the template folder in the same place as your themes and modules - in sites/all?
I didn't do this because I
I didn't do this because I wanted to keep it nice and simple for my site, but it will work anywhere. I'll modify the post now.
Sounds mighty useful. Could
Sounds mighty useful.
Could you please consider sharing a screenshot of how this ends up looking like at the point of data entry? I got the idea, but am unable to visualize what you are doing this for.
Great Idea
I've updated the post now with a screenshot of what it looks like when inserting the template.
Nice trick, thanks. Is there
Nice trick, thanks.
Is there any way to incorporate such feature direct in drupal theme?
Hmm, good question. It might
Hmm, good question. It might be possible by overriding the theme_tinymce_theme theme function in the template.php file as per the README.TXT file in the tinymce module.
I haven't tested this but it might work:
function phptemplate_tinymce_theme($init, $textarea_name, $theme_name, $is_running) {
switch ($textarea_name) {
// Disable tinymce for these textareas
case 'log': // book and page log
case 'img_assist_pages':
case 'caption': // signature
case 'pages':
case 'access_pages': //TinyMCE profile settings.
case 'user_mail_welcome_body': // user config settings
case 'user_mail_approval_body': // user config settings
case 'user_mail_pass_body': // user config settings
case 'synonyms': // taxonomy terms
case 'description': // taxonomy terms
unset($init);
break;
// Force the 'simple' theme for some of the smaller textareas.
case 'signature':
case 'site_mission':
case 'site_footer':
case 'site_offline_message':
case 'page_help':
case 'user_registration_help':
case 'user_picture_guidelines':
$init['theme'] = 'simple';
foreach ($init as $k => $v) {
if (strstr($k, 'theme_advanced_')) unset($init[$k]);
}
break;
}
/* Example, add some extra features when using the advanced theme. */
// If $init is available, we can extend it
if (isset($init)) {
switch ($theme_name) {
case 'advanced':
$init['plugins'] = array('template');
$init['template_external_list_url'] = array("/templates/templates.js");
break;
}
}
// Always return $init
return $init;
}
?>
about tinymce
After success full configuration in drupal I am not able to use Tinymce in my drupal.Any help is needed.
I'm not really sure whether
I'm not really sure whether I can help because I don't really know what sort of trouble you're having.
Have you read the TinyMCE documentation here ?
path problems with drupal tinyMCE template ?
i'm sort of new to the whole drupal thing, though i've done lots of custom web programming and your plugin solution is fantastic. however, i've tried lots of configs including yours but kept getting ....
-- warning: Invalid argument supplied for foreach() in /home/waterfr1/public_html/modules/tinymce/tinymce.module on line 546. --
which, upon inspection, is an add of buttons in the main mod.
i'm thinking it's a path issue but have tried every combination and it's no use.
any help would be fantastic.
thanks in advance,
jeff
Hi Jeff, I've never seen
Hi Jeff,
I've never seen that problem before. I would assume that it's a problem with your plugin_reg.php file and the _tinymce_plugins() function inside that not returning a proper array.
Was it producing this error when you first installed TinyMCE (without making any modifications to that file)?
Nick
Similar Problem
Thanks for the article. I do have to commiserate with a few of my fellow commenters, however. I'm having the same issue. The template plugin works for me, but I get the following error twice, and only when I have the three configuration lines from your article enabled:
* warning: Invalid argument supplied for foreach() in /Applications/xampp/xamppfiles/htdocs/cfb/sites/all/modules/tinymce/tinymce.module on line 546.
* warning: Invalid argument supplied for foreach() in /Applications/xampp/xamppfiles/htdocs/cfb/sites/all/modules/tinymce/tinymce.module on line 546.
Any insight?
Hi Steven, I'll have another
Hi Steven,
I'll have another look this weekend and see if I can work out what is going on.
Same Error: Solution?
$plugins['template'] = array();
$plugins['template']['theme_advanced_buttons3'] = array('template');
$plugins['template']['template_external_list_url'] = array(0=>"/templates/templates.js");
Note the third line is an array instead of
$plugins['template']['template_external_list_url'] = 0=>"templates/templates.js";
which has the last line not as an array.
I *think* this is the problem.
Thanks for the instructions!
template_external_list_url is an array...
I got this to work with:
$plugins['template']['template_external_list_url'] = array('/files/templates/templates.js');
Other plugin variables are passed this way as well. See the line for the Font Plugin in plugin_reg.php:
$plugins['font']['extended_valid_elements'] = array('font[face|size|color|style],span[class|align|style]');
Thanks for the great tutorial. Just what I was looking for.
Hey, great tutorial! I
Hey,
great tutorial! I checked it out myself and it returned the same error of an invalid argument on tinymce.module on line 546. Did you manage to think of a solution to this problem? I'm also assuming this tutorial is for a drupal 5x installation.
Thoughts?
Thanks alot!
-Cameron
Thanks guys for the
Thanks guys for the comments. I have updated the post now with S Gifford's code so that it doesn't generate the PHP error.
Above fix works for me
Thanks for the great tutorial, the above fix, http://www.schoonzie.com/using-tinymce-template-plugin-drupal#comment-35
works for me, no problem.
I got foreach error like most others here, putting it into the array as suggested smoothed it out, works perfectly!
template woes
Hi, I was wondering if you would be so kind as to share one of your templates with us.
I have a couple of odd issues...
1) TinyMCE inserting my template twice. Solved by adding the comments to the template, i.e.
div class="mceTmpl"
!-- mceTmplBegins --
div id="Tmplcontainer"
div id="Tmplcontent" Sample /div
/div
div id="Tmplsidebar" Sample /div
!-- mceTmplEnds --
/div
The "Sample" placeholder text is for another issue - even if I set a min-height on the divs e.g 100px (the divs appear 100px high in the editor), but TinyMCE thinks they are empty and collapses them, so its nigh on impossible to get the cursor where its needed... the placeholder text solves that dilemma.
Sorry about the weird looking code, but your input filter was stripping out the DIV tags and comments.
2) When using a pure CSS / DIV layout hitting the return key for a new paragraph generates a new DIV container of the same name as the containting DIV! Mad...
Only workaround I have found so far is to use a table to wrap it all up, which seems to work fine.
Have you used pure CSS layouts for your templates? If so, sure like to hear how you got them working.
Hi Jeff, Thanks for the
Hi Jeff,
Thanks for the comment. One of the templates that I use is
<!-- This will not be inserted -->
<div class="mceTmpl">
<div class="image_caption">
<img src="/files/ZeroRC-feedburner.jpg" /><br />
Sample Caption
</div>
</div>
It appears as you see in the screenshot in the post, so I can't really help with the problem you are having. If you like I'd be happy to take a look - send me an email via the contact form with your details.
Found two good games Dollar
Found two good games Dollar (wow gold) deal! (wow gold) Are cheap! Blue is very good, you may wish to enter the site to its own needs of the trading game coin! (wow gold) Is also available in Dailian game! (wow power leveling)This station is also available wow power levelingwow powerleveling wow power leveling buy rolexof World of Warcraft gold
Post new comment