You can add an extra flair to your page by making the header transparent and show a background image behind the header.
Making the header transparent is page-specific action only. On other pages, the header will have a background color that you have in the Design section or you can manage the header of each of your pages.
Before making the header transparent on any page, make sure the first section of the page consists of a full bleed image or banner.
Set the header transparent on a page:
- Hover the cursor over the page that you want to edit. Click on the three dots (3) icon.
- From the dropdown, click on Edit Content (4) option.
Alternatively, you can use the studio search option also in order to navigate to the page that you want to edit.
- Enter the page title (1) (that you want to edit) in the Search Bar.
- Click on page (2) under Site Menu Items.
- You will now reach the page builder.
- Click on the Settings (1) button to view the page settings.
- Scroll down the Settings drawer, and choose the header style (2) for the page you are working on.
- In case Default is selected, the default website header style will be used on the page. The page’s content will be placed after the header. Check out a live example.
- In case Transparent is selected, the header will be set as transparent on this page. The page’s content will be placed under the header. Check out a live example.
- If you have set the header to be transparent, you can choose the header items/menu items color (3):
- In case Default Color is selected, the header items color is inherited from the Design section.
- In case Specify Color is selected, you can click and choose the header items color.
- Finally, Save (4) the changes.
Here is an example of a page with a Normal Header:
Here is an example of a header transparent page where the Default color option is selected and the Menu color is set as #bc95d8:
Here is an example of a header transparent page where the Specify color option is selected and the color is set as #21e24d:
See a live page with the header set as transparent.