How to change fonts in WordPress (2021)

Changing Fonts in WordPress

People tend to judge the book by its cover or judge the website by its overall look. If you want to add some uniqueness, some branding, or some personal touch to your website, you can opt to change your theme’s fonts. Some users prefer to use a completely new font by applying it via CSS or a free plugin. On the other hand, there are some users who are not so tech-savvy, and they need a simpler approach to their addition of fonts within the theme.

Let us have a look into how we can change the fonts within the themes of WordPress:

A theme designer of WordPress is free to choose specific fonts in particular areas of the theme. For bringing a change in this, you must be able to identify the CSS script that runs the font for that specified area, be it header, body, footer, etc.

In case you are trying to use a font that is completely new, you need to know some coding. You can use the @font-face rule. You should first take a licensed font for web use. You will then need to upload the font to the server.

If you know to code, you must know that the next step will be to define the font family to the top of your style.css. For best safety, using a child theme is recommended.

@font-face {font-family: sans-serif;
src: local(‘sans-serif-Regular’),
url(“fonts/sans-serif-Regular.ttf”) format(‘truetype’);
font-weight: normal;}

How to change the Font Globally?

To change your font globally is no rocket science and can be done with the help of just a line of code. First, locate your theme editor. You can do this by clicking on ‘editor’ that appears under the Appearance tab. The fonts are defined at the bottom of the page. You need to look for the theme’s CSS stylesheet.

Just put this line of code on the top of your stylesheet: * {font-family:” Insert the name of the font here.”}

How to change the font for specific theme areas?

The chances are higher that you don’t want to put different fonts in different areas on your website. In the case of WordPress themes, identifying font areas can be tougher than normal.

You can locate fonts inside the post content under the following CSS classes: content.post, entry, and post entry. It will probably be like:

body {font-family: Arial, Futura, sans-serif, Helvetica;
font-size: 3em;
padding:22;
margin:12; }

USING PLUGINS (The easier approach)

In case you classify yourself as a lesser tech-savvy person, you can opt for Plugins. They always help and are a USP of WordPress. Let us look at some of them:

Easy Google Fonts:

• It has a huge collection of fonts.
• It is simple and easily usable.
• Preview in real-time is available.
• Headers can be customized.

WP Google Fonts:

• It is easier than the above one.
• You can allocate Google fonts to specific CSS elements within the Admin Panel.
• Easier for the ones having little to no knowledge of coding.

MW Font Changer:

It provides fonts for more than 30 languages.
It also has languages like Arabic, Persian, and Latin.

 

Share
  •  
  •  
  •  
  •  
  •  
  •  
  •  

Leave a Reply

Your email address will not be published. Required fields are marked *

Get a Quote

Give us a call or fill in the form below and we will contact you. We endeavor to answer all inquiries within 24 hours on business days.





    Open chat