Font Awesome 5 (Pro and Free)

Font Awesome 5 Icons plugin for CKeditor 4. Includes all the icons of Font awesome 5.13.0

Now supports the pro and free edition. When you uses an older version you can give the version number in de configs and the icons which are not present in this version wil not be shown.

Installation:

  • Add the fontawesome5 directory in the plugins folder of CKeditor 4.
  • Add 'fontawesome5' item to your toolbar
  • Add 'fontawesome5' item to your extra plugins
  • Configure the fontawesome settings in: config.fontawesome : { }
  • config.allowedContent = true;
  • $removeEmpty['span'] = false; Thats it.

Config options:
config.fontawesome : {

'path': 'path-to-you-all.css-file',
'version': '5.13.0',
'edition': 'pro', (default: pro, options: free,pro)
'element': 'span' (default span, options, all html elements such as i,div,span,a,p, etc..)

}

When you use an other element, don't forget to use $removeEmpty for the element.

Example:

  • config.toolbar = [['Source', '-', 'NewPage', '-', 'Templates','fontawesome5']];
  • config.extraPlugins = 'fontawesome5';
  • config.fontawesome = { 'path':'/path/to/your/font-awesome-5/all.css', 'version':'5.13.0', 'edition':'pro', 'element':'i' };
  • CKEDITOR.replace(editorname, config);
  • CKEDITOR.dtd.$removeEmpty['i'] = false;

For the latest version, go to my github:

https://github.com/daanwilson/cke-fontawesome5

Like the plugin? Please by me a beer

 

Screenshots

fontawesome5

4,851 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.1.3

DownloadRelease notes

Stylesheet modification for icons presentation

Twitter Facebook Facebook Instagram Medium Linkedin GitHub Arrow down Phone Menu Close icon Check