Hello,
I am trying to figure out how navigation works in Xway, but I’m having trouble understanding it.
I want to display six categories globally on the home page, with their next-tier sub-pages appearing as dropdowns. I think this can be done automatically.
Here’s the tricky part: when a visitor is on a category page, I want the menu bar to show the dropdown only for that category. The other six categories should still appear globally, but their sub-pages should not.
Is this possible?
Hi Mark,
Xway’s menu object is designed to be global, but a simple way to get secondary levels of navigation is to add a scrolling row of links that appears beneath the main menu. So if you have several categories of pages, the global menu would navigate to the main page in that category, while each category would display its own row of additional links. The way to do this in Xway would be to have multiple master pages, with a separate master page for each category. Each category master page would be based on a main master page containing the main menu, and would contain its own row of secondary links.
Thank you for the reply. But how does the work for responsive, mobile menus?
The global menu becomes a hamburger menu on narrow screens, and there is a scrolling row of links just beneath it, which adjusts to the width of the screen.
A scrolling row of links is a box that has Overflow set to Scroll or Auto in the Style section of the Box Inspector. It could be a flex container, in which case you would probably set Wrap to Don’t Wrap, and each flex item would contain a link. Or it could be a text container, with white-space set to nowrap in Extended Properties.
Apple’s website is a bit like this, e.g. the Mac page, which contains a horizontally scrolling row of links (images and text in this case) beneath a global menu. Other product categories (e.g. iPhone) contain their own row of secondary links.