DISCLAIMER: this post is older than one year and may not be up to date with latest WordPress version.

Today, here one of the top most wanted WordPress hacks: Displaying post content in columns. In this recipe, you’ll learn how to easily do it without any plugin.

To split your post content in columns, the first thing to do is to format your posts that way:

potential content goes here that appears before the columns.
[--column--]
Content for column 1 here.
[--column--]
Content for column 2 here.
[--column--]
Content for column 3 here.

Once done, open your single.php file and the following code within the loop:

<?php
$page_columns = explode("[--column--]", $post->post_content);
print $page_columns[0];
print '<div class="column first">';
print $page_columns[1];
print '</div>';
print'<div class="column second">';
print $page_columns[2];
print '</div>';
print '<div class="column third">';
print $page_columns[3];
print '</div>';
?>

The last part is css styling. Open your style.css file and paste the styles below in it:

.column{
  width:33%;
  float:left;
  margin-right:10px;
}

column.first, column.second, column.third, {
  /* Customize to fit your needs */
}

That’s all, you can finally display your posts in three columns!

Thanks to krimsly for this awesome recipe!

Leave a Comment

Your email address will not be published. Required fields are marked *