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

No menu items: how do I only show the CTA button on mobile?

Recommended Posts

The site I'm building in 7.1 has no header nav items. It is only a logo and a call to action (CTA) button.

On mobile, the hamburger menu leads to a blank menu with only the CTA button at the bottom. It doesn't match my color scheme.

I want to get rid of the menu on mobile entirely. I want it to look like:

[Logo]                   [CTA button]

and not:

[Logo]                   [=]

with the = (the ugly hamburger menu) leading to a blank white non-matching menu with an easy-to-miss button at the bottom.

I should be able to do this using built-in customization and without code, and if I can't, Squarespace that's a terrible look. What's the fix here?

Share this post


Link to post
On 7/7/2020 at 2:46 AM, knockout said:

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
/* remove burger */
.header-burger {
    display: none;
}
/* show button */
.header-actions {
    display: block !important;
}
.header .header-actions-action--cta {
    display: block;
}
/* logo width */
.header-title-nav-wrapper {
    flex: 50% !important;
}
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post

Im looking to also keep the mobile view without hamburger menu but with a CTA button. This code only worked to remove the hamburger menu...any ideas?

 

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...