Social Icon on Header + Hamburger Menu

//Adds extra space to header 
.Mobile{
  padding-top: 1.5%;
  padding-bottom: 1.5%;
}

Hi! I have a client who added a hamburger menu on mobile (using the code above) and now they want to add a social media icon on the navigation bar. The font awesome work around is not working and I'm not sure how else to implement this? Help!

If you use Business Plan or higher

1. Add to Code Injection Header

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

2. Create Navigation with Link to Facebook, Twitter, ...

and Name:

<i class="fa fa-facebook-official" aria-hidden="true"></i>

With Twitter, name will be

<i class="fa fa-twitter" aria-hidden="true"></i>

or see all icons here: https://fontawesome.com/v4.7.0/icons/

If you use Personal Plan, need to tweak the code..

Hi Tuanphan! 

Thanks for your advice, my client added this code and it's actually not working since the hamburger menu was forced into the desktop view so the IG icon is probably there but it's just not showing up. 

2 hours ago, julianna.rodriguezd said:

Hi Tuanphan! 

Thanks for your advice, my client added this code and it's actually not working since the hamburger menu was forced into the desktop view so the IG icon is probably there but it's just not showing up. 

Above code will add icons to both Desktop - Mobile. You need to use CSS to hide icons on Desktop.

I didn't send CSS above, because each template will need different code for this. Can't give the code without site url.