Comments on: How do I convert text to bare-bones HTML?

Question: How do I convert text to bare-bones HTML?

waldo — Tue, 29 Nov 2005 11:10:51 -0800

How do I convert basic text formatting (italics, bold, underline, superscript, etc.) into HTML formatting on a semi-automated basis?

Many of my clients' websites are CMS-based, much like blogging software, allowing them to easily add new articles, update pages, etc. They don't need to know about paragraph tags, break tags or any of the document-level HTML tags. But they do need to insert character-formatting tags, like em, strong, and so on. A clever UI, with "bold" and "italic" buttons means that they don't need to know HTML in order to mark these up.

When porting large amounts of information, such as a twenty-page Word document, pasting the text inside of a textarea loses the formatting, and so somebody must go through and laboriously mark up the text with HTML to match the formatting of the original document. This is impractical and error-prone.

I've tried programs like wvWare and I've tried saving the original content as HTML and then running it through HTML Tidy, but I've had no luck. They create webpages. I just want the inline markup converted, with no block-level or page-level tags.

I figure that this can either happen by parsing a RTF file or through some JavaScript or OS-level magic, based on the text in the clipboard. This must be a common need for anybody building a CMS, and yet I can't find any solutions to the problem. Is there any widget (Flash, Java, whatever) into which I can paste formatted text and it will retain that formatting and generate HTML? Some command-line application that will do the same? Or do I need to -- god help me -- write my own PHP-based RTF parser?

By: scottreynen

scottreynen — Tue, 29 Nov 2005 11:24:35 -0800

Check out FCK editor. Works in IE and Firefox, and can paste directly from MS Word.

By: evariste

evariste — Tue, 29 Nov 2005 11:29:16 -0800

waldo:

1. Fog Creek's CityDesk will output xhtml from text edited in a MS Word/Outlook-like richtext environment. So they can paste from Word into Citydesk, click the HTML tab, and copy the xhtml into the textarea. However, it would include things like <br /> and <p> tags.

2. Not exactly what you want: Textile and Markdown let you write attractive plaintext that is translated into xhtml by text formatting plugins available for most CMSes, although that would involve training your clients.

By: evariste

evariste — Tue, 29 Nov 2005 11:29:52 -0800

Or what scottreynen said, which answers your question a lot better than my suggestions.

By: smackfu

smackfu — Tue, 29 Nov 2005 11:30:03 -0800

How about using the midas editor control, like this? It works in IE and Firefox and Safari. You can paste in formatted text and get HTML out of it.

By: scruss

scruss — Tue, 29 Nov 2005 11:40:48 -0800

waldo, you don't want to write your own RTF parser. You don't even want to deal with an RTF token stream.

All these WYSIWYG editors produce dreadful HTML. Looks worse than the cruft that Word produces.

By: waldo

waldo — Tue, 29 Nov 2005 11:45:40 -0800

Yeah, I didn't really want to say it, scruss, but...yeah. I mean, these form-based editors are definitely pretty neat -- they produce code that faithfully mirrors the line height, font specifications, and word spacing of the original. I'd have to write a whole other program just to strip all that stuff out.

I just want bold, italics, underline, subscript, and superscript conversion, or a similarly stripped-down level of conversion. I'd think this would be a pretty common need, with the newfound popularity of blogging software.

By: twiggy

twiggy — Tue, 29 Nov 2005 12:05:58 -0800

waldo: There's a difference between WYSIWYG editors, and javascript tools that just enable WYSIWYG text input in an HTML textbox... Some of those might generate much cleaner HTML code...

By: zsazsa

zsazsa — Tue, 29 Nov 2005 12:18:48 -0800

It looks like those WYSIWYG input boxes are just taking down the HTML instance of what's in the clipboard. The source is ugly because Word, OpenOffice, or whatever is actually generating the HTML, not the browser, so you can't really improve improve on that clientside. What you can do is run things through HTML Tidy on the server once it's submitted to make things sane again.

