How to add social media icons to your menu

social-link-custom-link

Save the menu once the link has been added.

Step 2: Open the Mega Menu settings for the new menu item

social-link-megamenu-settings

Step 3: Align the menu item to the right and hide the menu text

social-link-settings

Step 4: Set an icon

social-link-icon

Step 5: Optional step for Max Mega Menu Pro users.

Set a custom image icon

social-link-custom-icon

End Result:

social-link-end-result

Displaying social icons on a single line in the Mobile Menu

By default each social icon/menu item will be displayed on it’s own row in the mobile menu.

There are 2 options to change this.

Option 1

Enable the “Hide on Mobile” setting for each of your social icon menu items, then add them as Mobile Toggle Blocks instead.

Option 2

Go to Mega Menu > Menu Themes > Custom Styling and add the following (make sure you update line 7):

Add a Custom Menu Item Class of “social-icon” to each of your social icon menu items.

Related Articles