x

Create a Call to Action type of button in Menu.

I am trying to get a website sorted for a client, and I have hidden all the pages in the menu except the BOOK NOW page. However, I want it to stand out instead of just being 2 small words in the top right. Sort of a call to action type of button.  When I click on it and go to the page a border appears around it because it is the current or active page.

My questions are...

1. Is there a way to get the same Border to go around the BOOK NOW tab in the menu when I am not on that page, eg when I am on the home page? 

2. Is there a way to make the menu transparent (except for the Book Now button) when they scroll down the page? 

The site is not yet published but the preview site is this if that will help?

http://pagely.loginportal.site/preview/m5gf8d.1mcjin957g6f9.1b2094bf11e8fa94c039000da97adbdd 

If you are able to give advice that would be a massive help. 

Cheers

seth 

835 Views
Message 1 of 4
Report
3 REPLIES 3

If you inspect the nav item while viewing the Book Now page, you should be able to see what CSS rules are being added to give it the border. Once you've got those, you could use those rules to force that styling to be added all the time to nav items. If you haven't customized the theme, you could wrap these in style tags and put it in Settings > SEO > Header Code or somewhere like that.

819 Views
Message 5 of 4
Report

@BJ  Are you able to walk me through what you mean by this?

814 Views
Message 5 of 4
Report

When I check the code on the live site, it's using border-color: inherit to give the link a border when viewing that page, so if you do something like the following it will make it always have a border:

<style>

.wsite-menu-item { border-color: inherit !important; }

</style>

805 Views
Message 5 of 4
Report
This thread has been archived and locked. Please start a new thread if you would like to continue the conversation.