How To Add Icons To WordPress Menu

How to add icons to the WordPress menu:- Making a professional website is not so easy, Many things should be seen and designed during the development of a professional website.

You can create the navigation menu for more interactive by adding an image icon to the site menu. This image icon is also created to make your menu noticeable & attractive. for example, you can take a look at lookmith. home page menu bar.

Professional websites or blogs must have good look so that to attract people towards the site & also the site interface must be too simple so a normal average people can understand.

So, In this article, I’ll explain how you can add Icons to your site menu for a professional look of the site & this may lead your visitor towards amazing surfing & browsing.

Read Also

Add Icons To WordPress Menu

with all these said & stuff, If you wish to add icons to your WordPress site menu then please go through the steps explained below. The steps involved are as follows:-

Step 1:- First you need to install a plugin font Awesome 4 Menus.

Step 2:- After installing the plugin just activate it.

Step 3:– Then go to appearance & then on the menu, there is a list of menus which are on your sites.

Step 4:- Click on the name of menus, you will see an option named CSS Classes (optional) there add the icon code to that CSS Classes optional.

The icon which you want to show on your selected menu, Just adds the code for that particular icon to that menu.

There are lots of menus code available on the site of font awsome 4 menus go & select the code & copy paste according to your need.

Now, You need icon code & for this, you can visit Font Awesome For Menu website or the icons which I’ve used in my website menu you can add the same.

Icon codes of my website

Privacy Policyfa-exclamation-circle
About Us fa-user-circle-o
Contact Usfa-phone
Computer & Mobilefa-desktop
Top Xfa-thumbs-up
Tips & Tricksfa-gears
Make Money Onlinefa-rupee
Web Designingfa-globe
Game fa-gamepad
Money fa-money
Heart fa-heart

Now after adding the CSS code to CSS optional just save the changes & refresh the page. After refreshing the page go to your site homepage & take a look, on menu options there you will see the changes.

Important Links

Font Awesome Icon Code link:- Click here

Font Awesome 4 Menu Plugin link:- Click here

I hope this article will help you to create a professional website & also rearrange the website with a professional look at your site. Share your view in a comment.

If you have any questions, you can comment or feel free to DM on Instagram.

For more tips tricks, web designing, SEO, YouTubing, Web development, Backlink, Online earning & blogging be in touch & you can also subscribe to my YouTube channel:- Tech brothers for more tech videos.


Leave a Comment

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