Trying to build your website in Divi but keep getting stuck on what a Section actually is? You’re not alone. Divi throws around terms like “Rows” and “Modules” like everyone took the same secret class, but most people are left thinking, “Isn’t this just one big box?”
Let’s fix that.
Because once you understand what Divi sections, rows, and modules are, the whole thing starts to make a whole lot more sense. And instead of clicking around in a blind panic, you’ll be able to tweak things calmly and confidently (yes, really).
First, the big picture: Divi is like a shelf.
If your page was a shelving unit, it would be made up like this:
- Sections = the big shelves
Think of a Section as one long shelf on the wall. It holds everything together and can have its own background colour or image. It’s your structural base. Every page starts with at least one Section. - Rows = the dividers inside your shelf
These are what split your Section into columns. One Row might be full-width, or it might split into halves, thirds, or quarters. The key thing? Rows organise the space inside your Section. - Modules = the stuff you actually see
Modules are the content: your text, images, buttons, forms, galleries, and more. Each one sits inside a column, which sits inside a Row, which sits inside a Section. Nested like little digital Russian dolls.
Divi sections, rows, and modules help you build flexible, responsive layouts that don’t fall apart when someone opens your site on their phone.
Why it matters: structure = sanity.
When you understand the hierarchy of Divi sections, rows, and modules, you stop fighting the builder. Ever spent ages trying to move something, only to have it jump around or disappear completely? That’s usually because you’re editing the wrong level.
📦 Want a background image across the whole page?
Add it to the Section.
📦 Want a two-column layout?
Set it up in the Row.
📦 Want to change your text?
Edit the Module.
Learning where each setting lives is half the battle, and once you get it, everything speeds up.
Real-world example: a homepage hero section
Let’s say you want a big bold welcome section at the top of your homepage.
You’d:
- Add a Section → this gives you the full-width space, and you can give it a background colour or image.
- Add a Row with one column.
- Add a Text Module with your headline.
- Maybe add a Button Module underneath.
- Adjust spacing in the Row to centre everything nicely.
This one stack is your ‘hero section’ and once you’ve built one, you can duplicate and tweak it as needed. Magic.
Top tips to avoid the usual Divi headaches
🛠 Save your best bits to the Divi Library. Got a section layout you love? Don’t rebuild it. Save it and reuse it.
📱 Always check mobile. Divi tries to be helpful by rearranging your layouts for smaller screens, but sometimes it goes rogue. Use the responsive view to make sure things look good on phones too.
🧭 Keep an eye on spacing. Padding is the space inside the box. Margin is the space outside it. If things look weird, check both, especially at all three levels (Section, Row, and Module).
One last thing…
If you’ve ever opened the Divi builder and immediately felt like you were trying to assemble a wardrobe with no instructions and one missing screw, this is your sign that you’re not doing it wrong. You’re just learning.
And learning how Divi sections, rows, and modules work makes all the difference.
You’ve got this. One section at a time.
