A plugin that lets you insert FontAwesome icons via TinyMCE. Currently uses FontAwesome v4.7.0 and is tested on TinyMCE v4.4.2.
- Make sure you have FontAwesome loaded on the page that contains TinyMCE.
- Copy the
fontawesome
folder from this repository into your TinyMCE plugins folder. - Add this to your TinyMCE script:
tinymce.init({
...
content_css: 'https://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css',
noneditable_noneditable_class: 'fa',
plugins: 'fontawesome noneditable',
toolbar: 'fontawesome',
extended_valid_elements: 'span[*]'
});
Note: I'm not sure how to do add noneditable_noneditable_class: 'fa'
to tinymce.init()
in Joomla. I had a quick look but I couldn't see a way. Perhaps the Joomla TinyMCE plugin needs to be modified to include this option.
- Make sure you have FontAwesome loaded on the page that contains TinyMCE. If you don't add
http://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css
directly to the template or use this plugin to add it. - Copy the
fontawesome
folder from this repository into/media/editors/tinymce/plugins/
. - Go to Joomla admin panel. In the top menu choose "Extensions" > "Plugins". Search for
Editor - TinyMCE
and then click on the result.- Change "Functionality" to
Advanced
. - In the "Custom CSS Classes" field add
https://netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css
. - In the "Extended Valid Elements" field add
span[*]
. - Go to the "Advanced" tab.
- In the "Custom Plugin" field add
fontawesome noneditable
. - In the "Custom Button" field add
fontawesome
. - Add
noneditable_noneditable_class: 'fa'
totinymce.init()
. Not sure how to do this. - Save the plugin.
- Change "Functionality" to
If you find a bug or you want a feature added please create an issue. However there is no guarantee that I will work on issues as I don't have much spare time. If you create a pull request I will probably accept it.