Best Practices WYSIWYG (with inline image handling) @jenlampton | - PowerPoint PPT Presentation

22 August 2012 Best Practices WYSIWYG (with inline image handling) @jenlampton | http://www.jenlampton.com Wednesday, August 22, 2012

I AM @jenlampton I have been using Drupal since D4.7 I build Drupal sites for other people I consider myself a developer Wednesday, August 22, 2012

I AM @jenlampton I have been using Drupal since D4.7 I build Drupal sites for other people I consider myself a developer I HATE WYSIWYG EDITORS Wednesday, August 22, 2012

THERE’S A LOT TO COVER • Drupal’s Text Formats ( Filtered HTML, Full HTML, etc ) • Drupal’s Filters - PHP ( line break, link, etc ) • WYSIWYG editors - JS ( TinyMCE, CKEditor, etc ) • A whole lot of configurations Wednesday, August 22, 2012

CONTRIB MODULES • WYSIWYG API ( http://drupal.org/project/wysiwyg ) • Better Formats ( http://drupal.org/project/better_formats ) • IMCE ( http://drupal.org/project/imce ) • IMCE Wysiwyg API Bridge ( http://drupal.org/project/imce_wysiwyg ) • Insert ( http://drupal.org/project/insert ) • Caption Filter ( http://drupal.org/project/caption_filter ) Wednesday, August 22, 2012

IF THERE’S TIME • Image Resize Filter ( http://drupal.org/project/image_resize_filter ) • Filefield Sources ( http://drupal.org/project/filefield_sources ) • WYSIWYG filter ( http://drupal.org/project/wysiwyg_filter ) NOT COVERED • WYSIWYG fields ( http://drupal.org/project/wysiwyg_fields ) • EPSA Crop ( http://drupal.org/project/epsacrop ) • Other awesome WYSIWYG modules • Media ( http://drupal.org/project/media )* • ALOHA ( http://drupal.org/project/aloha )** Wednesday, August 22, 2012

DEMO (MY CODE) • Drupal 7 ( the same principles apply to Drupal 6, but probably not to Drupal 8 )* • Admin Menu module ( http://drupal.org/project/admin_menu ) • Custom sub-theme of Bartik ( adds a style sheet: https://github.com/jenlampton/wysiwyg_theme ) Wednesday, August 22, 2012

DEMO (MY CONFIG) Users • A new role called ‘editor’ • A new user called ‘editor’ in the editor role • Permissions set accordingly for editors Content • Added an ‘inline images’ field to the Page type ( field set to ‘hidden’ under display settings ) • New content type ‘Icon‘ ( inline images field aded, upload destination set to images/icons ) Wednesday, August 22, 2012

LET’S GO! Wednesday, August 22, 2012

http://bit.ly/RbedXc BEST PRACTICES WYSIWYG @jenlampton | http://www.jenlampton.com Wednesday, August 22, 2012

photo credits: DrupalCon Munich Slide Deck: http://munich2012.drupal.org/speakers/speaker-resources Angry face: http://www.last.fm/group/I+hate+shared+scrobblings+and+profles+of+artists Wednesday, August 22, 2012