Best approach for building an advanced Mega Menu in WoodMart + Elementor

Hello WoodMart Team,

First of all, thank you for creating such a great theme.
We are currently building a pharmacy eCommerce website using:

WoodMart (latest version)
WooCommerce
Elementor Pro (v4 with Atomic Elements)

Before we start building our main mega menu, we would like to confirm the best architecture and the capabilities supported by WoodMart.
Our planned mega menu consists of:
Left sidebar with product categories
Center area with category cards (images + links)
Right promotional banner
Best sellers section
Footer CTA (“View all products”)
Our main questions are:

1. Dynamic Mega Menu
Is it possible to create a single Mega Menu where hovering over a category in the left sidebar dynamically changes:

the center category cards
the promotional banner
the best seller products

without opening another dropdown?

If yes, what is the recommended way to achieve this using only WoodMart?

2. HTML Blocks + Elementor

We plan to build the Mega Menu using an HTML Block designed with Elementor.

Is this the recommended approach for large custom Mega Menus?

Or do you recommend using native WoodMart widgets instead?

3. WooCommerce Categories

Can the left sidebar be automatically generated from WooCommerce Product Categories?

If yes:

can it support unlimited category depth?
can child categories be displayed dynamically?
4. Dynamic Products

Can the “Best Sellers” section inside the Mega Menu display WooCommerce products dynamically?

For example:

Best Sellers from the currently selected category
Featured Products
Recently Added Products

without custom coding?

5. Dynamic Banner

Can the banner displayed inside the Mega Menu change automatically depending on the selected category?

For example:

Face Care → Face banner
Hair Care → Hair banner
Sun Care → Summer banner

using built-in WoodMart functionality?

6. Performance

For a large WooCommerce store with hundreds of categories and thousands of products, which approach do you recommend?

A) One large HTML Block

B) Multiple HTML Blocks

C) Native WoodMart Mega Menu

D) Another recommended architecture

Which option provides the best balance between:

performance
maintainability
future scalability

7. Elementor Atomic Elements

We are building the entire website using Elementor v4 Atomic Elements.

Is there anything we should avoid inside HTML Blocks to maintain compatibility with future WoodMart updates?

8. Best Practices

If you were building a premium pharmacy eCommerce website with WoodMart today, what architecture would you personally recommend for the Mega Menu?

9. Reusable Components

We plan to reuse the same cards, banners and layouts from the Mega Menu across other pages of the website (home page, category pages, landing pages).

Would you recommend building these sections as reusable Elementor Templates / HTML Blocks, or is there a better WoodMart approach for long-term maintenance?

We would really appreciate your recommendations before we start development.

In your answer please mention, for the attention of Stelios.

Thank you very much for your support!

Best regards,
Stelios Lioudakis

Attachments:

You must be logged in to view attached files.

[Author]

Posts