Add a call-to-action button to an Astra header by placing the Button element in the Header Builder, then setting its label, destination and appearance. To show a button in the mobile menu, configure it separately in the mobile view and place it in the off-canvas area.
Add a button to the Astra header
For Astra 3.0 and later, use the Header Builder to add and position the button. Astra describes the builder as a drag-and-drop layout tool with elements such as Button and Primary Menu. See Astra’s Header Builder overview.
- In the WordPress dashboard, go to Appearance > Customize > Header. Depending on the version, this area may be labelled Header Builder.
- In the header layout, add the Button element to the position you want. Drag it to the end of the menu area if you want it to appear as a distinct call to action after the navigation links.
- Open the Button settings and enter the button text, such as “Contact” or “Book now,” and its destination link.
- Use the available design controls to adjust the button’s appearance to fit the header.
- Publish the changes.
Astra’s dedicated instructions include the current Header Builder method and the button settings: How to Add Button as Last Item in Menu?
Put the button in the mobile menu
Desktop placement does not by itself configure the mobile menu. In the Header Builder, switch to the mobile device view, add the Button element to the off-canvas menu area, configure it, and publish. Astra documents these mobile steps in its button placement guide.
Use the legacy route on Astra versions before 3.0
If the site uses an Astra version earlier than 3.0 and does not have the current Header Builder workflow, Astra documents this route:
- Go to Appearance > Customize > Header > Primary Menu > Last Item in Menu.
- Select Button, then set its text and link.
These labels are from Astra’s legacy instructions; labels and available controls can vary by version. See the official guide.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Do you need Astra Pro?
Astra’s documentation identifies the desktop Toggle Button, which opens an off-canvas panel, as an Astra Pro feature for version 3.3 or later. That toggle is separate from adding a basic Button element to the header: the documentation does not establish that Astra Pro is required for every header-button configuration. If you want a button inside the panel opened by the desktop toggle, Astra lists Button as one of the panel’s possible elements. Details are in Astra’s desktop Toggle Button documentation.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
