I’ve been away from Xway for a while (life kind of gets in the way sometimes) so am now getting back into it and learning about it again (the videos have been very useful).
I was just wondering if CSS menus similar to Freeway will ever be introduced - I always found them an easy way of navigating a large site. Or what is considered to be best practice (read: relatively easy!) for adapting sub menus in Xway - I have seen the Portfolio template and that appears to be the easiest work round. Can’t seem to find anything on it in the user guide. Thank you.
We may introduce support for submenus at some point, but it’s not something we’re currently working on.
The Portfolio template follows Apple’s example (e.g. Mac - Apple) by adding a scrolling navigation bar beneath the main menu.
I’m not a big fan of submenus on websites, and I haven’t seen too many examples in modern websites. BBC News has a More submenu that I find quite annoying - some of these topics used to be in the main menu. Are there some good examples that you can recommend?
Another category of menu are the large dropdown menus (often containing different font sizes) that appear when you move the mouse into the menu area or click on a menu symbol, e.g. Apple (again), or theGuardian. It’s possible to create these using flex layout and popup boxes. This is something we may add further support for in future.
That seems similar to Xway’s hamburger symbol, which also changes to an X, so it could probably be created in the same way, although I think it might be confusing to have two hamburger symbols in a menu. An alternative would be to use some kind of ellipsis (three dots) symbol, which Apple use for some kinds of menus, and which is generally understood to mean “more”.
You can also use images in menu items.
Another option is to create an absolute-positioned box and place it in front of the menu bar on the left or right. That’s what we did with the Portfolio “logo” in the template you mentioned. You can’t put this in the menu, but you can position it in front of the menu by adding it as a child of a header box that also contains the menu. Here’s a simple example: the circular background is created by adding border-radius (Name) 50% (Value) as an Extended Property.