Display Social Media Icons in Header, Footer & Sidebar

Display Social Media Icons in Header, Footer & Sidebar

You can add icons for the most popular social networks to your site header, site footer and sidebar. The icons are linked to your social media profiles, giving your readers access to your latest status updates. In Berry theme, we offer a special custom menu for adding your social media icons.

social icons

Set up the social menu

Please follow the strunctions below to create your social menu:

  1. On your website dashboard, go to Appearance > Menus > Edit Menus.
  2. Create a new menu. Give it a name, for example, “Social Menu”. Then click on the “Create Menu” button.
  3. Find “Custom Links” on the left. Enter the link of your social media site, for example, “https://twitter.com/LoftOcean”. And you can also enter some text into “Link Text” field, it’s optional, and you can enter any text here. Just need to give a correct URL. Click “Add to Menu” button.
  4. Repeat to enter your other social media sites’ links.
  5. Find “Menu Settings” option > “Theme locations“, check the box before “Social Menu“.
  6. Click on “Save Menu” button.

You can also manage your social menu in Customizer.

social-menu

Now your social menu is ready to use.


Open the social icon link in a new tab when clicking
  1. When edit your social menu, please click on “Screen Options” button located on the top right corner of the page.
    expand-screen-options
  2. Then tick the box before “Link Target”.
    show-link-target
  3. When create/edit a menu item, tick the box before “Open link in a new tab”.
  4. Click on “Save menu” button to save the changes. Done.

Add social icons into site header
social-nav-folded

Go to Appearance > Customize > Header, find the option Social Icons. Check the box to show your social menu in the site header.

And you will see another option below: Fold Social Icons. You can choose to check the box so social icons will be folded, and hover/click on the icon to show them. So the social icons won’t overlap the site menu, especially when they are both long.

Please note: Social icons will always be folded when screen width is smaller than 980px.


Add social icons into site footer
social-in-footer

Go to Appearance > Customize > Footer, find the option Footer Social. Check the box before “Check to enable social icons” to show your social menu in the site footer.


Add social icons into sidebar
social-widget

Go to Appearance > Widgets, find the custom widget Berry Social. Add this widget into the sidebar. Then you can choose to enter a title for it.


Supported Social Icons

Currently, we support adding icons for the following 22 social networks:

  • Facebook
  • Twitter
  • Google+
  • Instagram
  • Pinterest
  • Behance
  • LinkedIn
  • YouTube
  • Vimeo
  • Snapchat
  • Medium
  • Flickr
  • Etsy
  • Dribbble
  • Tumblr
  • Vine
  • Bloglovin
  • RSS
  • VK
  • Reddit
  • Yelp
  • Delicious

The share icon will show if you enter a link of a social network we haven’t supported yet.