Home

Primary links

  • top o the deck
  • Drupal for Beginners
  • about
  • links
  • give me some sugar

Drupal stuff

  • EDAM
  • STARDOM
  • Question Bank
  • Drupal musings
  • Drupal tips
Home Flexible WYSIWYG editing for Drupal

Key stuff on this site

Easy Drupal Admin Manual (EDAM)

SEO, Traffic and Revenue: Drupalace's Online Manual (STARDOM)

Drupal for Beginners

Subscribe to posts by RSS or email

Subscribe to Drupal Ace by RSS feed RSS feed 

Subscribe to Drupal Ace by Email

Donate towards my web hosting bill! Get a great host!

Share and save

Share/Save

Random piece of content

Oof! Hit by bad_httpd_conf error

Manuals on this site

  • Easy Drupal Admin Manual (EDAM)
    • Welcome to Your Site
    • First Steps: Please Read!
      • Understanding These Instructions
      • Important Terminology!
      • Best Practices for Site Admins
    • Super Quick Guide (for the experienced and the brave)
    • Logging In
    • Your Administrator Tools
    • Setting Site Basics
      • Setting Site Information
      • Configuring Your Theme
    • Creating Content
      • Node Types
      • Create a Page Node
      • Create a Story Node
      • Create a Blog Entry Node
      • Making Images and Other Files Available
      • Using Text and Image Editors
    • Organizing Your Content
      • Terms, Vocabularies, and Taxonomy: "Tagging" Your Content
        • Taxonomy Suggestions
      • Menus, Links, and Paths: Navigating the Site
        • Content Paths and URLs
        • Creating Links
        • Working with Menus: Administration Form (Drupal 6)
        • Working with Menus: Administration Form (Drupal 5)
        • Creating Menu Items on the Fly
        • Placing Menus on Your Pages
      • Placing Content on pages
        • Creating a page from a Single Node
        • Creating a page from a List of Nodes
        • Setting the Front Page
      • Working with Blocks
    • Maintenance Stuff
      • Maintenance and Construction Notices
    • Other Fun Things
      • Changing Color of Garland Theme
      • Free Aliases!
  • SEO, Traffic and Revenue: Drupalace's Online Manual (STARDOM)
    • Set a Clear Goal
    • Make a Good Site
      • Put out the Welcome Mat
      • Make Great Content
      • Build a Great Brand
      • Make Navigation Easy
      • Tune Site Performance
    • Drive Traffic
      • Promote your Site
      • Get Found with SEO
    • Build a Community
      • Build an Offsite Community
    • Monitor and Improve
    • One-Page Checklist
    • Drupal and the Blogging Starter Checklist
      • Drupal and the Blogging Starter Checklist, Part 1
      • Drupal and the Blogging Starter Checklist, Part 2
      • Drupal and the Blogging Starter Checklist, Part 3
      • Drupal and the Blogging Starter Checklist, Part 4
      • Drupal and the Blogging Starter Checklist, Part 5
      • Drupal and the Blogging Starter Checklist, Part 6
      • Drupal and the Blogging Starter Checklist, Part 7

You said it!

  • Tough one to Inves...

    I have heard and read stories such as this one before, and their common denominator is Drupal...

  • exclude

    excellent tip - can highly recommend the module - installed and working perfectly in drupal 7

  • Great CMS

    This book seems very interesting as I am currently starting a project to build a community site...

  • Thanks!

    Thank you very much !

  • Thank you very muc...

    Thank you very much !

more

Reply to comment

Flexible WYSIWYG editing for Drupal

Submitted by Drupalace on Mon, 2009-11-16 17:27
  • Drupal 6
  • editors
Editing in Drupal

A shocking discovery for many a newcomer to Drupal is that a fresh installation offers no controls for styling text in node bodies, comments, or wherever else you might like to drop a boldface or a header.

Most of those stunned beginners eventually realize that this makes sense: Some users want no such text styling, or prefer the complete control of manual HTML tags. And for those who do want word processor-style editing controls, there is no universally-loved solution; there are many editor solutions floating about, each with its own strengths and fans. Drupal lets the administrator choose and install any of many favorites, including FCKeditor and Tiny Tiny MCE. That still irks some who want a built-in solution, but it's a good state of affairs for anyone not afraid of a little hands-on work installing a module and setting up WYSIWYG editing.

Trouble again

I used TinyMCE for a long time, quitting when troubles drove me batty. I switched to Tiny Tiny MCE, which turned out to be a good move when development on the TinyMCE module stopped. But lately, things went haywire again. The symptom was a simple one: Where full Tiny Tiny MCE controls should have shown up for me on this site, nothing appeared but a featureless text box with no editing controls. The "disable/enable rich-text" toggle remained below, but did nothing. Yet I had the correct input format chosen, with all its settings appearing normal too. In fact, I couldn't think of any recent tweaks I'd made that could explain the loss. 

