Different font for each menu point?

[danny]

Dear @Richard,

is it possible to have a different font for each menu point?

So News = Helvetica, Works = Times, Biography = Comic Sans etc.?

http://testshila.de/onepage/

Thanks and best wishes,

Daniel

[Richard]

Dear Daniel

@danny

Sure this is very possible 🌼

When right-clicking on a menu-item in your browser and choosing "inspect" the webpages HTML structure will appear:

---

Here we can see the each menu-item also has its own unique Class with number E.g:
.menu-item-400 or .menu-item-399

With this knowledge we can change the font-family easily.
In either:

Lay Options > Custom CSS & HTML > Custom CSS

Or:

Customize > CSS

Custom CSS would look similar to this depending on your needs ( class name > then css rule nested within ):

.menu-item-400{
font-family: helvetica;
}

.menu-item-399{
font-family: BebasNeue-Regular;
}

---

Here are some links that will help you with what is referenced:

https://laytheme.com/documentation.html#custom-css-styling

https://www.w3schools.com/cssref/pr_font_font-family.asp

---

Best wishes Daniel and good luck - Google is your friend! 💥🌝

Sincerely

Richard

[danny]

thanks @Richard ! I managed, can I change the font size for each menu item as well?

thanks a lot and best wishes

Daniel

[danny]

I actually tried:

[danny]

Dear @Richard,

it shouldn't be to hard to change the color of each menu item?

I tried as well:

Thanks so much. Really appreciate your help.

best wishes

Daniel

[Richard]

Dear Daniel

@danny

Awesome! happy to help ✨

---

Sincerely

Richard

[danny]

Dear @Richard,

oh, but the Custom CSS didn't work.

How can I change to color of each menu item?
And how can I change the size of each menu item?

Thanks a lot.

Best wishes

Daniel

[Richard]

Dear Daniel

@danny

In this case you are targeting a link <a>. Also the color has been defined somewhere else so you must override with !important

.menu-item-240 a {
    color:red !important;
    font-size:40px;
}

Please note, respectfully Daniel that if you wish to go deeper into customising Laytheme it is up to you to research how Basic CSS and HTML function, i am unfortunately unable to maintain a tutorial like this even though i wish to help.

Have a wonderful day Daniel and thank you for supporting Laytheme.

---

Best

Richard

[danny]

Dear @Richard,

thanks a lot! Works great!

Now for the Lightbox Captions, this seems to be a bug. Could you have a look? http://laythemeforum.com/topic/6897/lightbox-caption-alignment

Have a nice day!

Best

Daniel

[Richard]

Dear Daniel

@danny

Will take a look, thanks! 🌝

---

Best wishes

Richard