Hi Marc, 

please consider you can set up the Menu the way you want by directly working with the Menu Object. Please find here a guide: https://guide.websitex5.com/en/support/solutions/articles/44001606118

Thanks!

Hier ein Post zur Umsetzung eines "Mega-Menüs" mit Ebenen und Menütrennlinien, siehe

>> https://helpcenter.websitex5.com/fr/post/275307

And here in this post I have recreated a nice, modern drop-down menu with levels as a linked extra page where you can even take photos, see

>> https://helpcenter.websitex5.com/fr/post/276703

There are several screenshots here showing the look on the website, the structure in the sitemap and the objects in the grid.

----- Screenshots -----

-----

-----

-----

-----

It also works with narrower screens, but it also has a limit that would have to be tested.

I left out the black background here because on narrower screens it would be unattractively overlaid by the menu names.

With a little imagination, extensive testing and a few compromises, very beautiful and modern navigation menus can be created even with the current version of WebSite X5.

-----

I have now created a new test page and put it online, see

>> https://findelinks.de/123test-cosmetics/index.html

There are 2 different pages for the mega menu to design according to the space available.

If the screen width is less than 720 px, JavaScript redirects to the smaller versions of the mega menu page.

I used the free template from the Pro version for my test site.

The pages have no content because I was talking about the mega menu.

Maybe I could make the test page available as a project in IWZIP format.

----- 4 Screenshots -----

-----

-----

And here is the grid layout for the mega menu pages.

-----

Before I forget - add a break point with 360 for responsive design so that the menu objects don't turn into hamburger menu objects on narrow screens.

-----

100 + from me...

I agree, the menu object module is outdated, insufficiently represented in the options for responsive views (let's note that you certainly lack options for 10 additional responsive resolutions, but even the sparrows on the branch know that)... You tried the Overlay menu and stopped there, you are not developing the application in a modern direction... Unfortunately...

The possible number of pages of my mega menu can be easily calculated:

Number of menu object
x
Number of levels
x
Number of pages
=
Total number of pages

Example:

10 menu items x 10 levels x 10 pages = 1000 pages

I think that's more than enough pages for a mega menu.

The mega menu on my test site has 78 pages.

To make the "Mega Menu" button respond to mouseover and only once, I inserted an HTML object with this codes in the header, see the two codes (HTML / JavaScript and CSS) below.

Adjust the menu name, the HTTPS address and the colors in the code according to your own wishes.

----- Screenshot -----

----- (1) HTML and JavaScript -----

<button id="meinButton" onmouseover="ladeSeiteEinmal()">Mega Menü ▽</button>
<script>
function ladeSeiteEinmal() {
// Hier die gewünschte Ziel-URL eintragen
window.location.href = "https://findelinks.de/123test-cosmetics/menues.html";
}

// EventListener stellt sicher, dass das Mouseover nur einmal feuert
document.getElementById("meinButton").addEventListener("mouseover", ladeSeiteEinmal, { once: true });
</script>

----- (2) CSS -----

button {
padding: 10px 20px;
font-size: 16px;
background-color: #007BFF;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
}

button:hover {
background-color: #0056b3;
}

When mouseover on "Mega Menu" the page only loads once in Chrome, but Firefox and Edge load the page over and over again on mouseover.

Maybe a JavaScipt expert knows how to prevent constant loading on mouseover.

-----

-----

I have not yet found a solution to the problem of the page constantly loading on mouseover.

I have now adjusted the color of the button for the mega menu, see screenshot (1)

To find the correct colors to specify in the CSS code, you can look in the color selection for the button object, see screenshot (2)

Maybe Incomedia can add a mega menu like this in future versions, but until then you'll just have to use my solution.

----- (1) -----

----- (2) -----

Finally, a simple but nice variant with only 1 menu object on 1 page, which is linked in the menu.

----- Screenshots -----

-----

-----

A lot of pages can also be added to the mega menu.

Example:

10 levels x 10 sublevels x 10 pages = 1000 pages

My wish to the developers of WebSite X5:

Incomedia would only have to add an option to the levels in the sitemap so that the link switches to the linked page when the level is mouseover, see

----- screenshot -----