Page Comparison

...

1. Create an image that shows your logo on a coloured background, with the proportions 3:1. Place the logo in the middle, leaving coloured space above and below it.

2. Go to the Theme editor > Main Appearance and make the following settings:

   • 

   • Background: upload your image

   • Image options: full

   • Position image: centered

   • Banner height: the same height as your background image, or half of it.

3. In Theme editor > Header, set the background colour to transparent.

4. In Theme editor > Start page, toggle on Fill background.

5. In Theme editor > Site Homes, choose one of the two bottom options (Alternate or Wide Alternate)

   • Image Modified

6. Save the theme and go to the home page of the site you applied the theme to.

7. Edit the layout, and:

   • Make sure the section is set to Transparent.

   • Add a Search Highlight or Navigation Highlight module

   • Set the module’s height to match the height of your background image. In our example, this is 500 pixels.

...