How to Add Google Fonts to Your WordPress Website Without a Plugin

Everyone desires to enhance the visual design of their website. Most of the researches reveal that user experience depends on your website's design.

According to many SEO experts, customer analysis experts, and marketers, the more appealing will your website design; more readers will engage with your site.

And typography plays a vital role in improving the overall design. As you know, many web developers are using custom fonts in their WordPress themes; we're going to do the same.

In this tutorial, you will learn about adding Google Fonts to your WordPress website without using any plugin.

Whenever any WordPress user decides to alter anything on their website, they always look for a convenient way, and everyone knows, there are thousands of free plugins are available in the official WordPress repository.

Now and then, people keep adding more plugins, and at some point, they complain about having a poor page loading time.

Why do you need a plugin if you can accomplish it without any?

Choose Your Favorite Google Font and Add it to Your Website

There may be a chance when you looked at any website's font and wondered how to apply that font to your website. Well, I have an answer to your question.

Although not all the fonts are available on Google Fonts, you can find some beautiful typography.

Let's start the process.

Step 1

Go to the official website ofGoogle Fonts, and search for the best font you want to use. Scroll down a bit and check if you can resonate with any of those.

To select a font, you merely need to click on the red plus button. But if you want to explore the font, click on its box and you will see the different styles.

How to Add Google Fonts to Your WordPress Website Without a Plugin

You can try changing the font weight, size, and style.

Step 2

You can easily find the red plus button to use the font you like. You will see a brown bar at the bottom of your computer screen.

Click to open, and you will see the instructions to use the font.

To add Google Fonts to your website, you can use two methods. I suggest you use the standard way. You can also use an "Import" method; the choice is yours.

How to Add Google Fonts to Your WordPress Website Without a Plugin

Now the question arises, where do you need to add this <link> tag?

If you have noticed, there is an explicit instruction to add the link to the <head> tag of your website.

Step 3

I hope you may have already guessed that the <head> tag is present in the header of your website. But how can you find it?

As you know, a WordPress sites' design is controlled by its WordPress theme, so you have to edit the header.php file.

To accomplish this, you need to navigate to Appearance>>Editor while logging in to your WordPress admin panel.

How to Add Google Fonts to Your WordPress Website Without a Plugin

Step 4

You may have already known that whenever you open the editor, you see the CSS file, but you require the header.php file.

To do so, search for Theme Header in the vertical navigation menu. Click to open.

Step 5

If you do it right, you can see the title of the file along with your WordPress theme's name.

Theme Name: Theme Header(header.php)

How to Add Google Fonts to Your WordPress Website Without a Plugin

As we have already discussed, you need to add the <link> tag to the <head> tag. It's similar to submitting your website to Google Search Console.

You can see the <meta> tags. Paste the <link> tag you have copied from Google Fonts.

Click Update File.

Step 6

- Now you may be wondering as if what's the best possible way to change the heading of your blog posts. Well, to do so, you need to target the HTML elements using CSS.

Let me show you an example.

h1{
font-family: 'Lato', sans-serif;
}

Isn't this easy? If you know a little bit about CSS, you can modify the typography of your whole website.

If you're not a tech-savvy person, you should mess up with the codes. If you want to, you should always backup your website, or at least the WordPress theme.

I would like to mention an alternative, you can also add Google Fonts via the functions.php file, it can be a complicated process for beginners, so for now, we stick to the most straightforward method.

Have You Ever Thought about Modifying Your Site's Typography

My of our clients demand to improve the overall design by adding a new font, and we always use either TypeKit or Google Fonts.

As you know Google offers the free solutions, so you don't need premium fonts. There are tons of free fonts in the Google library.

What's your favorite font? If you're a web developer, you may know that Roboto has been one of the most used fonts so far.

Conclusion

To avoid a plugin, you must follow the simple steps. Editing the header file of your WordPress theme isn't so difficult.

I hope you already know how to add custom code to your website's header and footer. It's a one-time thing; you don't need to touch it ever again. I hope you can do it.

Check out these top 3 WordPress hosting services:

Was this article helpful?