How To Change The Font Size in WordPress?

in Blog, Wordpress on March 7, 2022

Changing the font size within your WordPress site is a very simple operation to do that will allow you to customize any text on your site as you like.

In this article, I will therefore explain “How to Change the Font Size in WordPress?” Showing you two methods that are equally valid.

And the first method, we will use the control panel of the theme you have installed, while in the second we will go to modify the fonts through the CSS code.

How To Change The Font Size in WordPress?

Way to change the font size with your theme

The first method I’m going to show you is really very simple and involves changing the font through the settings of the theme. You are using it on your WordPress site.

On your WordPress admin panel click on the theme name in the left column and then on ” Theme options”. In my case the theme is “Appal ”, but if you have another professional theme installed the procedure is very similar to this one.

Once on the theme control panel, select the “Typography” item (or a similar item that will surely be present in the settings menu). Now, for example, to change the font size of the paragraphs of your articles, click on “Body Typography”.

Here, as you can see in the “Font size” box, you can write the font size expressed in pixels.

Once you have chosen the size you prefer (for example I have increased from 16px to 22px). Now Click on “Save Changes” to save the changes.

At this point,

Thanks to this setting it is obviously possible to change the size not only of the paragraphs but also of the titles.

Always go back to the control panel of the theme you are using on your site and this time click on “Typography> Headers Typography”. Also in this case you can write the size you prefer in the “Font size” box.

Refreshing the site page again as you can see the font size of the titles has increased. Did you see how easy it was? If you continue reading the article I will also explain the second method.

How to change font size with CSS

In this second method to change the font size, we are going to use the CSS (Cascading Style Sheets) code. This, as you know, is the language with which it is possible to change the graphic style of a website.

First, always go to the administration panel of your site and click on the items “Appearance> Customize”. In the new screen, select the text whose font you want to change from your site page.

Now in the section on the left click on the item “Additional CSS”.

Ok, to edit the text inside the article open the page of your site you are interested in a new tab and press “F12” to view the CSS code. (Alternatively, you can press the right mouse button and click on “Inspect ” Or ” Inspect ” ).

Once the code is displayed, click on the small icon with the arrow symbol at the top left of the card. Then select the section of the text you want to change and click on it.

Second Steps

As you can see now the CSS class has appeared on the right of the screen. And you just need to add some code to modify some text. For example, to change the size of the font, simply write in the class “font-size:” followed by the measurement in pixels, which you can increase or decrease as you prefer.

In the same way, you can also increase the line spacing of the paragraph, always writing in the class “line-height:” always followed by the measure you want to give. I also point out that while you are making changes. The changes are already visible within the text so that you can continue editing until you are satisfied with the result.

Third Steps

Now you just have to right-click on the code you just added and copy and paste it on your WordPress customization panel. The changes will be updated in real-time and to make them effective. Now just click on the “Publish” button.

In this way, the changes will be correctly saved and the text will have been modified in all the articles on the site. Through the CSS code, you can obviously modify, in addition to the text itself, also the headings of the paragraphs.

Change font size in titles via CSS

Similar to what you did before, go to your site page, press “F12” and, after viewing the code, click on the arrow icon.

Then select the title (or subtitle) and the related class (in my case it is a subtitle, so the class is “h2”.

In the section on the right then click on the “+” icon and go to write in the class “font-size”. Followed by the size you want to give in pixels.

In this case, however, the text was not changed. This happens because first, it is necessary to overwrite the style of the graphic theme you are using in the class.

  • To do this, just write the words “! Important” after the font size.
  • At this point, as you can see, the size of the title has finally been changed.
  • Now you just have to copy and paste the code you just changed into the WordPress customization panel. (I recommend you always create a new line) and then click on “Publish”.

By reloading the page of your site you will see that the font has been changed successfully.

Conclusion

Well, as you have seen “How to Change the Font Size in WordPress?” It is a really simple operation that will allow you to change the size of any text on your site as you like.

I hope this article was useful to you, if you have any doubts or did not understand something do not hesitate to leave me a comment below. I will be happy to help you! You can also read this: How to create popups with WordPress?

Leave a Reply

Your email address will not be published.