TinyMCE plugins

This feature has been marked as deprecated since Moodle 4.1

Warning: This page is no longer in use. The information contained on the page should NOT be seen as relevant or reliable.

Moodle 2.4 This page describes custom Moodle plugins for TinyMCE implemented in MDL-34875.

Overview

Moodle 2.4 contains a slightly modified TinyMCE, the only difference from upstream version is different language file loading. All language strings are loaded only from moodle language packs.

Directory

/lib/editor/tinymce/plugins/

contains Moodle specific TinyMCE plugins. It supports all standard Moodle plugin features. Static files (JS, CSS, images) are loaded via PHP loader, this prevents caching problems and performs minifying, improving performance, hence we don't provide minified versions but only the source files (without "src" in their names, see existing plugins) . Original JavaScript based localisation files are not supported.

Subplugin directory structure

/db/*

Installation, upgrades, events, etc. It is not recommended to use database tables in these plugins.

/lang/yourplugin/tinymce_yourplugin.php

Language strings. All strings used from TinyMCE JavaScript files must start with

"yourplugin:*"

prefix.

/tinymce/editor_plugin.js

The actual TinyMCE plugin code.

/tinymce/*

Static files used from plugin code. Use

tinyMCE.baseURL

for links pointing to upstream TinyMCE code. Use

ed.getParam("moodle_plugin_base")

when referencing non-static plugin files.

/lib.php

Moodle plugin code, it has to contain at least

tinymce_yourplugin

class with

update_init_params()

method.

/settings.php

Moodle plugin settings (optional).

/version.php

Moodle plugin version (required).

/*

Other PHP scripts used by plugin.

editor_tinymce_plugin base class

This class is responsible for integration of plugins into the TinyMCE instance. It is usually enough to override method

update_init_params()

and describe available buttons.

Example: Installing Non Moodle-Specific Tiny MCE Plugins

I was having some difficulty doing this, so I wanted to contribute a walk through. If this isnt an appropriate place, please move it (and let me know).

So the plugin in question is the Image Mapping Plugin. The default instructions are rendered totally useless (and very confusing), This will likely be the case for many non moodle plugins. The plugin will come as a zip which should be extracted to ...moodle/lib/editor/tinymce/tiny_mce/version/plugins/imgmap (or the name of your plugin).

Once in this directory, navigate to editor_plugin.js and find the name of the button you should add to your editor (in this case imgmap). Mine was in the following line of code: ed.addbutton('imgmap', {...

Once this is done, go back to the root TINYMCE directory (moodle/lib/editor/tinymce) and find lib.php. This is where you need to add your newly added plugin to the params array (plugin array)so it is initialized. look for 'return $params' in this code, it will likely appear between line 200 & 300. Before the return, add the following bit of code:

		//added for imgmap plugin
		if (isset($options['maxfiles']) and $options['maxfiles'] != 0) {
			$params['plugins'] .= ',imgmap';
			$params['theme_advanced_buttons3'] .=',imgmap';

This will initialise the plugin but will not add any functionality just yet (there is no button etc). I do this through moodle frontend, but there will also be a backend route. All I do is go to site admin > plugins > text editors > tinymce (general settings). Under the plugins table (where mine still doesnt appear oddly enough, there is an editor toolbar box. In this you can simply add the button name you found in that .js file earlier. It is usually fairly easy, Image map is imgmap for instance.

Image Map also wanted me to add some additional code, this is likely the case with other plugins also, my code was:

extended_valid_elements: "img[usemap|class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],map[id|name],area[shape|alt|coords|href|target]",

This can simply go into the custom code bit at the bottom of the frontend interface. Whether this is totally necessary or not, I dont know.