How to separate homepage sections into 3 separate sections?

[jrricker]

I'd love to get the look similar to this site --> https://thaoteaco.com , which they have the 3 sections at the bottom (in the footer section). I'm using Parallax Pro as the theme and any help would be appreciated.

https://thaoteaco.com

[jrricker]

In addition to that, if you know how they Home Section 1 a giant picture and all the rest of the sections as smaller sections please let me know how to have a similar effect!

Right now, I have all the odd home sections the same size (same padding) and all of the even sections the same padding.

[CleanPageDom]

Hi there

Can you do this with column classes in the last widget on the home page? The footer on the site you linked to is just much shorter than that on Parallax, so it's still there.

Try adding:

<div class="one-third first">
CONTENT
</div>
<div class="one-third middle">
CONTENT
</div>
<div class="one-third">
CONTENT
</div>

Into a Text widget in the relevant widget area. I've added the "middle" class to the second <div> as this will then allow you to target it in style.css and add border-left: and border-right:.

Thanks
Dom

---

Let’s build a website together…

[CleanPageDom]

Oh, and I may be wrong, but I think the full-size background image in the first area may be dynamically resized with javascript. It's an effect I'd like to try too.

Dom

---

Let’s build a website together…

[jrricker]

Thanks for the response, Dom. I did that, however, and it separated the text into 3 sections but I was looking to separate the 3 widgets within the home section up. So to give you an idea of the effect I was hoping to achieve: home section 5 separated into an "about me" with text, an image, and then a subscription box using the enews extended plugin.

Thanks again for the help!

[CleanPageDom]

If I'm understanding you correctly, you need three widget areas within the Home Section 5 widget area (or rather, three areas where the home section 5 area currently sits) - You could still use the "one-third" classes, but enews extended doesn't have a shortcode, so it currently needs its own widget area.

How are you with functions.php? This could be a solution: http://sridharkatakam.com/display-widgets-columns-using-genesis-column-classes/

It adds a widget area and then allows you to assign classes to each, so you can then apply the "one-third" classes and have them arrange that way.

Thanks
Dom

---

Let’s build a website together…

[Author]

Posts