CK Editor bug

[Jennifer Stock]

Hi. Sometimes when I select text in a textarea field outfitted with CK Editor, it fails to register as a "Block Style" and therefore the custom styles I have specified for block-level elements are not displayed in the Styles drop-down menu. If I open the page in an incognito window and select the same elements, the Block Style styles appear as expected in the Styles menu.

Is this a caching issue of some kind? I've played with turning on and off the HTML "quality assurance" options as well as putting my custom styles directly within the CKEditor folder in the /wire directory. Once the field stops registering the selection of block-level elements, it also seems to have simultaneously stripped the custom styles that had been successfully applied to these block-level elements previously.

Not sure what to do next.

[mdaniel]

Hi, I don't know if this will help you, but recently I also had a CKEDitor problem (PW v: 3.0.165, browsers (64bit): Firefox v: 80.0.1 Chrome v: 85.0.4183.102) and searching solution for my problem I played with CKEditor and using the setting below I didn't experienced the reported problem. My Block Style settings:

{ name: 'Blue Title', element: 'h2', styles: { 'color': 'Blue' } },
{ name: 'Red Title' , element: 'h3', styles: { 'color': 'Red' } }

which I appended to wire/modules/Inputfield/InputfieldCKEditor/mystyles.js:

/**
 * mystyles.js
 *
 * This file may be used when you have "Styles" as one of the items in your toolbar.
 *
 * For a more comprehensive example, see the file ./ckeditor-[version]/styles.js
 *
 */
CKEDITOR.stylesSet.add( 'mystyles', [
 { name: 'Inline Code', element: 'code' },
 { name: 'Inline Quotation', element: 'q' },
 { name: 'Left Aligned Photo', element: 'img', attributes: { 'class': 'align_left' } },
 { name: 'Right Aligned Photo', element: 'img', attributes: { 'class': 'align_right' } },
 { name: 'Centered Photo', element: 'img', attributes: { 'class': 'align_center' } },
 { name: 'Small', element: 'small' },
 { name: 'Deleted Text', element: 'del' },
 { name: 'Inserted Text', element: 'ins' },
 { name: 'Cited Work', element: 'cite' },
 { name: 'Blue Title', element: 'h2', styles: { 'color': 'Blue' } },
 { name: 'Red Title' , element: 'h3', styles: { 'color': 'Red' } }

] );

Useful link about CKEditor settings:  talk/topic/17862-share-your-ckeditor-settings/?tab=comments#comment-156594