Theme problem? I compared with other sites using a variant of the same theme; they had no problem – at first. I then found the problem appearing with other sites as well, regardless of theme – typically not immediately, but only after refreshing or reediting a node for the second time. Was this a new problem with Safari, then? Apparently not; I saw the same behavior in Firefox too. So, maybe some Javascript incompatibility with the latest version of my OS (OS X 10.6) itself? That could be; I haven't had opportunity to check that yet.

By this point, I went from "let's track this down" mode to "let's find anything that works" mode. (In truth, I was a wee tired of Tiny Tiny MCE too; it lacks the vast customizability of Tiny MCE.) After a little research, I decided to give the Wysiwyg module a try. It's a great piece of work that I think I'll roll out to every site. But it's a different animal from the above-mentioned editor modules, and needs a little introduction.  

Wysiwyg module

Wysiwyg isn't an editor itself. Rather, it provides infrastructure for you to use other editors more easily and flexibly than has been possible so far. In a nutshell:

Editors like FCKeditor or TinyMCE aren't themselves Drupal projects; they're open-source projects usable in many ways. They had to be packaged as Drupal modules by hard-working volunteers, letting know-nothings like me build those editors into sites. (Even then, editors aren't the easiest modules to install, sometimes requiring manual combination of original editor files into the module.)

The Wysiwyg module lets you scrap dedicated stand-alone modules like the above. You install the Wysiwyg module normally, then copy supported editor project files directly into a sites/all/libraries directory. Other than manually creating that directory in your Drupal installation, it's dead simple; the Wysiwyg module admin page even lists the editor projects it supports, complete with download links for quick action. 

Best of all, it lets you easily mix combinations of editors in a single site. You could, for example, assign FCKedit to the anonymous input format, a simplified TinyMCE to an editor input format, and a fully-equipped TinyMCE to a top administrator input format, all from admin/settings/wysiwyg. I'm happy that I can once again configure TinyMCE all I like, and am typing right now into a TinyMCE setup that's pretty simple but has the controls I want. (If you leave a comment, you should see an even simpler set of TinyMCE controls.) 

Testing!

One sad omission: I lost the wonderful image-handling benefits of the IMCE module, which ceased to work. It turns out, though, that the Drupal community has provided a great fix: the IMCE Wysiwyg bridge module. Simply install it, enable it normally, then enable "IMCE" in the TinyMCE (or other supported editor) configuration options that Wysiwyg provides, and image handling in the editor gains all the great options of IMCE. Things are good. (If there's a little image to the right of this text, then IMCE is working for me.) 

That's a preliminary glowing review, though. There are a couple of things I'm not happy about. I had spell checking in my old Tiny Tiny MCE setup, but there's no checking happening now. And whereas copying text – including links – worked wonderfully in the old setup, now when I paste link-bearing text into this editor, I'm getting unwanted garbage text added to the link code (style attributes, a <span> tag, and so on). Those could be browser issues, not Wysiwyg issues; I need to experiment. Fortunately, Wysiwyg makes that easy, placing many different editors on tap.

More discoveries are sure to come, good and (maybe) bad. In any case, I think the flexible approach Wysiwyg takes is great; if you're starting out on Drupal (or starting new sites), do check it out as a contender for your workhorse WYSIWYG solution. 

  • Drupalace's blog
  • Printer-friendly version
  • Quote

Reply

The content of this field is kept private and will not be shown publicly.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd><br><p>
  • You may quote other posts using [quote] tags.
  • Lines and paragraphs break automatically.
  • Web page addresses and e-mail addresses turn into links automatically.

More information about formatting options


Learn Drupal, hands-on

Get the beginner-friendly ebook that teaches community site building via a live case study.

Drupal 6 Ultimate Community Site Guide

Read the review

It's a deal!

Dreamhost dealsDrupal Ace presides over his domain, proudly ensconced in his DreamHost eyrie. Won't you join me?

Promo code deal!

Just enter the code 49ER when you register for an account, and save $49 off the already-low price. No strings!

Read my hosting service review

Drupal mini tip

Need to disable a Drupal module but can't do so from within the site? (This could happen if the wayward module is preventing you from reaching the Modules form!) Look for the module's entry within the "system" table of the site's database, and set the module's status to "0". 

(From within phpMyAdmin: Select the "system" table from the column of tables at left. Click the "Browse" tab. Find the row for the module you wish to disable, and click the "pencil" icon in that row. In the resulting form, input "0" for the Value of "status", and click the "Go" button. Done!) 

Powered by Drupal, an open source content management system

Copyright 2007 and forever after. Made with Drupal, of course. On OS X, of course. Served up by DreamHost. DreamHost

RoopleTheme