Dorothy wrote me this morning about the MPA student blog with a problem I’ve seen several times, the dreaded div tag: <div> This little culprit will reformat your blog. Basically, a blogger has pasted some text into WordPress that is screwing up the formatting. The whole right sidebar is being pushed down to the bottom of the page and some crazy font sizes are happening in the posts. This is a dead givaway that some offending code has made it’s way in to a post and needs to be removed.
Where we see the font sizes start to get inconsistent, that’s the first place to lookfor crazy code, div tags in particular. In this pic we see “Add Comments” is the first place that font sizes are awry, so I’ll check that post first. When I click on the “HTML” tab above the post in the edit window, lo and behold, here’s what I find:
<div><span style=”font-size: small;”>I know this will sound redundant to all of us in accounting, but I cannot stress this enough because my firm as well as the others all share the same beliefs. <em>Act with integrity and uphold the highest standard of ethics</em>. They will drill this principle into your head and for good reason. No one wants another Enron. (Our economy is in bad enough shape as it is.)</span></div> </span></div>
As you can see, there are <span> and <div> tags in there that shouldn’t be. It’s the <div> tags that screw up the formatting the worst, but let’s remove them all. The easiest way is to manually remove all such tags.
Once I fixed the “Round 1″ post, I noticed the exact same thing happening in the post below it, written by the same blogger, so I just repeated for the “Busy season” post and the problem was fixed.
If there is ALOT of crazy code, there is another, more automatic way to remove. In the “Visual” tab, select all, cut, and re-paste using the “Past as plain text” button that looks like a clipboard with a “T” on it. (This “T” button is in the second row of options, which you won’t see without clickng the last button on the top row, the one with the three rows of colored squares.) If you use method and there is code like “Read more”, links, or pitures, you’ll need to put that stuff back, so it helps to past the whole of the code from the “HTML” tab into another doc -notepad, or your favorite HTML editor- so you can re-paste all the plain text and then go back and put the code for the links, pics, “Read more…” etc.
To prevent this problem from happening, teach your bloggers about pasting as plain text from the begining.
Yes, copy and paste is your friend and your foe. You can copy in so much junk sometimes you just gotta start over.
The easiest way I’ve found to remove all HTML tags is to VIEW the crazily formatted post, highlight and COPY the text, PASTE it all into Notepad. Then, get rid of all the extra spaces, hard returns, etc. and then COPY and PASTE back in to the blog, replacing all the former badly formatted text. THEN, use the blog formatting options carefully to reapply the styling you need.
Cheers,
-Barbara