Adding a CKEditor First-Party Plugin

With the Craft mod­ule set up, we are now ready to install our first CKEd­i­tor plu­g­in and get it working!

We’ll start with the high­light plu­g­in, a tool­bar item that allows us to high­light text in the CKEd­i­tor field. This plu­g­in is a first-par­ty plu­g­in, and ships with CKEd­i­tor, but is not imple­ment­ed in the Craft CMS ver­sion of CKEditor.

To enable it, we need to do the following:

1. Down­load a DLL-com­pat­i­blle ver­sion of the plu­g­in. This is a sin­gle JavaScript file that con­tains every­thing need­ed to run the plu­g­in. We can have Craft and CKEd­i­tor dynam­i­cal­ly include this file with­out the need to rebuild or recom­pile the CKed­i­tor appli­ca­tion. DLL stands for Dynam­ic Link Library. 
2. Add the down­loaded file to the mod­ule asset bun­dle dist directory.
3. Add the file name to the array of the $js property
4. Add the plu­g­in name to the array of the $pluginNames property
5. If the plu­g­in has a tool­bar item, add its name to the $toolbarItems property.

Final­ly, if the new plu­g­in has a tool­bar item, we should be able to see it in the CKEd­i­tor set­tings when we are build­ing our tool­bar configuration.