Inline elements with CKEditor

DrupalCamp Berlin, November 2014

About me• Yuriy Gerasimov• Developer & Drupal Architect• @ygerasimov

Rich inline elements●

Problems● editors want to add rich elements in WYSIWYG● developers would like editors not to break the site

Give editors HTML example to edit?●

●

●

Drupal 7 solutions● Media module● Scald● Asset● Bean WYSIWYG

Media• file entities• embedded as tokens

Scald● media atoms● embedded as html

Asset• embedded as html• plugins

Bean WYSIWYG• use fieldable beans• embed tokens

[block_insert]1[/block_insert]

CKEditor widgets• predefined template • inline editing • draggable

Widget plugin drupal• drupal module with wysiwyg plugin• http://docs.ckeditor.com/#!/guide/widget_sdk_intro• https://github.com/ygerasimov/drupal_wysiwyg_widget• https://www.drupal.org/node/2367441

Enable plugin

CKEditor tutorial

WYSIWYG plugin

WYSIWYG js

Works!

Questions?