Archived topic
Simple Hero Design
1 reply · Started by Claire on March 25, 2020
Viewing posts 1–2 of 2
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
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>
This archived topic is closed to new replies.
