I would like to add custom styles to ckeditor. There is a button for that, but cannot get my styles listed. I managed to add the js with the new styles, with backdrop_add_js() function (instructions here: https://ckeditor.com/docs/ckeditor4/latest/features/styles.html).
But then I need to add those styles to the config file of ckeditor, as stated here: https://ckeditor.com/docs/ckeditor4/latest/guide/dev_configuration.html#.... I'm unable to do this last step. Any ideas?
Thanks.
Robert, are you using a custom theme or sub-theme? If so be sure to add
ckeditor_stylesheets[] = css/ckeditor-iframe.css
to the .info file of the theme. See the documentation for this in this page
Robert, when you add the Styles dropdown to the editor, it should also reveal a new textarea field in the UI:
With this, you can specify the classes and labels for the Styles dropdown:
A list of classes that will be provided in the "Styles" dropdown. Enter one class on each line in the format: element.class|Label. Example: h1.title|Title.
Each style should be in your theme's main CSS as well as in your theme's ckeditor-iframe.css file.
Thanks Laryn!!
I can't get my theme's ckeditor-iframe.css file loaded. I have it in my theme directory as well as set in the .info file, but I cannot see the style applied to the textarea.
Robert, are you using a custom theme or sub-theme? If so be sure to add
ckeditor_stylesheets[] = css/ckeditor-iframe.css
to the .info file of the theme. See the documentation for this in this page
Thanks, Argiepiano. That was the problem. I was setting my ckeditor-iframe.css as a normal css (stylesheets[all][] =).
Also see the discussion here, which may expand a bit how to do this.
Robert, when you add the Styles dropdown to the editor, it should also reveal a new textarea field in the UI:
With this, you can specify the classes and labels for the Styles dropdown: