• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2662

Original Genesis Tutorials & 5000+ Guaranteed Code

Snippets

  • Support
  • Newsletter
  • Videos
  • Log in

Premium Member? - Request custom code

How To Add Content Columns in WordPress

In this tutorial, i’ll show you how to create simple content columns.

You can add any type of content in these columns including colored boxes, images, HTML, numbered/bullet lists, text, opt in boxes, social share/follow buttons etc.

I’ll be using the content column classes for the Genesis theme framework and StudioPress themes.

2 Column Content

Simply paste this code into your HTML editor and replace the text in between the tags with your own content.

Here’s an example of what can be done:

Enter content box text here.

You can add HTML, text, video script, social buttons, an unordered or numbered list. You could then use a hook plugin to display these columns and content anywhere

image in content column

You could also use colored content boxes and add widget content using shortcodes in your content columns.

The rumor is, Genesis theme owners will be able to add content columns and many other useful functions anywhere in their themes using shortcodes soon.

These will be built into the framework when Genesis 2.0 is released later this year.

Learn more about content column classes.

Display Locations

You can display your content columns anywhere within your content area using your html editor.

You could also install a hook plugin and display them anywhere there’s a hook in your theme.

Popular locations are:

  • after post content
  • on a custom homepage
  • landing or sales page

Content Column Plugins

There’s a range of free plugins available from the official WordPress plugins directory. Simply search for content column plugins using the search feature.

Or you could install a shortcodes plugin which includes columns and simply add the shortcodes before and after your content.

Shortcodes can also be used with a hook plugin.

Other Options

  • Responsive Uneven Columns Using HTML & CSS
  • Split Widgets 50/50 Side by Side

Reader Interactions

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

PHP Code

template_include

get_body_class

if else

array

class_exists

foreach

sprintf

add_action

printf

variable

Advertise · WPEngine · Genesis · Log in

  • How Premium Membership Works
  • Sign Up
  • Support
  • Subscription Details/Invoice
  • Tagged Tutorials
  • Access-Download Problems