Saturday, January 17, 2015

Font size nightmares in Blogger? Here's how to fix them.

Beginning in 2014, some guest blogs I would try to put on my blog seemed to be possessed by demons. 


I like LARGE print. But sometimes when I would request large print, everything would look fine, then when I previewed it, I'd have five different sized fonts, some of which were tiny ant size. Yet when I looked on the edit page, it all looked fine. What was going on?


 I suppose I could have hunted down an exorcist, but instead I decided to systematically go through the HTML for something new that might be mucking up my font sizes.


And I found it.

The problem is that WORD automatically attaches a long line of optional fonts into the HTML. There's a group of fonts that are small size fonts and for some reason Blogger ignores all other instructions and gives them priority. 

These appear to be the troublemakers:
mso-ansi-language: EN-US; 
mso-bidi-language: AR-SA; 
mso-fareast-font-family: "
mso-fareast-language: EN-US;

The easiest way to exorcise them is to copy your WORD DOC onto NOTEPAD, then copy Notepad Doc onto Blogger compose page.

Notepad kindly removes the unwanted riffraff.


Before a helpful friend told me of this easy fix, I intended to tell you to go to your HTML page, hit Ctrl A (Copy all) and copy it to WORD.


That's right, Word caused the problem, so make it fix the problem. (If you have an HTML app with the Find/Replace feature, that will work too, but I'm discussing how to fix it in Word.)

In Word, you now have a page of HTML jibberish. If you don't, go back and read the above instructions again because you did something wrong.

Go directly to Find and Replace Word box.

In the FIND  copy the highlighted problem font line/s that is/are in your html. Sometimes it will be all four, other times it will be one of them. Doing each one separately is the safest way, but if you are certain they are bundled in your HTML then copy the whole bundle and fix it all.

In the REPLACE block hit one blank space
Then REPLACE ALL. This will remove all the troubling fonts.

Copy the entire page of exorcised HTML back to your HTML page in Blogger.
Then check your Compose page. If it looks good, hit preview to make sure real life looks good. 

Sometimes one of the problem fonts shows up by itself so if you still have tiny fonts in preview, then search MSO until you find one of the above fonts hanging by itself (that happens in links a lot).

Also, these fonts will sometimes cause a second font size-one you don't want- to be created in the HTML that supersedes the commands made in blogger. See the blue highlights below

If so, you need to either remove it or change it to the font you want.

Don't try and do this one by one. Do a Find and and Replace




Example
Here's a doc I lifted from Word and put into this blog:



Two Warnings

Lydia is the most unlikely of heroines, and some readers, who expect their heroines be virtuous and kind, shouldn’t read this story. While Lydia does grow up a great deal through the pages of this book and shows moments of generosity and true love, all the while achieving wealth beyond her imagination, she also remains the self-centered child of her past who will do whatever is necessary to grasp a better future than the dismal life of destitution intended for her on the day her father dies and the estate goes to Mr. Collins.
She, like all of us, are a product of our environment.

Warning about Illogical punctuation:
I go by the English Logical Punctuation rules when it comes to commas and periods used within dialog. This means if a character says, “Then he declared me a ‘pragmatist’,” I will punctuate it logically as the English do.
In U.S. rules, it would be: “Then he declared me a ‘pragmatist.’”  However, that is illogical. The single quote only discusses the pragmatist. Thus, it should surround the word, before the punctuation.  
How did we come to be illogical?


Here's a short sample of HTML with the two problems:
The Blue highlights need to be the same size
and the Yellow highlights need to be removed.


<span style="font-size: x-large;"><span style="font-family: &quot;Times New Roman&quot;,serif; font-size: 12.0pt; line-height: 150%; mso-ansi-language: EN-US; mso-bidi-language: AR-SA; mso-fareast-font-family: &quot;Times New Roman&quot;; mso-fareast-language: EN-US;">How did we come to be illogical? Long ago, we </span>

While the above may seem impossibly hard, it only takes about 3-4 minutes.  


Please don't try to remove every font that begins with MSO. Some are good fonts, such as MSOnormal.


AREN'T YOU GLAD SOMEONE SHARED WITH ME A BETTER WAY TO GET RID OF ALL THE NEW EVIL MSO FONTS: COPY THE WORD DOC TO NOTEPAD AND THEN COPY THE DOC FROM NOTEPAD TO BLOGGER.  (If you can't find notepad on your pc apps, you can locate an electronic version that works here: http://itextpad.com/FxcQIv6uKfmknPetX2ha40RWMBEzsO

11 comments:

  1. Replies
    1. A friend sent me a better solution
      Copy your word doc to Notepad, then copy the Notepad doc to Blogger.

      Delete
  2. It's actually easy to fix. It just sounds complicated.

    ReplyDelete
  3. Ha! Word is *always* the culprit. ;)

    ReplyDelete
  4. Thank you for this. I bookmarked it. I've had this issue more than once and always thought it was me. Never thought to blame Word!

    ReplyDelete
    Replies
    1. Daryl, a friend provided an even easier solution: Transfer Word doc to Notepad, then copy Notepad doc to Blogger

      Delete
  5. Replies
    1. Update, friend provide better solution: copy Word Doc to Notepad, copy Notepad to blogger.

      Delete
  6. So glad I have Wordpress. This only happens very occasionally to me and I just deal with it. But thanks for the post. I'm sure it will help a lot of people, so I'm going to Tweet it now.

    ReplyDelete
  7. Very helpful! I use Weebly and I've not noticed if it happens or not. Very few people send me HTML for posting. Sometimes they do have silly characters where " or ' are supposed to be... It looks more like &.

    ReplyDelete
    Replies
    1. Actually, I was just fixing it in HTML, since that is where the problem can be seen. However a friend just sent me a better solution: Copy the word doc to Notepad, then copy Notepad to Blogger. Notepad removes all the additional fonts.

      Delete

Authors love to get comments. It's candy to our souls.
Please take the time to leave one.

After 3 days, comments require moderation.