ckeditor
CKEditor requires a text style in order for the styles dropdown to work
Reproduction steps
Craft CMS version 5.5.5, CKEditor version 4.4.0
- CKEditor is already installed and working properly.
- Add the styles dropdown to an existing CKEditor config
- Remove the default "Marker" style from the definitions array
{"name":"Marker", "element": "span", "classes": ["marker"]}` - Save the config and try to edit a CKEditor field
- The Styles dropdown is grayed out and does not open to allow the user to add styles that are specified in the config.
It appears the Styles needs a text style type in order to work correctly. CKEditor is grouping these automatically based on the docs.
Current behavior
The styles dropdown is grayed out and not clickable if a text style type is not added to the definitions array
Broken state
"definitions": [ { "classes": [ "red-heading" ], "element": "h2", "name": "Red heading" }, { "classes": [ "vibrant-code" ], "element": "pre", "name": "Vibrant code" } ]
Expected behavior
The dropdown is usable regardless of what type of custom styles are defined, as long as the json is valid.
Working state:
"definitions": [ { "classes": [ "marker" ], "element": "span", "name": "Marker" }, { "classes": [ "red-heading" ], "element": "h2", "name": "Red heading" }, { "classes": [ "vibrant-code" ], "element": "pre", "name": "Vibrant code" } ]
Definition of Done
- Please leave this field for us. We will fill it during the backlog refinement session.
Relevant debug data
Other details
No response
User agent
Chrome Version 131.0.6778.86 (Official Build) (arm64)
There has been no activity on this issue for the past year. We've marked it as stale and will close it in 30 days. We understand it may still be relevant, so if you're interested in the solution, leave a comment or reaction under this issue.
