How to Use Mobile Header with Above and Below Headers in Astra?

No results found. Try again with different words?

Search must be at least 3 characters.

    Mobile Header with Above/Below Header

    Mobile Header addon available with Astra Pro version 1.4.0 and above.

    This is a premium feature available with the Astra Pro Addon plugin. To use these Pro features, you need to have the Astra theme along with the Astra Pro Addon installed on your website.

    Also, this addon adds more features to the Above Header and Below Header.

    Note:

    We have recently released the Header Footer builder in Astra version 3.0.0, due to which you will find some new changes. Please refer to the following article for the same.

    If you are below version 3.0.0 of Astra theme/ Astra Addon – You would need to activate Mobile Header and Header Sections addons from Appearance > Astra Options.

    Settings can be found under Appearance > Customize > Header > Above/Below Header > MOBILE HEADER.

    • Display on Mobile Devices: This setting lets you choose whether you want to display above/below header sections on mobile or not.
    • Merge Menu on Mobile Devices: If Menu is selected for both/either of the section in the above/below header, this option is useful. It allows choosing whether to merge above/below the header menu with the primary menu on mobile.
      • If you select it to merge, the above/below header menu will appear inside the primary header toggle button.
      • If you do not want it to merge, a separate toggle for the above/below header menu will appear on mobile.
      • This allows setting the different layout for the above/below header menu and primary header menu.
    • Swap sections on mobile devices: It will alter the sections of the above/below header on mobile. Enabling this will swap section 1 and section 2.
    • Layout: Mobile Header Alignment – This allows to display the above/below header section inline or stacked on mobile devices.
    • Mobile Header Menu Styling: Choose the Menu Style (Dropdown, Flyout or Full-Screen), add Menu Label, and set color and style for a Toggle Button.
    • Colors: You can set colors for Menu Item Border, Header Background, and Menu and Submenu Links and Background.
    • Typography: Choose Menu and Submenu font style.
    • Spacing: Add spacing to Mobile Header, Menu, and Submenu
    Astra Pro - Mobile Above/Below Header, Astra 3.0+
    Was this article helpful?
    Did not find a solution? We are here to help you succeed.

    Related Docs

    Scroll to Top

    Download is Just A Click Away!

    Be among the first to try the beta version of Astra’s Header Footer Builder. Filling the form will ensure you’ll be the first to learn about updates and features.

    Download is Just A Click Away!

    Enter your email address and be the first to learn about updates and new features.