|
Seo Master present to you:
 In this post i will teach you how to use cool and stylish fonts in your blog post using Google Font API. Few years back web devlopers has to use fonts that are available in majority of computers or has to go through long and irritating procedure to add custom fonts in their web pages. But with rise in internet technology it has become much more easier to add custom fonts in your webpages. And it does not requires the users to have that fonts intalled in their computer. This technique can be used on blog as well as your personal websites. Back-Up your Bloggers TemplateThis will be you first step in each and every post of MBW where you need to customize your template. So in case if something get wrong with your codes you can use downloaded version of your template. To download your template follow below steps
Font SelectionGoogle has variety of cool and stylish fonts. To use those fonts go to Google Font Directory and select any font of you choice. Then click on quick use button and you will be taken to a new tab. Step 1: Copy the code as shown below into Notepad <link href='http://fonts.googleapis.com/css?family=Carrois+Gothic' rel='stylesheet' type='text/css'> Step 2: Changing the above copied code. Add forward slash ('/') before closing tag ( ">") <link href='http://fonts.googleapis.com/css?family=Carrois+Gothic' rel='stylesheet' type='text/css' /> Step 3: Copy the CSS code that look something like below into Notepad font-family: 'Carrois Gothic', sans-serif; Step 4: Now paste the code that we edited in step 2 after the <head> Tag. Make sure that it is the first code after head tag otherwise it may cause problem in Internet Explorer or older version of google chrome or firefox. Step 5: Now we will add CSS style to change the font style of our post title. To do this search for any of the following code.If you can't find first code try with the second one. .post h3 OR .post-title h3 Now change font name with the name we copied in Step 3. So code will look something like below.In our case it was 'Carrois Gothic' but it can be any font of your choice. font-family: 'Carrois Gothic'; If you follow every steps correctly now you will have custom fonts in your blog. You can use this same procedure to change fonts for sidebar,title, posting etc. To do so you only need to change Step 5 and search for any of the following code.
Still Confused ?If you are still confused and not able to get any of the step correctly or have any problem understanding this post leave a comment below i will be glad to help you out. |
Labels: Begineers Tutorials, Customization, HTML And CSS Tricks
