Chances are, you’ve been building content boxes the wrong way on your websites.
What are content boxes, you may ask? Content boxes are one of the most common sections used in building websites.
Imagine a website with a hero section at the top. Below it, individual content boxes showcase various products, services, or information.
How many websites have you been on with content boxes like this?
How many websites have you been on with content boxes like this?
The vast majority of websites that use content boxes look like this. I don’t know about you, but that makes my eye twitch looking at it. Perhaps it’s the perfectionist in me. 🤷♂️
They have uneven heights, and it looks unprofessional.
A partial solution is to set the column height to 100%, forcing the containers to be even heights.
However, this poses another problem. The content boxes look good with even heights, but our buttons are at different heights and aren’t aligned on the bottom.
What you actually want to do is this:
- Make all boxes even height
- Bottom-align the buttons so they all match up
Plus, I’ll give you access to 36 free content box templates all built the right way that you can start using on your website within minutes.
Let’s get right into it.
Use the WordPress content boxes tutorial guide below to jump around as you need:
Kadence Blocks Content Boxes Video Tutorial
If you’re a visual learner, then check out my detailed video tutorial teaching you how to build content boxes the right way in WordPress using Kadence Blocks:
WordPress Content Boxes – Free Templates
Before I teach you how to build content boxes correctly in WordPress, I have built 36 content box templates for you that are 100% free to access forever.
In fact, you don’t even need to take the time to build the content boxes themselves because I have templates for nearly every use case (2-column, 3-column, and 4-column).
They’re all built using Kadence Blocks and are all part of the Start Blogging Blocks library, which you can connect to in 30 seconds after receiving your free license.
1. Add Row Layout
The first step to building content boxes on your website with Kadence Blocks is to add a Row Layout block, which will be our top-level container.
In the WordPress block editor, a shortcut to add any block is to type a forward slash ‘/‘ and then the name of the block.
So, in this case you can type “/row layout” in the editor and you’ll see the Kadence Row Layout block show up. Choose that.
