After our writeup about how to create tables in WordPress, we noticed that several users were using tables to create multi-column layouts for their WordPress pages. Ideally you should use HTML and CSS to create column layouts. For beginners who don’t know CSS, then this article is for you. In this article, we will show you how to add multi-column content layout in WordPress posts and pages without knowing any HTML or CSS.
Video Tutorial
If you don’t like the video or need more instructions, then continue reading.
First thing you need to do is install and activate Advanced WP Columns plugin. After activating the plugin, you need to go on a post or page edit screen in your WordPress dashboard. There you will notice a new “Advanced WP Columns” button in the visual editor.
When you click on the button, it will bring up the Advanced WP Columns user interface which looks like this:
This simple user interface allows you to easily create column layouts. You can click on the Empty button to choose from pre-made, two, three, or four columns layouts. You can also drag the Add button to the columns bar to create new columns and then adjust the column width by dragging the handles on the column bar.
To delete a column, you can drag and drop the Remove button to the column you want to remove.
You can directly add text into your columns from WP Advanced Columns user interface. It allows you to perform some basic formatting on the content inside columns. Once you are satisfied with the columns, you can click on the Add Columns button to add them into your post or page.
Advance level users can configure the plugin settings from Settings » Advanced WP Columns to use their own custom width and CSS classes for columns.
We hope this article helped you add multiple column content in your WordPress posts and pages. For feedback and questions you can leave us a comment below or join us on Google+.
Hi
How do I write in 1 column and then 2 columns for next paragraph and then back to 1 column for the 3rd p/graph?
Any help much appreciated?
Thanks
Rob
Why can’t we just elementor or any such page builder plugin. It is a lot more easier to use with so many additional features.
This plugin has not been updated for 3 years and to top it all it won’t work with Gutenberg plugin
Hello,
I tried adding columns to one of my pages and the Advanced Column button did not appear. I checked my plugins and it said it’s installed. Do you know what the problem would be?
Thank you!
Jenny
You need to install an advanced visual editor such as TIny MCE in order to see the button. It won’t display on the standard default visual editor. Just had the same problem but it now shows after installing the above which is free.
Hope that helps
Rob
Great. Just what I was looking for and finally, someone who can explain everything step by step.
I installed the plugin and activated it. It is displaying as “activated.” Still, there is no button. How do I troubleshoot this; I already know how to install a plugin so that fix is not applicable.
Installed the plugin with a basic free theme, and the column button never appeared in my Pages editor. I know you’re not the creator of the plugin, just wanted to share our experience
upon pasting from text edit, the text spacing is weird as there are no “clean format” selection for advance WP column.. how can you fix it?
Hey, this sounds great! But how will it look on phones? I’m using a similar plugin to have two columns, one for Norwegian and one for English. But when people read my blog via phone, the second column comes right after the first column so it looks like a full text – in two different languages!
What plug in are you using to display two columns of text? I am trying to do the same for English and Esperanto.
How do you activate the puglin??
Hey Elizabeth,
Please see see our step by step guide on how to install a WordPress plugin.
Is there a way to ensure the text in these columns displays as a list, i.e. with hard line breaks between items rather than as a single block of run-on text?
Many thanks in anticipation of your advice
Is there a way to five these columns a background color?
I cannot copy/paste material that I have already typed , into these columns.
i am using wordpress version 4.5 , but this plugin is not compatible with my theme can i use this plugin for my theme ??
Can you add images to each column? Or can you add action buttons to each column?
Yes.
Columns working but when trying to embed VIDEO within columns only text of the code is showing…
It looks good when columns are added to the post, but when I look at it published it has reverted to 1 centered column. I’ve tried it multiple times and in two browsers. Any thoughts?
This is by far the easiest plugin. I REALLY want to use it.
Many thanks,
Daniel
Can you add images to each column? Or can you add action buttons to each column?
Hi,
My site uses the responsive Customizr theme, and I don’t wanna lose that responsiveness. Can I add responsive columns using this plugin?
Ηι!
Is there a way to present a layout with columns but not one post with 2-3-4 columns etc.?
Each column withing a page will be a seperated post. Something like Joomla’s Blog Layout…
For that you would want to look into a multi column WordPress theme, there are plenty of such themes out there.
Thank you! I’ve been wanting to learn how to do this for a while now – all good now! xx
This is exactly what I needed! Been trying to use tables for columns and getting so frustrated. Thank you, thank you, thank you!
I must say – if you need to use multiple columns on a regular basis, this looks like a great solution even if you DO know HTML/CSS! Love the fact that they included a breakpoint in the Options for adapting to responsive designs…