Edit Your Html: Customising Your Font on Blogger :)

She's my new best friend. :p

Hi everyone! Hope you're having a nice week :)

Today I've decided to feature a quick tutorial on customizing your font on Blogger. I have just figured it out and am almost too proud of myself ^-^

Well, first I have to give credit to Spring Flowers Blog Design because it showed me exactly what I was looking for.  It helped me soo much!

So HTML is kind of like a separate language. Like English, French, or whatever language you might speak or learn, it seems confusing to one who is not familiar with it. I know that if I looked at a page of German I would be entirely clueless. For me, HTML was an unknown thing to me a few months ago. Now, I feel like me and HTML are becoming better friends every day :p now that I've figured out the mystery of her. :)

Don't let yourself be intimidated by her-- She's friendly, I promise! (xD) And she won't bite! And she'll give you what you want if you're careful with her and you follow directions. Promise.  So, let's say you want to customize your font for free on Blogger. I'll tell you, and I hope it works for you and hope I'm not the only freak who figured this out. ;)

So, first. Log into your Blogger account (obviously :p).

 Click on Design. It's in the top right corner of your screen, which you already know if you're not a real newbie to blogging. :D

Click on "Edit HTML" . That button is next to the big orange button that says "Customise". It took me longer than it should have for me to find this one simple button.

There'll be a warning when you click on it, that says you should only Edit HTML if you're an advanced user. Yeah, yeah. You can do it, girl! I have faith in you. (Or, if you're a boy, you can do it, boy!) Click on Proceed. 

Scroll down (it will be fairly early in your scrolling process) until you see this:

<Group description="Page Text" selector="body">

     <Variable name="body.font" description="Font" type="Font"

         default="normal normal 12px Font, Font, Font, Font, Font" value="normal normal 12px Font"/>

NOTE: The text I've highlighted here will not be highlighted there. Also, in the place of "Font, Font, Font, Font, Font" will be the fonts you have already. 

Enter the name of the font you want your page text to be in in place of the highlighted places. You can also adjust the size where it says "12px" or whatever size font you currently have. 

When you're finished editing the HTML, it should look something like this (I'm using the font Century Gothic as an example, since that's what i have on my blog):

<Group description="Page Text" selector="body">

     <Variable name="body.font" description="Font" type="Font"

         default="normal normal 12px Century Gothic, Century Gothic, Century Gothic, Century Gothic, Century Gothic" value="normal normal 12px Century Gothic"/>

Then, of course, click on 'save'. View your blog. If it doesn't work, please tell in comments so I can investigate the issue! 

I really hope I helped you! :D