Secret weapon how to promote your YouTube channel
Get Free YouTube Subscribers, Views and Likes

How to Build Content Boxes the RIGHT Way in WordPress Using Kadence Blocks

Follow
StartBlogging101 - WordPress Without Page Builders

In this video, I'll show you how to build content boxes the RIGHT way in WordPress using Kadence Blocks. The content boxes will have evenheight containers and bottomaligned buttons so your website looks professional.

You will also get access to 36+ WordPress content box templates built with Kadence Blocks and 100% free to use on your site.

IMPORTANT LINKS:
Kadence Blocks Content Boxes Blog Post Tutorial: https://startblogging101.com/kadence...
Custom CSS For BottomAligned Buttons:
https://startblogging101.com/kadence...
Start Blogging Blocks: https://startbloggingblocks.com/
Start Blogging Blocks Free License: https://startbloggingblocks.com/free/
Content Box Templates: https://startbloggingblocks.com/conte...
Start Blogging Themes: https://startbloggingthemes.com/
Discover SB Theme: https://startbloggingthemes.com/disco...
Discover Theme Live Demo: https://discover.startbloggingthemes....

If you search "same height" in any WordPress group, you'll see pages of results of people wondering how to build content boxes on their website with sameheight containers.

The Problem: The Info Box block in Kadence Blocks doesn't use sameheight containers when you set your Row Layout to have Inner Column Height 100%. So, you have to use minheight or other hacky workarounds.

Partial Solution: Create a Row Layout with the appropriate amount of columns and put an icon, headline, text, and a button in there. Setting the Inner Column Height 100% will make your containers the same height yay! But... if your text is different lengths, your buttons won't be even. Ideally, the button would be bottomaligned to each of your containers so they look uniform. Also, this takes more time to do.

The Solution: I wanted everyone using Kadence Blocks to not have to worry about this problem anymore. So, I created this content box tutorial and released 36+ free Content Box designs in Start Blogging Blocks that are all built the right way.

Benefits:
All your containers will be even height with buttons bottomaligned to the containers
Since you're using Sections, you aren't limited to the Info Box options. You can add any block you want to your container
You can super easily swap the button with any of our 24+ button designs
There are Content Box designs that are 2column, 3column, or 4column that are all perfectly tweaked to be mobilefriendly

Hope you enjoy!

Table of Contents
0:00 Intro
0:39 Free Content Box Templates
2:13 Install Kadence Blocks
2:52 FullWidth Page Settings
3:39 Add Hero Section
4:59 Add Row Layout
7:53 Style Sections
12:23 Content Box Icon
13:51 Content Box Headline
15:27 Line Height Comparison
16:40 Headline HTML Tag
17:51 Content Box Paragraph
18:39 Content Box CTA Button
21:23 Copy Content to Other Sections
24:09 Set Columns to Equal Height
25:22 BottomAlign Buttons to Container
28:03 SB Blocks Content Boxes Demo
28:54 Outro

**************************

OTHER LINKS:
Recommended Hosting: https://startblogging101.com/hosting/

☁ Rocket.net Fastest hosting and easiest to pass Core Web Vitals Get first month for ONLY $1: https://startblogging101.com/rocketne...

FREE 7 Days to WordPress Speed Mastery Email Course: https://startblogging101.com/wordpres...

Kadence Discount Code: 10% OFF any bundle using code SB10OFF

✅ Kadence Full Bundle: Includes Kadence Theme Pro + Kadence Blocks Pro + Kadence Cloud + Pro Starter Templates and much more: https://startblogging101.com/kadence... (10% OFF Use Code SB10OFF)

✅ Kadence Theme Pro: https://startblogging101.com/kadencepro'>https://startblogging101.com/kadencepro (10% OFF Use Code SB10OFF)

✅ Free Kadence Theme download: https://startblogging101.com/kadence

I’d love it if you joined my completely free Start Blogging 101 Community Facebook Group, a group of rockstar individuals passionate about building fast, profitable WordPress sites with Gutenberg. Come join and say hi!

Start Blogging 101 Facebook Community:   / startblogging101  

Start Blogging 101 Facebook Page:   / startblogging101  

**************************

My channel is supported by my viewers. If you purchase through a link in my description, I may earn a commission which allows me to continue providing tutorials and content for all of you. I appreciate all your support!

#kadence #gutenberg #webdesign

posted by Deniceag