Avada includes an option to position the header to the top, left or right of your website, and set the main assigned slider position above or below the header. You can also choose to make your main header’s background transparent, or your top header too. All of these options can be selected globally in Fusion Theme Options, or individually per page or post with the Fusion Page Options, which will override the global Fusion Theme Options.Click Here To Read Our Main Header Setup Article
The Avada > Theme Options > Header > Header Content options allows you to set the header position, header layout and other custom options for your header. Choose between Top, Right, or Left. Continue reading below for an explanation on each position.
- Top Position – For Headers set to the top position, you will need to select a Header Layout. You can choose from 6 different layouts. Transparency and slider position will work when using a top header. Read more about Top Headers here.
- Right/Left Position – For Headers set to either the right or left position, you do not have to select a Header Layout. Every header content option will work with left/right header positions. Transparency and slider position will not work with left/right header. Read more about Side Headers here.
- Slider Position – You can choose to globally position the main assigned slider either above or below the header in the Fusion Theme Options. The Slider Position option in Fusion Theme Options is only available when the Header is set to the top position. You can also set the slider’s position individually in the Fusion Page Options in each page or post.
By default, any header layout you choose will have a background color set. Please note that when using top header position and have the opacity set to anything below 1 (0-.9) the header background area height disappears and the slider below it will show behind the header in its place. This option works best with a page slider or large image so it moves up behind the header as illustrated in this demo example. Continue reading below to learn how to change your header’s background color and transparency.
How To Set Header’s Background Color And Transparency
Step 1 – Navigate to Avada > Theme Options > Header > Header Styling
Step 2 – Locate the Header Background Color option
Step 3 – Click the ‘Select Color’ button and choose a color from the palette or you can enter the hexcode of your desired color manually.
Step 4 – You can set the opacity of the background color by adjusting the opacity bar on the right. Set it to 0 to make it transparent or to 1 to make it a solid color.
Step 5 – To set the header’s background color and opacity individually per page or post, navigate to the Header tab in Fusion Page Options located on every page or post you create. These options override the global Fusion Theme Options.