Project-navigation link in menu

[XLD]

Hey,

is it possible to add the „Next Project“ and „Previous Project“ links to the menu?

Thanks in advance!

Best,
AD

[Richard]

Dear AD @XLD

Unfortunately, just adding the link's directly into the menu from " appearance - menu's " I believe is not an option ?

However i can think of some workaround using the option's that Lay Theme does provide.
They all involve some basic 'Custom HTML or CSS' if you are familiar with these.

For information regarding CSS.
https://laytheme.com/documentation.html#custom-css-styling

Option: Forcing the Next/Prev "project arrows" into the menu bar.

Activating the project arrows within "Lay Options" we can then go to our 'Customize' section and change the arrows to text ( they can be image or arrow if you prefer ), and we will set the position to top.

Now using our inspection tool:
https://www.khanacademy.org/computing/computer-programming/html-css/web-development-tools/a/using-the-browser-developer-tools

We can see the prev/next links and the information about their positions:

We can use our own Custom CSS to set the link where we want ( in this case up in the menu ). This can be done by adding code into "Lay Options - Custom CSS & HTML"

So for example i could add code similar to this:

.project-arrow.pa-next {
    top:6px;
    right:10%;
    z-index:11;
}

.project-arrow.pa-prev {
    top:6px;
    left:76%;
    z-index:11;
}

By adding this code i have created a menu like this ( very basic ) :

I hope this helps you AD

Best wishes and good luck

Sincerely
Richard

[XLD]

@Richard-Keith

Thanks for your fast and comprehensive reply, Richard.
This helps a lot!

Just one more question:
Is it possible to add the „hide when scrolling down“ / „show again on mouseover“ functionality as well?

Best regards,
Axel

[Richard]

Dear Axel @XLD

Not directly from the standard menu options.
This will have to be done with CSS & JS added into 'Custom CSS & HTML'

https://www.w3schools.com/howto/howto_js_navbar_hide_scroll.asp

Also to remember that we must put our javascript into a "newpage event" for it to function within Lay Theme:

https://laytheme.com/documentation.html#custom-javascript

I apologise that i cannot go deeper into showing you the whole process, there is a lot of great content and help online for achieving what you wish, so keep trying! :)

Best of Luck

Sincerely
Richard

[XLD]

@Richard-Keith Thanks Richard!

[Richard]

Dear @XLD

Best :)

Rich