How do I use the Appearance editor in WordPress?

In WordPress, you have the option of editing the templates with the template editor; however, some specific changes can only be done in the code of the site. You can edit the code using the Appearance Editor in the WordPress dashboard. In this article we will explain how to change the size of the font in the menu of the "Twenty Twelve" theme using the Appearance Editor.

Steps to change the font of the menu

1. First you need to find the CSS code that requires editing. You do this by inspecting the code of your site. The following explains how to find the CSS code to edit.

   Visit your website.

   Highlight the menu items. Right click the the highlighted text and select view Selection Source (This is specific to FireFox. Other browsers will have a different way to inspect the code.)

   
   
2. Find the class for your navigation Menu. In this case the class we are going to edit it the nav-menuclass. See image to the right.

   Copy the nav-menu class name.

   
   
3. Now you will need to paste the class name in the style.css sheet for your Wordpress. Log into the WordPress Dashboard.
4. Go to Appearance and select Editor.
   

   You should by default be taken to the style.css stylesheet. If not, make sure you are on the style.css page by viewing the "Styles" section on the bottom right, and make sure the style.css is blue highlighted like the image to the right.
   

5. Paste the class name at the bottom of the style.csspage. Make sure you have a ( . ) dot in front of it. The code should look like the following:

   .nav-menu {}

   You can add attributes to your CSS to change the size, color, and more of the text. In this example, we are changing the font size to 24 pixels (24px). The code looks like the following.

   .nav-menu {font-size:24px;}

   When done adding the CSS, click Update File.

   Important! You may need to Clear your browser cache to see the changes take effect.
   

   Now the font on your menu is larger. You can add different properties to change to look of specific areas of your WordPress site with the Appearance Editor of WordPress.