Adding Custom Functionality to the WordPress Visual Editor

The content editor is a key part of WordPress. It allows users to create and manage their content, galleries and videos, in a Visual WYSIWYG (what you see is what you get) view.

It also comes with a Text view, which allows users to insert or amend HTML within their content.

The WordPress Visual Editor is powered by the TinyMCE editor control, which provides the WYSIWYG view, as well as the formatting buttons you see:

Thanks to the TinyMCE API and WordPress’ filter hooks, we can add our own functionality to the WordPress Visual Editor. Specifically, we’ll look at how to create and register a custom TinyMCE Plugin which wraps selected text in a CSS class.

Creating the TinyMCE Plugin

In your WordPress website, create the wp-content/plugins/tinymce-custom-class folder.

We’ll store our plugin’s files here, so next create a file called tinymce-custom-class.php, using the following code:

Continue reading %Adding Custom Functionality to the WordPress Visual Editor%

by Tim Carr via SitePoint