Layout App ~ Menu/ Buttons

[summerkate_]

Hi there, 

I would like to know if there is a layout app or even better a booking calendar app out there that allows you to add a custom button anywhere on your site. I need a button in my main menu called 'Coaching'. The theme does not allow for this in the theme settings and their support does not cover this sort of custom theme change, they suggested an app may be available. I have attached a screenshot of what I would like to achieve. The button needs to sit in my main menu bar but on the right-hand side of my logo. 

Thanks,

Summer

[Ahsan_ANC]

Hi @summerkate_ please send the header.liquid i will make an option for a button in it.

[summerkate_]

Hi thank you so much, I have attached a rft document with the header.liquid code. 

Best wishes, 

Summer 

[Ahsan_ANC]

Hi @summerkate_ can you share the theme name or your store URL.

[summerkate_]

Of course, the theme name is called Symmetry. Here is the link ~ https://themes.shopify.com/themes/symmetry/styles/beatnik. My store URL is also https://faraheadbowhunting.com/ 

[Ahsan_ANC]

please share the store preview password.

[summerkate_]

So sorry, yes the password is stawyo 

[Ahsan_ANC]

by the way, I have developed some code please give it a try.

 Replace your header.liquid code with this one

https://docs.google.com/document/d/1BJHtdcv2YtOdNz0wDQKmKGbUvfZ38VX1ua-jYKAXxo8/edit?usp=sharing

[summerkate_]

This is awesome thank you, is there a way to change the styles/ colours/ border etc easily on my end or does that need to be done within that code? And how do I edit the link etc? 

[Ahsan_ANC]

I have updated the code in the doc file please use that new code in header.liquid file. 

if there is no error go to customizer > header > there will be new options to change button settings

[summerkate_]

Thank you so much! Just a couple of things please: 

1. Can the button have a tiny bit more space on the right-hand side between the button and the accounts icon? 

2. There is a black border on the button which I cannot seem to change the colour for? Can this be editable? 

3. When I scroll down (sticky header), I cannot see my button as I have set the colour to white. Can this be something I can edit too for my sticky header? 

Thanks you

[Ahsan_ANC]

HI @summerkate_ I have updated code one more time please use that code and make changes in theme customizer.

[summerkate_]

Hi there, 

thank you so much, just a couple more styling things if possible sorry. I have taken a screen record of the button both in the transparent header and the sticky header. 

Link ~ https://www.loom.com/share/dc2250ec86c44e5ab81256d03d2fdc3b

1. Instead of adding padding right in the button, having it centre aligned is fine but can I instead add margin right? So the border doesn't sit super close to the accounts icon? 

2. I can edit the text and background colour of the hover button but not the border? The border is set to black on hover and I want to be able to change this if possible? 

3. On sticky header, I can't change the border colour, is this something I can edit? I need the border colour the dark grey #404040 as the sticky header background is white? 

4. The sticky header also has the border black which I want to be able to change colour too? Is this possible? 

5. Mobile menu. Is it possible to instead of having the button as it is on mobile view, add it to the hamburger nav but with the same styling so it stands out more? 

Best wishes, 

Summer 

[Ahsan_ANC]

Hi @summerkate_ these are a lot of changes, can you add me as a collaborator so I can make these changes on your store?

[summerkate_]

Yes of course, can you send me your email address please? 

[Ahsan_ANC]

I have sent the collaborator access request.

[summerkate_]

I have granted you access

[Ahsan_ANC]

I am making the changes

[Ahsan_ANC]

Hi @summerkate_ I have made all the changes please go through the settings in the customizer and update me about further changes.