If you stopped through last week, we did a tutorial on Blog Font and where to find FREE Fonts for your blog. So, we are back this week to show you how you can do it for yourself. The FREE Fonts that we like the most here at Busy Momi Bee Blog Designs is Google Web Fonts, so that is the site we will use for the purpose of this tutorial.
Step 1: Click on Google Web Fonts and search the 500+ Fonts to find the one you would like to use.
Step 2: Once you have the font you would like to use click on the “Quick Use” button.
Step 3: Go to step 3 and click the “Java Script” Option then copy the code.
Step 4: Log into your blog and click on “Template” then “Customize”. Before you do anything you are going to want to back-up/save your current template.
You can do that by clicking the “Backup/Restore” button at the top right corner of your blog. Then choose “Download Full Template”. Once that is completed move on to Step 5.
Step 5: Place the code right below the “<head>” section at the top of your template code. See the before and after below.
Now that you have the code installed you can move on to the last and final steps.
Step 6: Go back to the Google Webfonts site and copy the “font family” code in step 4.
Step 7: Now place that anywhere you see “font family” in your HTML code and there you go.
Here is a tip: To find “font family” in your HTML code just hit control F on your keyboard and a search bar should pop up in the upper right hand corner of the screen. Type in “font ” in the search bar and they should show up.
Still have questions?? Let us know, we would love to help.
Next week: We will do a tutorial on how to add Google Fonts to your WordPress Blog!