Page 1 of 1

CSS Menu

Posted: 25 Jan 2019, 11:28
by MikeR
Hi karl

If it's not too difficult or custom, can you explain (step by step) how to change a link in the menu, like you did for the BUY menu on your website https://www.photo.gallery/

Thanks
Mike
190125-0003.jpg
190125-0003.jpg (148.37 KiB) Viewed 4526 times

Re: CSS Menu

Posted: 26 Jan 2019, 04:28
by mjau-mjau
A bit complicated to do "step-by-step". The www.photo.gallery websites has a lot of custom styling applied, and I am not quite sure what you mean "change a link in the menu". Apart from using the intro-image plugin on all pages at www.photo.gallery, there is not too much modifications to the X3 menu. We have outlined the "buy" button with a white border. Perhaps you can elaborate?

The best tool to use if you want to start dabbling with custom CSS, is the browser Developer Tools. For example here in Google Chrome. It allows you to click an element, and see what classes and styles are applied to it, which gives an idea of what CSS you could add to custom CSS.
Image

Re: CSS Menu

Posted: 26 Jan 2019, 08:30
by MikeR
I’m only talking about the BUY link in your menu. I didn’t find how to do it. It would be great if you or someone else have some clues. 

[img]webkit-fake-url://3181d484-2327-43da-9aaf-a2256b37de4f/imagepng[/img]

It could be interesting for all photographers to know how to emphasize a link in the menu: to book a session, order prints. 
Thanks

Re: CSS Menu

Posted: 26 Jan 2019, 08:32
by MikeR
Please check the print screen attached

Re: CSS Menu

Posted: 27 Jan 2019, 01:01
by mjau-mjau
The most simple solution to this, would be to add the following CSS to Settings > Custom > Custom CSS:
Code
.menu a[href="/buy/"] {
  border: 1px solid;
}
You would need to replace /buy/ with the specific URL in your menu. There are other solutions that would not be locked to a specific URL, but they require assigning custom classes.

Re: CSS Menu

Posted: 27 Jan 2019, 13:30
by MikeR
Perfect !

Thank you so much