Replace Hamburger Menu Icon With Text

Screen+Shot+2019-12-31+at+6.42.45+PM.jpg

Description

Replace the default hamburger menu icon with your own text. This plugin uses css editor and works with Squarespace 7.1.


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 Text //

.burger-box:after {
content: "Menu =";
text-align: right;
font-size: 16px;
color: #000;
display: block !important;
}

.burger-box {
  width: 60px !important;
  height: 25px !important;
}

.burger-box div {
display: none;
}

Customize

Replace the MENU = text with your own.

Adjust the font size, color, width, and height values to your liking.

Please note that if you activate the cart icon, the custom menu text will be moved to the left side on mobile.


Previous
Previous

Vertical Navigation (Updated 7.1 Version)

Next
Next

Show a Different Logo On Mobile