I have received a couple requests lately asking me how to split content into columns in WordPress without messing with CSS and HTML. For the past couple years I have used the byBrick Columns plugin, and it still works great.
The plugin uses percentage widths, so the columns will work in any theme. All you need to do is place the appropriate shortcode in your content editor, put your content inside the opening and closing shortcode, and the plugin handles the rest.
The plugin automatically adds CSS to create the columns, and even stacks columns on small screens so your content won’t get squished.
Using the byBrick Column Shortcodes
Without the shortcode, the content stacks on top of each other.
Using the [one_third][/one_third] shortcode, you can layout each of the 3 “content modules” into a column. For the last “content module”, make sure you use the [one_third_last][/one_third_last] shortcode. This tells the plugin that this is the last column, and it will automatically clear any floats to keep the rest of your page layout working correctly.
Here is the same content, but using the shortcodes above.
And here is the code to create the columns.
The plugin comes with different column shortcodes, all you have to do is change the wording.
For example, to make columns that are 75% and 25%, use the shortcode [three_fourth][/three_fourth] and [one_fourth_last][/one_fourth_last]. With this logic, you can create almost any column layout you will need.
You can follow the plugin’s development on Github.
If you have another column shortcode plugin you like to use, let me know in the comments!
