Provide users a WYSIWYG editor with image support in Drupal

So you want to know how to allow a client or staff member to edit HTML content via a WYSIWYG editor w/ integrated and easy to use image support? We do this with Wysiwyg API, IMCE & IMCE Wysiwyg API bridge modules. The IMCE Wysiwyg API bridge module is a support module to bridge between IMCE image upload/browsing capability and Wysiwyg editors, so have them both installed and working first. Following are my quick notes to provide Drupal users a WYSIWYG editor with image support:

  1. Install and configure IMCE module & Wysiwyg API module
  2. read the imce_wysiwyg/README.txt
  3. Install IMCE Wysiwyg API bridge module
  4. configure:
    • Home > Administer > User management > Roles >
      • create a role, "HTML editor", that will use the WYSIWYG editor and IMCE image browser
    • Home > Administer > Site configuration > Input formats >
      • Create an input format, "HTML editor"
      • Under Roles: choose the role created in the last step
    • Home > Administer > Site configuration > IMCE >
      • create an "HTML editor" profile
      • set its configurations
      • set directory to only access "html" or whatever directory you would like
    • Home > Administer > Site configuration > Wysiwyg >
      • edit appropriate profile for FCKeditor or TinyMCE & add both Image & IMCE buttons
    • Home > Administer > User management > Permissions >
      • allow the role you created access to edit/delete/create appropriate content

Note: how to limit which fields editor is available for, limit input type by field?

Comments

You can have the wysiwig editor use your style sheet when editing for a true wysiwyg experience, by setting the path to your stylesheet in the wysiwig setup. I use css-injector to speed most of my styling and have found that you can wildcard all created css files with this path: %b%t/../files/css_injector_*.css

I agree that IMCE does not have a great UX, but I think it is still the best option. I have tried all the others (I think) including Image Browser, but I keep going back to IMCE.

Add new comment

The old BBros.us site was dated, time to go D7.
The New BBros.us site fresh for 2012, funner than ever.
Front page Slideshow filled by Feeds and displays EXIF data.
Administrators and Tough guys can take a Webshot with one click rather than uploading an image directly.