By: If I Had An Anus

If I Had An Anus — Tue, 29 Nov 2005 12:27:00 -0800

I thought FCK editor put out decent code.

Tidy with the show-body-only option should help.

By: yerfatma

yerfatma — Tue, 29 Nov 2005 12:29:24 -0800

All these WYSIWYG editors produce dreadful HTML. Looks worse than the cruft that Word produces.

Not true. We use FCK in a custom CMS and it works fine. It gives you fine-grained control over what you can do. It requires a bit of work to customize it, but it lets you customize it, and in a well-thought out way. It lets you choose which buttons you expose to your users (so you could easily define a toolbar with just the controls you want).

The only downside is you need to strip out all the extraneous tags yourself, but that's a solved problem you can find on the net in most every language (except for the one we had to work in, ASP/ VBScript). The basic idea is you pass the submitted content through a regex filter that strips out anything that looks like an html tag unless it matches a set of tags you allow (you should also consider allowing some tags by themselves and some tags with attributes).

By: kirkaracha

kirkaracha — Tue, 29 Nov 2005 12:32:27 -0800

TinyMCE (similar to FCKEditor) works pretty well, and you can configure it to produce clean code.

By: waldo

waldo — Tue, 29 Nov 2005 12:43:14 -0800

This WYSIWYG-meets-Tidy-meets-strip_tags option sounds pretty compelling. Hideous. But compelling. :)

By: miniape

miniape — Tue, 29 Nov 2005 13:17:27 -0800

This has a little more than you want, but you the code is all public domain so you can make changes if you'd like.

It even won some sort of contest.

By: CrayDrygu

CrayDrygu — Tue, 29 Nov 2005 14:56:20 -0800

Now, I haven't actually tried it, but it seems like wvWare and HTMLTidy did exactly what you want, except that it produced a whole page instead of just a chunk of HTML. Why not take the output from that, and trim out the <body> tag and everything before it, and the </body> tag and everything after? I don't remember my regular expressions, but I'm sure it could be done with sed.

By: yclipse

yclipse — Tue, 29 Nov 2005 15:24:11 -0800

The Atlantis Word Processor is a very capable RTF editor which produces nice clean HTML when you choose "Save as web page".

By: waldo

waldo — Tue, 29 Nov 2005 16:54:38 -0800

CrayDrygu, I'm starting to think that you're right. It's not pretty, and it will still require post-processing with strip_tags (or regex, as you point out), but it may well work. I'm playing with it now. It may be a good 90% solution, which is better than the 0% where I'm at now. :)

This makes me want to learn to write Firefox plugins, just so I can solve this problem for good.

By: CrayDrygu

CrayDrygu — Tue, 29 Nov 2005 17:13:58 -0800

Yeah, "not pretty" is just about the best way to describe any *nix-based solution like this, for one simple reason: it's all based on the "no jacknives" theory. A program should do one thing, and do it well, rather than trying to do everything (and inevitably doing them all poorly).

So you have a program that converts Word documents to HTML documents. You feed that into a program that beautifies/simplifies the HTML. Then you feed that into a program that strips out any unwanted tags. Combine it with an upload script, and a script to put the final output into the blog, and you've got yourself a real utility there.

By: IndigoRain

IndigoRain — Tue, 29 Nov 2005 23:06:11 -0800

Text 2 HTML freeware

I HATE HTML Tidy. It turns my nice, neat hand-coding into this unreadable garbage.

By: If I Had An Anus

If I Had An Anus — Wed, 30 Nov 2005 06:19:11 -0800

Heh, center tags are funny.

By: waldo

waldo — Wed, 30 Nov 2005 10:53:55 -0800

IndigoRain, you're using HTML Tidy wrong. It's a powerful tool, but not if you skip reading the manual. :) You want to use the --wrap 0 flag.

By: IndigoRain

IndigoRain — Wed, 30 Nov 2005 22:10:26 -0800

Perhaps I have been unfair. I shall read the manual and re-evaluate.