1. Knowledge Base
  2. Classic Themes
  3. Add Icons to Menu

Note: This doesn’t apply to our NEW Kadence Theme

In this tutorial, we will be adding icons to go above each menu item in the primary menu of your site. It’s a simple process as the code is already built into our Kadence themes.

Step one is to look through the icons available and choose which ones you will want to use. To view a full list of the icons, click on the image below.

*Note for free theme users- your icon options can be found here.

For Pinnacle Theme icons: Premium or Free

For Ascend Theme icons: Premium or Free

  • Once you have your icons picked, navigate to your wp-admin and then the Menus subpage of the Appearance section.
  • In the top right corner, click on “Screen Options”.
  • A drop-down menu will appear. Locate “CSS Classes” and make sure that box is selected.
  • Click on the menu item you want to add an icon to and type your icon class into the css classes area.

Once you are satisfied with the configuration of your menu, hit the “Save Menu” button.  Take a look at where you’ve assigned your menu containing the icons to see if your settings are reflected.

Be sure that you’re selecting the correct icons for the correct theme. Each theme includes different icons and classes may differ.

Related Articles