HTML problems.

What's that?

Christopher Key of The Barbaric Yawp is having problems with HTML.

What kind of trouble?

Some text that he wrote in a word processing software and copied to the Radio editor. Every paragraph he wrote extended all the way to the end of the browser and over. No line wrapping whatsoever.

Well, are you planning to gloat here, or are you going to lend a helping hand?

Chill, chill! I'm not here to criticize, I'm here to help. Besides, I did attempt to help him...

Oh! So you're the one he said was—

Shush! He mentioned my secret identity! Don't give it away!

Geek...

Anyway, here's the advice I can provide: People, if you're using a word processor to write out your weblog posts, and then copying them to the Radio editor window... for dog's sake, clean up the resulting HTML!

Now you're the one that should chill. But before that, you should do a better work of explaining that "clean up the resulting HTML" business.

OK, here's the thing: when you paste text from a word processor into Radio, it'll try its best to imitate the formatting of your text. That may mean inserting info on the font you're using and it's size, and—

Cut!

What the—? This is no shoot, man!

No, but I'm realizing you're not going to get across any better with all that verbiage. Better use an example.

Mmm... OK! Here: this is the first line on Chris' relevant post.

Zen and the Art of motorcycles

Well, that doesn't look that bad...

Hah! You say, but look at the HTML behind that simple line.

<H1 style="MARGIN: 0in 0in 0pt"><SPAN style="FONT-SIZE: 12pt; FONT-FAMILY: 'Times New Roman'; mso-bidi-font-size: 10.0pt"><?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" /><o:p>
<H1 style="MARGIN: 0in 0in 0pt"><FONT size=5>Zen and the Art of motorcycles<o:p></o:p></FONT></H1>

Yeah, it looks... stuffed.

Exactly! So, what I'm suggesting people do is—now, look closely at your editor window in MS Explorer and Windows OS—to click the "Source" radio button beneath the window after pasting from a word processor and trim down the excess tags. In the above case, It could be simplified to the following.

<H1><SPAN style="FONT-SIZE: 12pt; FONT-FAMILY: 'Times New Roman'; mso-bidi-font-size: 10.0pt"><FONT size=5>Zen and the Art of motorcycles</FONT></SPAN></H1>

And what would that get us?

Something like so.

Zen and the Art of motorcycles

But that looks just like before!

Yeah! But it's behind the scenes where things have been improved.

But to what purpose?

Aw, cheez... All right, let me attempt a more relevant example. Those paragraphs of Chris that wouldn't wrap around? Here's the HTML behind one of those.

<PRE><SPAN style="FONT-SIZE: 12pt; FONT-FAMILY: 'Times New Roman'; mso-bidi-font-size: 10.0pt">Art Jacobson, at <I>Ojo Caliente</I>, has posted a couple of evocative essays on the many and diverse joys of riding crotch rockets.<SPAN style="mso-spacerun: yes">&nbsp; </SPAN>His prose reminds me of the time when I was immortal and blasting down a powerline trail on a dirt bike was right up there with amyl nitrite for sheer pulse-pounding, giddy exhilaration.</SPAN></PRE>

And what does that produce?

Hey, I'm not showing that here; the text won't wrap around and my formatting will be all shot to Hell.

OK, OK. So why does that happen?

See those <PRE> and </PRE> tags around the text? According to my HTML guidebook, they "[force] the browser to display the exact formatting, indentation, and white space that the original text contains."

Layman terms, please.

That means that if there are no returns between those tags—and there are none in the example I posted above—then there'll be no line breaks within the paragraph and the text won't wrap around.

Gotcha! So how do you fix that?

Simple! Repeat the "click the 'Source' radio button beneath the window after pasting from a word processor" step above and replace the <PRE> and </PRE> tags for <P> and </P> respectively; those are the standard tags to create a paragraph, one that allows for text wrapping. If we change that, this is what the new HTML will look like...

<P><SPAN style="FONT-SIZE: 12pt; FONT-FAMILY: 'Times New Roman'; mso-bidi-font-size: 10.0pt">Art Jacobson, at <I>Ojo Caliente</I>, has posted a couple of evocative essays on the many and diverse joys of riding crotch rockets.<SPAN style="mso-spacerun: yes">&nbsp; </SPAN>His prose reminds me of the time when I was immortal and blasting down a powerline trail on a dirt bike was right up there with amyl nitrite for sheer pulse-pounding, giddy exhilaration.</SPAN></P>

And that'll look like so?

Art Jacobson, at Ojo Caliente, has posted a couple of evocative essays on the many and diverse joys of riding crotch rockets.  His prose reminds me of the time when I was immortal and blasting down a powerline trail on a dirt bike was right up there with amyl nitrite for sheer pulse-pounding, giddy exhilaration.

Exactly.

I thought Chris had tried that. And didn't work.

Well, I can't explain that. I took a peek at his source code, and the <PRE> and </PRE> tags were still there.

Maybe your advice doesn't work.

Ah, can it! Anyway, I'll repeat it again—

Just like a broken record.

Hmm... As I was saying: edit your HTML code, don't rely on the formatting Radio creates by default. And if you have no idea what I mean by HTML—

I'm sure some are scratching their heads over that one if they read all the way to here.

If you don't know HTML from Adam, check the "HTML basics" tutorials on Webmonkey. HTML is the Lego blocks to build your weblogs, people: learn it and love it.