[Support request] Sidebar higher up

Hi there,

you would need to remove the featured image from the Hero Block so it is displayed in the default position above the content. Then we could use some CSS to overlap the hero.

This is what i would do:

Edit the Hero Block:
1. remove the Featured Image, and re-enable the featured image option so the image is displayed in the content.
2. Select the Parent Container Block.
2.1 Give it some Bottom Padding – which should be the height of the image – eg. 400px for Desktop and 300px for mobile.
2.2 In Advanced > Additional CSS Class(es) add: hero-block-overlap

NOTE i notice in your hero block there is an empty Text block below it – select it and backspace delete it or the next step wont work.

Once thats done check the site to see the image is back in the content and there is the padding space above it.

Then add this CSS:

/* Desktop overlap */
.hero-block-overlap + #page {
    position: relative;
    margin-top: -400px; 
}
/* mobile overlap */
@media(max-width:  768px) {
    .hero-block-overlap + #page {
        margin-top: -300px; 
    }
}

The only alternative to that is to add another column in your hero – beside the featured image and include some widget/blocks in that column.

Glad to be of help.