How to Use Google Fonts in blogger

Why Google Fonts? & Why are Google Fonts so popular? First of all, it’s totally FREE and everybody likes free stuff. The fonts are also vetted and professionally designed. All fonts are also hosted by Google, which means that you don’t have to upload the files to your personal server and serve them on your site online. To add the fonts to your site, all you need to do is copy and paste a single line of code into your site code. That’s it! you’ll need to do a little CSS to add your fonts. OR you can use the super secret trick that I will share with you in this tutorial. Keep reading for the EASIEST way to use Google Fonts on Blogger.



NOTE: As always, before making changes to your code, back up your template.

Step 1: Choose a Font or Fonts

To browse all the Google Fonts visit the Google Fonts site. Here's a collection of random fonts previewed on the screen. You can filter by font categories, trending fonts, font weights, and more from the right-hand side. You can also search for fonts by name.

To preview the fonts you can type directly into the boxes in the middle of the screen. If you found fonts you like, click the little red + (plus) icon from the upper right corner. You can add fonts as many as you want But try using 3 fonts or fewer to keep your site load fast. After adding fonts, click on the black tab along the bottom of the screen to expand the collection tab. On the collection tab, click on the CUSTOMIZE link to choose your font weights. From the EMBED tab get your code. You have two embed methods Standard or Import. Choose Standard. Copy the link code to add to your Blogger site. pay attention to the Specify in CSS code down below. You can apply the fonts to your site by CSS. 

Step 2: Add the link code to your Blogger site

  1. Log in to your Blogger Dashboard.
  2. Go to the Theme page from the left sidebar.
  3. Click on the Edit HTML button.
  4. You may also find an already existing Google link code near the top of your theme code.
  5. Just paste your new Google link code right after the <head> tag on a new line or on a line right after the other Google code link.
  6. In your link code add a / (backslash) just before the final > like this: <link href="https://fonts.googleapis.com/css?family=Montserrat|Playfair+Display" rel=" stylesheet" />
  7. Click the Save theme button.

NOTE: If you get the error: The reference to entity “display” must end with the ‘;’ delimiter. You need to replace the ampersand (&) with the HTML code for the ampersand, which is the following WITHOUT SPACES:

Your Google font is now installed on your Blogger site!
Kaleem Khan

I'm Kaleem Khan Citizen of Pakistan. Student Of Bachelor of Computer Science at the Virtual University Of Pakistn.

2 Comments

Please Don't Advertise or Spam Links and Messages Here.

  1. Use this diet hack to drop 2 lb of fat in just 8 hours

    Well over 160 000 men and women are using a simple and SECRET "liquids hack" to lose 1-2 lbs each night while they sleep.

    It is painless and works on everybody.

    Here's how you can do it yourself:

    1) Get a drinking glass and fill it with water half full

    2) Then learn this proven hack

    and you'll be 1-2 lbs thinner the very next day!

    ReplyDelete
  2. Do you understand there's a 12 word sentence you can tell your partner... that will induce deep emotions of love and impulsive appeal to you buried within his heart?

    That's because deep inside these 12 words is a "secret signal" that triggers a man's instinct to love, treasure and look after you with his entire heart...

    =====> 12 Words Will Fuel A Man's Love Response

    This instinct is so hardwired into a man's mind that it will drive him to try harder than before to to be the best lover he can be.

    In fact, triggering this mighty instinct is absolutely essential to having the best possible relationship with your man that the instance you send your man a "Secret Signal"...

    ...You will soon find him expose his mind and heart to you in a way he's never experienced before and he'll see you as the only woman in the galaxy who has ever truly appealed to him.

    ReplyDelete
Previous Post Next Post

Recent Posts

Recent Posts