Search…

X3 Photo Gallery Support Forums

Search…
 
MikeR
Experienced
Topic Author
Posts: 216
Joined: 29 Sep 2006, 09:58

CSS Menu

25 Jan 2019, 11:28

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 3976 times
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: CSS Menu

26 Jan 2019, 04:28

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
 
MikeR
Experienced
Topic Author
Posts: 216
Joined: 29 Sep 2006, 09:58

Re: CSS Menu

26 Jan 2019, 08:30

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
 
MikeR
Experienced
Topic Author
Posts: 216
Joined: 29 Sep 2006, 09:58

Re: CSS Menu

26 Jan 2019, 08:32

Please check the print screen attached
Attachments
E2DC0979-5FCE-4F1A-9BD2-B57A0C72A216.jpeg
E2DC0979-5FCE-4F1A-9BD2-B57A0C72A216.jpeg (8.69 KiB) Viewed 3965 times
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: CSS Menu

27 Jan 2019, 01:01

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.
 
MikeR
Experienced
Topic Author
Posts: 216
Joined: 29 Sep 2006, 09:58

Re: CSS Menu

27 Jan 2019, 13:30

Perfect !

Thank you so much