Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Added Social Icons to Mobile Header (after removing Hamburger Menu)


JBitetto

Question

Site URL: https://superfinesocial.com/

Using 7.1 - I removed the Hamburger Menu from Mobile Header as we are not linking our pages to the top navigation. We subsequently lost the social icons as they were within Hamburger Menu. Would anyone have code to insert Social Icons on Mobile Header after removing Hamburger? Please note, we already inserted the following Custom CSS Code to remove the Hamburger Menu from Mobile Header:

// Remove Hamburger Menu Icon //

@media only screen and (max-width: 640px) { .burger {
  display: none;
}
}

Thanks in advance to anyone who can assist.

 

 

Link to comment
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

3 answers to this question

Recommended Posts

  • 0

Add to Code Injection Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  $(document).ready(function() { 
		$('.header-menu-actions').appendTo('.header-burger');
	});
</script>

Add this to Code Injection Header

<style>
  @media screen and (max-width:767px) {
.header-burger {
    width: 100px !important;
    flex: 100px !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
}
    button.header-burger-btn.burger {
    display: none;
}
    .header-title-nav-wrapper {
    flex: 1 0 calc(100% - 100px) !important;
}
    .header-menu-actions {
    margin-top: -80px !Important;
}
    .header-menu-actions * {
    fill: blue;
}
  }
</style>

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...