I am building a website that contains two completely separate business departments: “Computer Department” and “Construction Department”. I am using the Woodmart theme with Elementor (Free version).
For the desktop layout, everything is working perfectly. I used the Woodmart Header Builder to create two separate headers, allowing me to display the correct custom menu for each department.
The Problem & Our Goal:
When it comes to mobile devices, the “Mobile Menu (Burger Icon)” always pulls the global menu assigned to the “Mobile Side Menu” location in WordPress. Because of this, when a user visits the Construction department on a mobile phone, they see the Computer department’s menu items inside the burger menu.
We need the Construction department to be completely isolated. No computer-related links or menus should be visible anywhere on the construction pages, including the mobile view.
Since we are using Elementor Free, we don’t have access to the Elementor Pro Theme Builder’s dynamic conditions. We also cannot use the “Show Categories Menu” feature as a secondary tab in the mobile burger, because the two departments must be 100% separated from each other.
We have the custom menus and custom headers already prepared for both departments. What is the best and most reliable way to ensure that mobile users on the Construction pages see only the Construction menu when they click the mobile burger icon?
We look forward to your solution and recommendations.
Best regards,
Yavuz
.
