Tech Tips, New & How to Guide

How to Add Social Media Icons on Your Wordpress Site Menu Bar

Every designer likes social media icons for designing their website. A quality icon can help to make good design look completely. The logo of social media such as twitter, facebook, google+ and YouTube is most widely used icon.
Social media icons can increase your site usability. We use social media icon specially for designing our blog.

Social Media Icons


Fortunately, you will see many social media icons on the internet. But few icons are used very commonly. You can use social media icons in you wordpress site menu, sidebar, footer and anywhere on the site. In this post, I will discuss how to use social media icons in your wordpress site menu section.

Adding social media icon in the wordpress site menu by using a plugin: 

You can add social icon menu in wordpress site in various ways. Most of the designers are using social icons by coding. But if you have no enough coding knowledge, you can use the plugin. The Wordpres plugin gives a great opportunity to create an excellent social icon menu in the website by using drag-drop interface. So you can display a social icon menu just about anywhere such as menu, side bar, footer, content post etc.

Firstly, you need to do active and install ‘Menu Social Icons Plug-in in your wordpres site. After an active and install the plugin, you need to visit wordpress Appearance>Menu in your site dashboard area.

Before you create a social media icon menu, you will need to create a new menu. But it will good if you use ‘social-icon’ menu title name.

Create a new manu


Next, click the ‘Custom link’ tab on the left side. After clicking a custom link tab, you will see social media icons below.

Next, you will need to click a social icon for creating a social menu. Click a social icon.  When you are done. You need to click ‘add to menu’ button. So, repeat this process, if you want to add more social media icon menu.

add social icon


Once you have completed to add social icons on the menu, you need to choose a menu location. But it will depend on your website theme. Here you may have multiple menu locations. Save your menu desired location, such as ‘Primary Menu’. After selecting menu location, you need to click ‘save menu’ button. After saving menu, you can see the preview. If show social icon menu in your website menu bar section, your work is complete.

2nd Methods:

If you don’t want to use any plug-in for creating a social icon menu, you can follow anther methods. This method is very simple.

Firstly: you will have to uploaded a social icon on your website theme directory image folder file. After uploading an image, you will have to get an image source URL.

Example: how to upload images on theme dirretory image folder. Here I will show you very short step…..

Login cPanel>Go to ‘File Manger’>Click ‘wp-content’>Click ‘Theme’ file>Click ‘Images’ file or you can create an image folder> upload an image.

Note: So, your image link is: http://yourdomain.com/wp-content/images/social-icon.jpej

2nd step: Login your wordpress website and go to Appearance>Menu section under the dashboard area.
3rd Step: Click ‘Custom Link’ tab. Here you will have to typed social icon destination URL link (not image source link)

add menu by coding


4th Step: Next you will have to typed your image source link below the ‘Link text’ box. (See note)
5th Step: Click ‘Ad menu’ button.

So, repeat this process, if you want to add more social media icon menu.

Once you have completed to add social icons on the menu, you need to choose a menu location. But it will depend on your website theme. Here you may have multiple menu locations. Save your menu desired location, such as ‘Primary Menu’. After selecting menu location, you need to click ‘save menu’ button.
example of social menu icon

Next, go to your website. Reload website and see the preview. If show social icon menu in your website menu bar section, your work is complete. 
Benefet of Social Media Icon or Link: If you use social media icon menu, you will get more like, follower, commnet share on your website. 





0 comments:

Post a Comment

How to Add Social Media Icons on Your Wordpress Site Menu Bar