Problem/Motivation

In CKEditor 4 if I put a style in the styles field like a.my-style then I could only apply that style to <a> tags. In CKEditor 5 I can apply a text style to any element even if I've specified a tag in the styles field.

This appears to work in the demo on CKEditor.com so this is something that might need to be fixed in the module.

Steps to reproduce

Add a style like a.my-style to the styles field and then attempt to add it to regular/non-link text using the Styles dropdown.

Proposed resolution

TBD

Remaining tasks

TBD

User interface changes

Theoretically there should be no UI changes.

API changes

TBD

Data model changes

TBD

Release notes snippet

TBD

Comments

jds1 created an issue. See original summary.

ericras’s picture

ericras commented
Version: 9.5.x-dev » 10.1.x-dev
Issue tags: +ckeditor5

I don't think there is an issue with Drupal. I think this is a limitation with CKEditor5 itself.

In Drupal and on the CKEditor demo page, it works with block level elements ("Block styles") as you would expect. If you set a rule for blockquote.my-style|My Blockquote Style it will only be allowed on blockquote elements.

However, with "Text styles" it allows them anywhere AND it creates the element where it didn't exist before. On the CKEditor demo https://ckeditor.com/docs/ckeditor5/latest/features/style.html they have a rule span.spoiler|Spoiler which can be added anywhere, not just to existing span elements, and it will create the span tag. It works the same way with an "a" tag rule: it can be created anywhere and the "a" tag will be added. This is unfortunate.

Related issue:
https://github.com/ckeditor/ckeditor5/issues/11709
https://www.drupal.org/project/drupal/issues/3222797#comment-14505686

chrissnyder’s picture

chrissnyder
he/him
commented

I created ckeditor_link_styles to overcome this limitation of CKEditor's style dropdown. It uses CKEditor 5 Link plugin's decorator config instead.

wim leers’s picture

wim leers
Location Ghent 🇧🇪🇪🇺
commented
Status: Active » Closed (duplicate)
Related issues: +#3326261: [Style] Add tests for inability to apply styles to <div>, <ul>, <ol>, <table> etc. in CKEditor 5 — and <a> allows applying it to all elements

This is a duplicate of #3326261 — see #3326261-14: [Style] Add tests for inability to apply styles to <div>, <ul>, <ol>, <table> etc. in CKEditor 5 — and <a> allows applying it to all elements. I will credit you all on that issue 😊👍