How to Add Google Fonts to Blogger: Web Fonts

Google is not only the best search engine giant but it also offers us some of the most popular and famous products. We can not pass a single a day without using google products. If you are using blogger which is a google product? We get a lot of facilities from google if we use blogger as our blogging platform. Google fonts is an awesome google product. There is more than 800 font family in google fonts. You can use any of these fonts on your blog as well as your computer. Here I will show you how to add google fonts to blogger blog?

How to Add Google Translate to Blogger Blog Site

If you want to add google web fonts to blogger then this article must help you to do that. You can use your desired web fonts in both blogger and WordPress. But here I am going to tell you how to add google fonts to blogger?

How Can Remove Powered by Blogger Attribution Widget

We do many things to make our blogs perfect and user-friendly. There are millions of blog sites around the world. Every blogger is really careful about his/her visitors. So you need to be more careful so that you can do better than others. Your font style is really a big factor that attracts your readers more and more. You need to use such a font so that visitors fell good. So you need to know how to add google fonts to blogger?

How to Add Disqus Comment to Blogger Blogs

Adding custom google fonts can improve the looks of your site. Go to google fonts and select the best one for your blog.

How to Add Google Fonts to Blogger

There are different ways to add google web fonts to blogger. Here You get two best options that you can add google web fonts to blogger blog.

How to add google fonts to blogger: Method1

Go to blogger Dashboard. Then click on Template >> Customize.

How to add google fonts to blogger

 

Now select Advanced tab. There are different fonts available. You can choose any one you like. Finally, click on Apply to Blog. You have done.

How to add google fonts to blogger

 

How to add google fonts to blogger: Method 2

Go to google fonts. Then choose your desired font. There are about 809 different styles. You can select any of these fonts. Click on the plus icon near your desired font. I select Roboto font.

How to add google fonts to blogger

Then the font tab will appear on the same page. Copy the code of that font just like below image.

How to add google fonts to blogger

The code looks like:

<link href=”https://fonts.googleapis.com/css?family=Roboto” rel=”stylesheet”>

You need to use this code on your blog adding a trailing slash. You have to add a trailing slash to the end of the code. Then it will be:

<link href=”https://fonts.googleapis.com/css?family=Roboto” rel=”stylesheet”/>

Now go to your blogger Dashboard. Then click on Template >> Edit HTML.

Now find the <head> tag and copy the above code and paste the code  just under the <head> tag.

Then Save Template. Your font is ready to use. Now the next step.

Use google web font on your blog

Go to google fonts. When you selected a font from google fonts. There is an option Specify in CSS just like the below image. You have to copy the CSS code.
How to add google fonts to blogger

Navigate to blogger Template >> Customize >> Advanced >> Add CSS.

If you want to use google font on the body then add the following code:

.post-body {

font-family: ‘Roboto’, sans-serif;   }

If you want to use this google font in header then add this code:

.Header h1 {

font-family: ‘Roboto’, sans-serif;  }

Now Save the template. Google font will appear in your blog. Hope you know how to add google fonts to blogger blog.

Munna Hossain
 

Hello, I am Munna Hossain. I am a professional blogger and affiliate marketer. I am interested in technology, blogging, SEO, and WordPress. My blog Mytechgoal provides you all information about technology, blogging, SEO, and affiliate marketing.

Click Here to Leave a Comment Below 0 comments