craftcms / ckeditor

Edit rich text content in Craft CMS using CKEditor.
https://plugins.craftcms.com/ckeditor
GNU General Public License v3.0
47 stars 24 forks source link

Custom heading options classes being stripped on save unless style definitions exist #91

Closed TheFunkyMonk closed 1 year ago

TheFunkyMonk commented 1 year ago

Description

Using a custom config, if I set a custom heading option ("subtitle" in this example), the view class I set is being stripped on entry save. Disabling or enabling the "Purity HTML" option on the field has no effect.

https://user-images.githubusercontent.com/1728770/234957441-61147d30-a302-4448-9126-6e9e1e522b3b.mp4

Oddly, if I create a style definition and add the style selection option to the toolbar, the classes persist on save as expected (for both the heading option alone, and a paragraph set to the subtitle style.

https://user-images.githubusercontent.com/1728770/234958687-631d622f-ca03-4dea-8f7d-e28efa4f76fd.mp4

Config is as follows:

return {
    heading: {
        options: [
            {
                model: 'subtitle',
                view: {
                    name: 'p',
                    classes: 'ck-heading_subtitle'
                },
                title: 'Subtitle',
                class: 'ck-heading_subtitle'
            },
            { model: 'heading1', view: 'h1', title: 'Large Heading', class: 'ck-heading_heading1' },
            { model: 'heading2', view: 'h2', title: 'Small Heading', class: 'ck-heading_heading2' },
            { model: 'paragraph', view: 'p', title: 'Paragraph', class: 'ck-heading_paragraph' },
        ]
    },
    style: {
        definitions: [
            {
                name: 'Subtitle',
                element: 'p',
                classes: [ 'ck-heading_subtitle' ]
            },
        ],
    }
}

I would like Subtitle to be a heading option, not a styling option, but have its class persist on save. Am I misunderstanding how to configure CKeditor, or is this a bug?

Steps to reproduce

  1. Create a custom heading option with a view object containing classes
  2. Apply heading option in rich text editor field and save

Additional info

brandonkelly commented 1 year ago

I don’t think it was intended that you could specify a class name within your heading options. The Heading dropdown is really only meant to be used to specify a heading level (or paragraph), not any additional styling. That’s why we’ve simplified the UI of customizing it, via the “Heading Levels” CKEditor config setting.

All styling of those elements is supposed to be done via the Styles dropdown.

You can request that Heading be expanded to support custom classes over at https://github.com/ckeditor/ckeditor5/issues.