How To Change Menu Font Size In WordPress

Do you want to change the font size of your menu in WordPress? It’s actually a pretty easy process. In this tutorial, we will show you how to do it. The best part is that you can choose whatever font size you want, so it will perfectly match the look and feel of your website. Let’s get started!

How To Change Menu Font Size In WordPress - image from pixabay by geralt
How To Change Menu Font Size In WordPress – image from pixabay by geralt

Different Ways On How To Change The Menu Font Size In WordPress  

The three common methods are using plugins, adding CSS in a text editor, or direct settings in the admin area. Each method will be detailed below, with instructions on how to carry out each task. 

Changing the Font Size With CSS

The first method we are going to show you is how to change the menu font size in WordPress by using CSS. For those of you who don’t know, CSS is a code language that is used to style websites. If you want to learn more about CSS, we recommend checking out our beginner’s guide to CSS. 

To change the menu font size with CSS, you will need to add some code to your WordPress theme. Don’t worry, this is not as difficult as it sounds. 

First, you need to access your WordPress files. You can do this by using an FTP client or by going to your hosting control panel and accessing the files from there. Once you have accessed your WordPress files, go to the “wp-content” folder and then open the “themes” folder. In this folder, you will see all the themes that are installed on your website.

Next, you need to choose which theme you want to edit. If you are using a WordPress default theme, we recommend creating a child theme before making any changes. This is because if you make changes to a default theme and then update the theme, your changes will be lost. 

Once you have chosen your theme, open it and look for the “style.css” file. This is the file where you will be adding your CSS code. Once you have found the file, open it in a text editor and scroll down to the bottom of the document. At the bottom of the document, you will see a section called “Custom CSS”. This is where you will add your code.

In this section, you need to add the following code:

nav {

font-size: 16px;

}

This code will change the font size of your menu to 16px. Of course, you can change this to any size you want. Once you have added the code, save the file and upload it to your WordPress website. Your changes will now be live. 

Changing The Font Size With A Plugin

If you don’t want to edit your theme files or if you are not comfortable coding, then you can use a plugin to change the font size of your menu. There are many plugins that allow you to do this, but we recommend using Simple Custom CSS and JS. This is a free plugin that is available from the WordPress plugin repository. 

Once you have installed and activated the plugin, you need to go to the “Settings” page and click on the “Simple Custom CSS and JS” option. On this page, you will see a field where you can add your CSS code. In this field, you need to add the following code:

nav {

font-size: 16px;

}

This code will change the font size of your menu to 16px. Of course, you can change this to any size you want. Once you have added the code, click on the “Save Changes” button and your changes will be applied. 

Changing The Font Size In The Admin Area

The last method we are going to show you is how to change the font size of your menu in the WordPress admin area. This method is suitable for beginners as it doesn’t require any coding. 

To change the font size in the admin area, you need to go to the “Appearance” page and click on the “Customize” option. On this page, you will see a section called “Typography”. In this section, you need to select the “Menu” option. Once you have done that, you will see a field where you can enter the font size. Enter the font size you want and then click on the “Save & Publish” button. Your changes will now be live. 

How To Change Menu Font Size In WordPress - image from pixabay by stux
How To Change Menu Font Size In WordPress – image from pixabay by stux

Most Popular Fonts Available For You To Choose From

There are many fonts that you can choose from when changing the font size of your menu. Some of the most popular fonts include Arial, Verdana, Times New Roman, and Helvetica. You can also find many other fonts by searching for “free fonts” on the internet. Once you have found a font you like, you can download it and then add it to your WordPress website. 

If you want to use a Google Font, then you will need to follow these instructions. First, go to the Google Fonts website and find the font you want to use. Once you have found the font, click on the “Add To Collection” button. Next, click on the “Use” button and then select the “@import” tab. Copy the code that is generated and paste it into the “Custom CSS” section of your WordPress theme. 

You can also use a plugin to add Google Fonts to your WordPress website. We recommend using the Easy Google Fonts plugin. This is a free plugin that is available from the WordPress plugin repository. 

Once you have installed and activated the plugin, you need to go to the “Appearance” page and click on the “Customize” option. On this page, you will see a new section called “Typography”. In this section, you need to select the font you want to use from the drop-down menu. Once you have done that, the font will be added to your WordPress website. 

Additional Tips On How To Customize Your Menu’s Font Size 

Here are five additional tips on how to customize the font size of your menu: 

  • You can use the “em” unit to make your font size responsive. This unit is based on the width of the browser window, so it will automatically adjust the font size based on how wide the window is. 
  • You can use percentages instead of pixels to make your font size responsive. 
  • If you want to increase or decrease the space between each letter, you can use the “letter spacing” property. 
  • If you want to increase or decrease the space between each word, you can use the “word-spacing” property. 
  • You can use the “text-transform” property to change the case of your text. For example, you can use this property to make all of your text uppercase or lowercase. 

By following these tips, you should be able to easily customize the font size of your menu.

Related Posts:

Table of Contents

Do You Have a Digital Problem or a Project In Mind?

Kick Back and Let Us Solve It

Tell Us Know About Your Marketing Needs

Tell Us About Your Project and We'll Send You a Free Marketing Proposal With No Strings Attached!

Tell Us About Your Digital Problem or Any Project You Have In Mind

Simply fill out the form so we can send you a customized proposal for your business’s specific needs.