TinyMCE and the non-breaking space problem

Let’s get right to it then: TinyMCE is great, but I am annoyed by its willingness to take users’ multiple spaces literally! Collapsing multiple spaces is a basic characteristic of HTML, and allowing users to carelessly (or intentionally, which they still shouldn’t do) insert multiple spaces by converting every other one of those spaces into the   (non-breaking space) character is BAD!


Anyway… start with a pinch of Stack Overflow, add a dash of the official TinyMCE documentation, along with a heaping tablespoon of reading between the lines, and I have a working solution to the problem. My installation of TinyMCE now automatically converts any   characters in the text back into regular ol’ spaces.

It’s a bit draconian; after all there are legitimate uses for non-breaking spaces. But 95% of the times they’re inserted by TinyMCE are user accidents, and another 4.9% of those times are abuses like faked “tabs” that would be solved better by another approach altogether. (There are reasonable CSS-based solutions that work in some cases, but let’s talk HTML’s need for tabs another time.)

Anyway… here’s the gist of the solution. You need to create a callback function. Here’s mine:

function my_cleanup_callback(type,value) {
  switch (type) {
    case 'get_from_editor':
      // Remove   characters
      value = value.replace(/ /ig, ' ');
    case 'insert_to_editor':
    case 'submit_content':
    case 'get_from_editor_dom':
    case 'insert_to_editor_dom':
    case 'setup_content_dom':
    case 'submit_content_dom':
  return value;

It may look like there’s a lot of extra stuff in here you don’t need; I included all possible values for type inside the switch to be prepared for the future. You do want to check for type == 'get_from_editor' though; otherwise your replace() is going to run under way too many conditions and may cause weird behavior like new paragraphs appearing when you just want to insert new text into an existing one, or browser-generated warnings about leaving the page when you try to save. (I ran into both as I was fine-tuning this.)

Now that you have your callback function, you just need to… you know… call it. That’s done inside tinyMCE.init(). You’ll need to include this line somewhere:

cleanup_callback: 'my_cleanup_callback',

Be sure to check if cleanup_callback is already declared somewhere, and also don’t forget the comma at the end, unless you’re inserting this as the last line.

Once you’ve got it all rolled out to your site, you’ll need to clear your cache. I’ve found TinyMCE’s configuration files can be annoyingly persistent in the browser cache.

Yes… you have correctly observed that I had to use non-breaking spaces myself in this post, to get the indents in the code samples to show. Pay no attention to the man behind the curtain. And remember my complaint about the lack of tab characters in HTML. Another day.

February 1983 / February 2013

The sting in my nostrils as I step out the back door
Into the pre-dawn cold

The smell of car exhaust mixing
With the frozen winter air

The stretching shifting halos
Around the streetlights seen through squinting half-awake eyes

The snow stomped from my boots before I step
Through the front door

Why do we settle for things that are mostly crap?

I have a bag of Jolly Ranchers in my office. At my suggestion, it was given to me as a Christmas stocking item.

Now, I don’t mean to sound ungrateful. But I noticed two things about the Jolly Ranchers after I opened the bag:

1. The overall quality of Jolly Ranchers has really gone down since I was a kid.

2. Cherry Jolly Ranchers are my favorite, and there are very few in the bag. It seems like it’s over half watermelon, my least favorite.

I started to think about how Jolly Ranchers are a little like a can of mixed nuts. Most cans of mixed nuts sold proudly advertise “less than 50% peanuts” which, to me, means the can is 49% (or maybe 49.99999999%) peanuts.

Peanuts are OK, but they’re definitely the bottom rung of the nut ladder. (Bad metaphor.) There’s a reason peanuts — filler, essentially — dominate the proportions in a mixed nuts can: they’re cheap and plentiful.

I’m not so sure why the proportion of flavors in a Jolly Ranchers bag wouldn’t be evenly distributed; I can’t imagine that some of the artificial flavors cost that much more than the others. But I just wonder if people have become so accustomed to the “good” options in an assortment being more scarce that they would be strangely, perhaps even unconsciously, disappointed if it were otherwise.

Put another way: would cherry Jolly Ranchers taste as good if they were 49% of the bag?

There’s a deeper question here though. Why do we put up with so much mediocrity in life? Limited resources are certainly a factor. A can of nothing but whole cashews and Brazil nuts (my favorite) would probably cost $20. And we’d rather shove our faces full of peanuts in the quest for the occasional rare broken cashew in a $6 can of nuts than sample sparingly from a higher-priced can of just the good stuff.

I guess. Or maybe we’re just chumps.