A couple of weeks ago I shared how to add Google fonts to blogger, most of us know how unflattering the default fonts that blogger has and for the entire time I had been blogging I always wondered how some bloggers managed to get really cute fonts. I always thought I had to pay to have anything on my blogs changed and to begin with I did but this year I thought I take the plunge and learn how to do it myself. It's been a really fun process learning all these cool tips and tricks and I have been enjoying sharing them with you and I am sure most of you know already but I hope one or two will find these useful or maybe a new blogger might stumble upon this post in the future and find it useful.
As I mentioned in the blogger version of how to add fonts I am happy to help if you can't understand or something is not working as shown, tweet me and I will help.
The process is easy and for someone like me who is not HTML code savvy if I can do it trust me it's a doodle (you can do it).
Step 1: Go to Google fonts page and choose the font you want, since with blogger I showed you how to add one font and briefly mentioned how to add multiple fonts I will share how to add multiple fonts to wordpress.
step 2: Once you have chosen the fonts by clicking add to collection, click on review at the bottom of the page (in collection) and it will move you to the next page where all the codes are.
Note: The fonts you have chosen will be embedded in one code line which is what you need for the next step.
Step 3: Copy the code and navigate to your Wordpress template (dashboard - appearance- editor) on the right hand side click on header. Once header code is up find the fonts code to replace with your new code. **Remember to save once you add new code**
Step 4: To add the different font styles you picked out, head to CSS styles (bottom right). In the css styles search for "font-family" and this will display the different areas e.g 'body post, sidebar, header font' etc. All you need to do is head back to Google fonts and choose which font you want for each section and replace what's there with the new font style. **only replace what you adding i.e. Font-family; sanif;curve. Nothing more **
REMEMBER TO CLICK SAVE AND REFRESH YOUR BLOG FOR CHANGES TO APPEAR
REMEMBER TO CLICK SAVE AND REFRESH YOUR BLOG FOR CHANGES TO APPEAR
If you want to change the size of the font for your posts either add a line below the font style (if not there like mine) or just increase/decrease the font size number.
I hope you found this DIY post useful, please let me know in comments section also if you need help let me know.
These tutorials of yours are great Myrabev. So great of you to share your knowledge with other bloggers.
ReplyDeleteThank you so much for this! I've been a blogger for a year and still didn't know how to do that. I have been able to figure out alot on my own but that one stumped me and I also pinned it to refer back to!
ReplyDeleteThanks for a great tutorial! I love when tutorials like this actually have pictures of the steps- it makes it so much easier to know you are doing the right thing!
ReplyDeleteI am on Blogger and had no idea at all that you could change fonts. What a great thing to know-their fiont does get boring. I will attempt this on my own but if the past is any indicator I may need HELP!!
ReplyDeleteThat is really neat, I wondered how I could do this. I am just afraid to mess with the coding!
ReplyDeleteThis is easy to follow in adding google fonts to wordpress. It can give you more flexibility in your fonts and in your posts.
ReplyDeleteGreat post. I'm always wondering about the fonts too because even thought I have WP, the font selection is not big for some of the templates :-(
ReplyDeleteI have so got to bookmark this page. I love to have different fonts. Every time I go to do it though I always forget how. At least now I'll somewhere to go look it up. Thanks so much for sharing.
ReplyDeleteThis is good to know!!! I'm hoping to switch over to word press in March ;-) this will come in handy then!
ReplyDeleteVery interesting post. Im on WordPress and I really need it thanks a lot.
ReplyDeleteJust bookmarked this page. This is just great. Thank you for taking your time out to help us. This post is very informative.
ReplyDeleteThese are great tips! Thank you so much for posting these! I'm still getting the hang of getting my blog to where I want it to be!
ReplyDeleteThese are some great tips. thank you for the post
ReplyDeleteThis is such a helpful post!! I don't know much when it comes to this part of blogging (my husband takes care of that department!!). I need posts like this that are easy to follow so I can learn something myself!
ReplyDeleteThank you so much for sharing this trick and for writing this step by step guide! It is so helpful!
ReplyDeleteThanks for the great tutorial! I think it is time to add some of these fonts to my blog.
ReplyDeleteI'm still on Blogger but I'm saving this for when I switch - I am always hunting for tutorials on personalising my blog!
ReplyDeletethis is exactly what I need. I am in the process of updating my site and wanted to add a specific font. My designer was going to charge me $50
ReplyDeleteThanks for the great tips. I had been wondering about this topic but just decided to do some research to learn about it.
ReplyDeleteThanks for this. I wish I have time to figure this out. But for the meantime, I'll just let my blog's designer to take care of my site :p
ReplyDeleteI will definitely have a look at your past posts. I've just started blogging and finding customizing it confusing!
ReplyDelete