[Fixed] CKEditor Style drop-down not working

Permalink
Edit: this is fixed in concrete5 8.2

I followed the instructions here:https://documentation.concrete5.org/tutorials/adding-ckeditor-custom...

I am using the following code:

public function getThemeEditorClasses()
{
   // Doc:https://documentation.concrete5.org/tutorials/adding-ckeditor-custom...
   return [
      [
         'title' => t('Card Title'),
         'element' => ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],
         'attributes' => ['class' => 'card-title']
      ],
      [
         'title' => t('Card Text'),
         'element' => ['p'],
         'attributes' => ['class' => 'card-text']
      ],
      [


But in CKEditor, it doesn't work. The Styles drop-down list is populated with the 4 styles, but clicking on them doesn't make any change to the selected text.

Also, strangely, the 4 styles are listed as "Inline Styles", not as "Block Styles" as I would have expected…

 
MrKDilkington replied on at Permalink Best Answer Reply
MrKDilkington
Hi jlgrall,

The tutorial for adding CKEditor custom editor styles requires concrete5 version 8.2. I have updated the tutorial with the version requirement.

Version 8.2 will be out very soon.

When using multiple elements, the style will be treated as an object style:
- Card Title will be an object style.
- Card Text, Card Link, and Side outline will be block styles.
machomaaan replied on at Permalink Reply
Hi.

And how to create custom styles for 8.1.0?

I need them very quickly or is there another temporary solution until update 8.2.0?

Thanks alot!
machomaaan replied on at Permalink Reply
Hi.

And how to create custom styles for 8.1.0?

I need them very quickly or is there another temporary solution until update 8.2.0?

Thanks alot!
blinkdesign replied on at Permalink Reply
blinkdesign

This website stores cookies on your computer. These cookies are used to improve your website experience and provide more personalized services to you, both on this website and through other media. To find out more about the cookies we use, see our Privacy Policy.