The details shared here apply to the most recent versions of Parallax and Retina. To keep your theme up to date, check out this helpful document.
If you find that some or all of your page content is covered or not visible, as shown in this example image, you may need to adjust your "Content area top padding" settings.
Conversely, this setting can also be used to add additional space between your header and content.
To adjust this setting:
Step 1: Go to Sales Channels > Online Store > Themes > Customize.
Step 2: Under Sections > click into Header.
Step 3: Look for the "Content area top padding" setting and increase it (you can also decrease it if you find there is too much space between your header and the page content).
Please note: this setting has a minimum and maximum that varies depending on your theme.
Tips and notes
- Setting the padding value lower or higher than range minimum or maximum will likely cause undesirable effects and make your site difficult to use, particularly on smaller tablets and laptop screens.
- If you would like to adjust the spacing outside of these ranges, you will need to hire a developer to add some custom CSS, though please be aware that a header bar higher than the maximum allowed will likely make your site difficult to use on tablets and or smaller laptops.
- This setting will affect all pages in your theme. If you need different settings on different pages, you'll need to hire a developer.
- This setting does not affect the spacing of your mobile menu.
- You may also find it helpful to experiment with adjusting the logo width, logo top padding or navigation bar top padding settings, also available in the "Header" section settings. Reducing any or all of these values can, depending on the design of your site, make the bar "fit" in the space better.