Jump to content

Adding a second button in mobile header with HTML

Go to solution Solved by creedon,

Recommended Posts

Hi! I'm trying to add a second button in my main nav and I need it to show on the mobile nav header since I'm forcing that view when the site is on desktop view. I've duplicated the html of the current button "Book an Appointment" to make a "Match with a Therapist" button right next to it that looks the same. When add it to Header code injection it's being placed behind the nav bar so you can't see it. (if you overscroll up at the top you can see it)

Any chance anyone has an idea of why this is happening?

Here is a link the the site the
https://goldfish-wrasse-48kn.squarespace.com/
password: igc


I've added a screenshot below of what I would like it to look like.

Screen Shot 2024-03-01 at 4.01.00 PM.png

Link to comment
  • Replies 3
  • Views 1k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Posted (edited)

@creedon Thank you so much your post in that thread is the perfect solve for my problem!! 

Would you be able to point me to what I would adjust in the code to make the buttons stack in the dropdown menu? But leave them in a row on the main nav bar.

I think the coding might also be shortening the height of my main nav bar. Is there something in there that could be overriding my height settings?

Edited by hey_sp
Link to comment
Quote

Would you be able to point me to what I would adjust in the code to make the buttons stack in the dropdown menu? But leave them in a row on the main nav bar.

My code needs a little assist as you've modified how the SS default menus work.

Add the following to Website > Website Tools > Custom CSS.

.header-menu-cta {

  flex-direction : column;
  
  }

 

Quote

I think the coding might also be shortening the height of my main nav bar. Is there something in there that could be overriding my height settings?

My coding doesn't alter the height specifically but it is altering various elements and that may have changed the height. If you used custom code to alter the height of something you may need to update that code to work with what my code is doing.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

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.