Your Own Hamburger Menu Icon (7.0 Version)

Meilo_hamburger.png

Description

Replace the default hamburger menu icon with your own icon. This plugin uses css editor and works with Squarespace 7.0 (Brine template family).


How To Install

From your Squarespace account, go to the Custom CSS Editor. Copy and paste the code below into the Custom CSS Editor box.

// Mobile Menu Hamburger Icon //

.Mobile-bar-menu {
  background-image: url('IMAGE-URL-HERE');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
  background-color: transparent !important;
  height: 25px;
}

Customize

Replace IMAGE-URL-HERE with the url of your own icon.

Adjust the height px value to make the icon bigger or smaller.

Make sure to set the default hamburger icons color to transparent by going to Site Styles.


Previous
Previous

Border Inside Mobile Menu

Next
Next

Site Header Bottom Border