Jump to content

Remove "menu" nav from mobile using code block on Wexley Template in Version 7.0 personal plan

Go to solution Solved by Beyondspace,

Recommended Posts

Hi there!

I've searched the web for days and says and spent dozens of hours trying various snippets of code, none of which have worked. 

I'm creating a custom "linktree" page on my url, so that I don't have to use a linktree or biosite, and instead, drive traffic to my own site. I'm running a personal plan (I can't use custom CSS or code injection, only code blocks on a page) on version 7.0 with the Wexley template.

I've somehow managed to hide the header and footer successfully, though that took tweaking code between recommendations for 7.0 and 7.1 versions. 

But I can't for the life of me hide the "menu" nav on mobile. It's gone off desktop, but nothing I try works for mobile. So here I am posting to the forum. Can you please help? 

I need a workaround that involves code into a code block on the page where I already hid the header and footer using this:

<style> 
  #header, #footer { 
    display: none;
  } 

My page is https://www.andreabakacsphoto.com/links

Thank you!

Andrea

 

 

IMG_4614.jpg

Edited by AndreaBakacs
Accidentally said haven't instead of have!
Link to comment
  • Replies 2
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

  • Solution
2 hours ago, AndreaBakacs said:

Hi there!

I've searched the web for days and says and spent dozens of hours trying various snippets of code, none of which have worked. 

I'm creating a custom "linktree" page on my url, so that I don't have to use a linktree or biosite, and instead, drive traffic to my own site. I'm running a personal plan (I can't use custom CSS or code injection, only code blocks on a page) on version 7.0 with the Wexley template.

I've somehow managed to hide the header and footer successfully, though that took tweaking code between recommendations for 7.0 and 7.1 versions. 

But I can't for the life of me hide the "menu" nav on mobile. It's gone off desktop, but nothing I try works for mobile. So here I am posting to the forum. Can you please help? 

I need a workaround that involves code into a code block on the page where I already hid the header and footer using this:

<style> 
  #header, #footer { 
    display: none;
  } 

My page is https://www.andreabakacsphoto.com/links

Thank you!

Andrea

 

 

IMG_4614.jpg

On mobile, you can use the following css code to hide the header menu

@media only screen and (max-width: 767px) {
  #mobileMenuLink {
  	display: none;
  }
}

Support me by pressing 👍  or marking as solution if this useful for you

Edited by Beyondspace

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date format)
💫 Animated Buttons (Referral URL)
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

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...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.