Pro Headers disappear on smaller screens

[Promova]

Hi there,

I created 2 Pro headers on my website that displays beautiful on a full sized computer screen. But when you size the window down, the logo gets really tiny and then the whole menu disappears when sized down to tablet and mobile size.

I searched previous topics in the forum which said to disable 3rd party plugins and clear cache. I did that and it still does not show up.

I appreciate your help in advance.

Thanks
Adrien

[nabeel]

Hi Adrien,

Thank you for reaching out to us. I checked your setup and the menu disappears because you’re hiding the containers that has the navigation and the logo elements (in the medium, small and extra small screens).

Instead of hiding the containers, you need to setup two different bars and then hide them separately for different viewpoints so that you have desktop menu as well as mobile menu. To do this simply duplicate your Desktop Bar (the Bar that currently contains Navigation element and the logo) to have the same Bar setup and rename it to let’s say Mobile Bar (see screenshot)

Inspect your Mobile Bar and remove the Navigation Inline element and add Navigation Collapsed element in replace of your Navigation Inline element

In the Mobile Bar settings and go to Customize tab and hide it for large screens (see screenshot)

Now you need to hide the desktop bar in smaller screens, to do this repeat the above process for Desktop Bar and hide your desktop menu in small devices.

Let us know how this goes!