installing custom fonts to your blogger

there are a lot of tutorials to help you get your custom fonts into your blogs codes. but the 'better' ones are so confusing to me! there is just too much content and pictures and blabbering about what? why am i here again? so hopefully mine will be easy enough to help you get through the process on your own without feeling overwhelmed! be sure and backup/restore your blog before adding any codes to your template, okay. ready?

STEP ONE.
first thing is, you need a font you love! so to get that, we need to head over to google web fonts. they have tons of fonts to choose from and you don't need to download any of them to use it on your site, which i love. so find your font & then click add to collection. once it's in your 'font family', click use.

it's going to bring you to an 'ALMOST DONE!' page. scroll down to points 3 and 4. these are the only codes you'll need. copy the first code (number 3). keep your google fonts page open because we are going to need the codes for steps 2 and 3.

note: the font i've chosen is 'give you glory', but your font should be in place of that. 

STEP TWO.   open up blogger >> template >> edit html

click anywhere inside your template and hit CTRL + F or COMMAND + F for a search box to open. type in <:skin> and press enter. it will take you directly to that tag, which will be highlighted in yellow. paste your link you copied from google fonts above the <:skin> tag. once you've done that, we need to add a forward slash to the closing bracket.... so it looks like /> instead of just >

after you've done that, hit SAVE TEMPLATE

basically what we just did was connect your google font to your blog. now we need to guide it to how & where you want it used. which brings us to...

STEP THREE.   from template, go to customize >> advanced >> add css

here is where you can integrate that font anywhere on your blog. you're the boss. to apply your font to a certain part of your blog, i've got a few codes below for different area's. all you need to do is copy & paste that certain html with YOUR font css (for example, mine is {font-family: 'Give You Glory', cursive;} ) from your google fonts page (point 4) to the blogger css text area that you should have open. like this....

change your sidebar title font

.sidebar h2 {font-family: 'Give You Glory', cursive;}

change your post title font

h3.post-title, h3.entry-title {font-family: 'Give You Glory', cursive;}

change your previous/next link font

.blog-pager a {font-family: 'Give You Glory', cursive;}

change your blog header font

.Header h1 {font-family: 'Give You Glory', cursive;}

change your post body font

.post-body {font-family: 'Give You Glory', cursive;}

change your post footer font

.post-footer {font-family: 'Give You Glory', cursive;}

change your date font

.date-header span {font-family: 'Give You Glory', cursive;}

------------------------------

you will instantly see your fonts change once you've got your code in your css text box. hit enter once you're done pasting. if all looks well to you, APPLY TO BLOG.

and you're done! i really hope this was helpful. if any part of this was confusing, please don't hesitate to email me or comment with your questions.