Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save edutrul/448a117c830397c4b47076100121f78e to your computer and use it in GitHub Desktop.
Save edutrul/448a117c830397c4b47076100121f78e to your computer and use it in GitHub Desktop.
How to add a custom class to ckeditor in drupal8
  1. Open format editor of your preference admin/config/content/formats/manage/basic_html
  2. Add styles BUTTON (Drag and drop)
  3. A new tab will be created "Styles Dropdown"
  4. Click on "Styles Dropdown" tab
  5. Add ul.two-column--list|Two column list
  6. (HIGHLY IMPORTANT) if you have have "Limit allowed HTML tags and correct faulty HTML" then Make sure
      is added, IF NOT PLEASE add it.
    • Save it!
    • Add ul.two-column--list { columns: 2; } in your current theme. Ckeditor automatically will find it.
    • Now create a content and locate on a textarea formatter field
    • Make sure it is the correct formatter(choose or check out default formatter for that field) (important)
    • Now create some text and wrapp it with UL by using UL UI of ckeditor
    • Make sure you highlight all UL content then styles button will be enabled and you can click on it and will see "Two column list"
    • Choose "Two column list"
    • Save content
    • You'll see that content wrapped in UL is applied correctly in two columns. Congratulations!
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment