drop's picture

(This question was submitted by email, shared here to help others...)

The new hope for Drupal 7 enthusiasts is Backdrop CMS, there's now doubt about it.

But there are two features I have managed to embed into the Drupal 7 versions of CKEditor and these are

  1. changing font-size from px to em (visible as em in the dropdown menu)
  2. integrating line-height functionality into the button area of CKEditor, so that lineheight is just a number, say, 1.6 and an be chosen from a dropdown menu

These features help a lot when making a responsive site, as the lineheight and the fontsize an be specified for each viewport size but the relative sizes in the text remain the same. This is great if you have headlines in the text and set their fontsize  to 1.3 and the remaining text has the fontsize 1.0. If you then set the fontsize for a viewport with "@media (min-width: 320px)" at 14px you get headlines with a fontsize of 18px and the remaining text is 14px.

Here my question:
Is the there a recommended "Backdrop way" of implementing these two features in CKEditor or do I have to fall back on trial and error as I did with Drupal 7. (I also did this with Getsimple CMS but it was trial and error, too.)

 

Accepted answer

When using a Content Management System it is a best practice to set the font-size and line-height in the theme (and not in a rich-text editor) so that problems like you describe can be avoided.  If people need to use different sized text in the editor, we recommend defining a Style in CKeditor instead. This will wrap the text that needs to be styled in a span tag with a class, also allowing the font-size and line-height to be set and adjusted in the theme, where it can be properly adjusted for any breakpoint.

Comments

jenlampton's picture

When using a Content Management System it is a best practice to set the font-size and line-height in the theme (and not in a rich-text editor) so that problems like you describe can be avoided.  If people need to use different sized text in the editor, we recommend defining a Style in CKeditor instead. This will wrap the text that needs to be styled in a span tag with a class, also allowing the font-size and line-height to be set and adjusted in the theme, where it can be properly adjusted for any breakpoint.