Makin Cute Blogs

Part 1: Get Set up

First thing you will want to do, is to sign up for a free webfonts.fonts.com account.

Once you have an account, you need to go to your "Project" tab, and where it says "Current Project", select "Create Project"

Now you need to add the Project Details, make sure you click "Add" next to your Publish Domain, then Click "Save Project"

Next Click on "Choose fonts".

Here, you can browse through the different kind of fonts available. **Quick Tip: If you click on "Show free", you won't have to scroll through all the ones that say "Upgrade"

Once you have found one(or more) that you like, Click on "Add to Project".

Now we are going to "Work on style sheet". We have to add a "Selector", the Selector that you need to add will be different, depending on the Template that you are using, so I have listed below what Selector to add for the different templates.

Minima: .post h3

Simple: h3.post-title

Picture Window: h3.post-title

Awesome Inc: h3.post-title a

Watermark: h3.post-title

Ethereal: h3.post-title a

Travel: h3.post-title a

**In this sample, I am using the "Awesome Inc." Template, so I am going to use the h3.post-title a

After you type it in, click "Add selector". Then you need to click on the pink drop-down menu, and select the font that you want (if you only picked one, then it will be the only one that has shown up)

Once you have selected your font, you need to click on "Save changes and update style sheet".

Now, go to your "Publish" tab, and Click on the tab that says "Option 2: Advanced (JavaScript)". It should like this: **if you only picked one font, than there will only be one font-family listed

Now Copy the Text in the First box and go to your Edit HTML page on you blog, and paste it directly after you <head> **it is right close to the top

Go to your Template Designer.

and click on Advanced, and Add CSS. (for the Minima Template, you can add the code here, or in you Edit HTML page)

Now we need to tell the template which fonts you want where, so below I have a list of different fonts that you can change. In my tutorial, I am going to change the Post Title, and the Sidebar/Gadget Title. So for my example, I need to copy the 2 lines below that work for the Awesome Inc.

Minima Template:

Post Title: .post h3 { FONT FAMILY HERE }

Sidebar/Gadget Title: h2 { FONT FAMILY HERE }