[Support request] Simple Hero Design

[Claire]

Hi,

I’ve been messing around too long on this.

Could someone please give me the simple code to put in the element for my front page hero?

I only want it simple. I want the *layout* to look exactly like this:

https://www.shedoesbusiness.co/wp-content/uploads/2020/03/credit-hero.png

It’s centered and neat.

Here’s mine!

https://www.shedoesbusiness.co/

Thank you!

Claire

[David]

Hi there,

first of in your Header Element change the Container to Contained.
Then i would get rid of the Table HTML and use a structure like this instead:

<div class="page-hero-content">
    <div class="flex-column">
        <h3>Heading</h3>
        <strong>sub heading</strong>
        <!-- List shortcode -->
    </div>
    <div class="flex-column">
        <img src="url">
    </div>
</div>

If you want to set that up i can provide the CSS to make it a responsive grid.

On mobile will the image come first ? If so then switch the HTML the other way around eg.

<div class="page-hero-content">
    <div class="flex-column">
        <img src="url">
    </div>
    <div class="flex-column">
        <h3>Heading</h3>
        <strong>sub heading</strong>
        <!-- List shortcode -->
    </div>
</div>

[Author]

Posts