Go Arrow Button Style (Header Version)

---

Description

An updated button style with an arrow icon for the header button. 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.

// Header Go Arrow Button - Button Padding //

.header-actions .btn, .header-menu .header-menu-cta a
{
    padding: 20px 30px !important;
    border: 10px solid #000000 !important;
}

// Header Go Arrow Button - Arrow Icon Style //

.header-actions .btn:after, .header-menu .header-menu-cta a:after {
    content: '➔';
    color: #5FDAA9 !important;
    border-left: 1px solid #818181;
    padding-left: 15px;
    margin: 0px 0px 0px 15px;
}

---

Customize

Button Padding:
Adjust the padding and border values to your liking. Button color and font style can be adjusted within your Squarespace website’s settings.

Arrow Icon Style:
You can change the arrow icon with your own by replacing the “➔” within content. Adjust the color, border, padding, and margin values to your liking.

Header and Mobile Menu Button:
The code works for both the header and mobile menu button. You can enable this button via header settings.

---