• Skip to primary navigation
  • Skip to main content
  • Skip to footer
Amethyst Website Design logo

Amethyst Website Design

Affordable WordPress Website Design for Small Business

  • Home
  • About
  • Services
  • Praise
  • Portfolio
  • Blog
  • Contact »

WordPress Tutorials Themes, Widgets & Plugins

How to Add Columns to Your WordPress Posts

December 17, 2013 Updated on December 13, 2018 Marcy Diaz

Share this post:

Share on TwitterShare on FacebookShare on PinterestShare on LinkedInShare on Email

coconut cookie recipe in two column post grid
Occasionally you will have some content, like a recipe or pricing table, that you will want to place in columns in your WordPress website or blog. Some themes, such as the Genesis child themes, come with column classes, but because you need to switch from the Visual editor tab to the Text editor tab to use them, it may be more complex than you like.

This tutorial makes it easy to use a plugin to add columns to your WordPress post content, whether or not your WordPress theme comes with columns. I reviewed several plugins, and Grid Columns by Justin Tadlock seemed the easiest to use. The advantage of using a plugin is that your columns will still be there if you change themes. Other benefits are that you can actually see where your columns are in the Visual editor, and that you can tell at a glance how many columns you have.

And since it’s the holiday season, and we’re all busy, I’m sharing some easy coconut cookie recipes with the ingredient list in two columns.

How to Use the Grid Columns Plugin

  1. Install and activate the Grid Columns plugin in your WordPress dashboard.
  2. The plugin has no settings, so you are ready to go.
  3. Create a new post in the Visual editor tab, as usual.
  4. Add shortcodes with the content for each column; see examples below.

Add Two Columns

These are the column shortcodes to add two columns to your WordPress post.
two column shortcode for post content

Notice that each column starts with “column” in brackets and ends with “/column” in brackets. This is the shortcode. You need to use two shortcodes for two columns, one for each column. You use “grid” to identify how many columns you want to use, in this case 2. (Note: I’m only showing examples for equal width columns.)

Add Three Columns

These are the column shortcodes to add three columns to your WordPress post. For three columns, you would add three column shortcodes and add grid=”3″.
add three columns to your WordPress post

Add Four Columns

These are the column shortcodes to add four columns to your WordPress post. For four columns, you would add four column shortcodes and also grid=”4″
add four columns to your WordPress post

For the cookie recipe, I’m going to use 2 columns for the ingredient list, so that it looks like this in my post editor. Notice that I’ve formatted the text inside the shortcodes with bullets and spacing, as usual in the Visual editor.
add columns to post for a recipe
And here is my daughter’s super easy, super quick coconut cookie recipe with the ingredient list formatted in two columns.

Amber’s Super-Easy Coconut Macaroons

Ingredients:

  • 1 bag sweetened flaked coconut (14 oz. or 5 cups)
  • 1 can (14 oz.) sweetened condensed milk
  • 2 teaspoons vanilla
  • less than 1/4 teaspoon baking powder

Directions:

  1. Preheat oven to 375 °F.
  2. In a bowl, mix all ingredients together well.
  3. Spread mixture evenly in greased 9 x 13 inch pan.
  4. Bake for 10 – 12 minutes at 375°F or until top is dark golden brown.
  5. Let cool and cut into bars.

Rocky Snowballs

And here’s another coconut cookie recipe, my Rocky Snowballs.
Makes 48 small cookies
Ingredients:

  • 1/2 cup sugar
  • 2 eggs
  • 1 teaspoon vanilla
  • 1/2 cup flour
  • 1/4 teaspoon baking powder
  • 4 cups flaked coconut
  • 1 cup mini chocolate chips

Directions:

  1. Beat together the sugar, eggs, and vanilla.
  2. Beat in the flour and baking powder.
  3. Fold in the coconut and mini chocolate chips.
  4. Lightly spray baking sheets with cooking spray or oil.
  5. Drop rounded teaspoonfuls of dough on baking sheet and flatten slightly.
  6. Bake at 325°F for 10 – 12 minutes until lightly golden.
  7. Remove from baking pan. Cool. These freeze well.

Have fun with adding columns to your WordPress posts. Enjoy the cookies!

(Note that I don’t use columns often, and so I removed the plugin. This means for smaller screen sizes and mobile devices, there will only be one column for the recipe ingredient lists in this post; using the plugin would always have 2 columns.)

Share this post:

Share on TwitterShare on FacebookShare on PinterestShare on LinkedInShare on Email

You can have a beautiful, hardworking website for your small business.

Tell me about your website project for a personalized solution!

Contact Marcy »

___

Do you need website tips?

Sign up to get easy-to-use WordPress tutorials, Genesis theme customizations, and other helpful tips for your small business website.

Your email address will be used to send you blog posts. Privacy Policy

___

About Marcy

Marcy Diaz

I'm Marcy Díaz, the owner of Amethyst Website Design, a small business located in Phoenix, Arizona (in Ahwatukee Foothills). I help people, like you, grow your business with an affordable WordPress website design. Sign up for my blog and website tips that help you manage your own website.

Reader Interactions

Comments

  1. Donna says

    Hi Marcy,

    I have a problem where the shortcode is showing on the actual page. Has that ever happened to you, or would you know what may be the problem? Any suggestions would be helpful.

    Thank you, Donna

    Reply
    • Marcy Diaz says

      Sometimes if you paste a shortcode into the editor when you are on the visual editor tab, it will show the shortcode in the page. For those plugins, you need to click on the Text tab of the Editor and paste the shortcode. It just depends on your plugin

      Reply

Leave a Reply Cancel reply

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

 

Footer

Meet Marcy

Marcy Diaz, Amethyst Website DesignAmethyst Website Design is a small business owned by Marcy Díaz. I help people, like you, with your website by creating an affordable WordPress website using Genesis themes to fit your business and budget. I especially love working with new and small business owners, and can help you with the online part of your business.
Read More »

Let’s Connect!

  • Facebook
  • Twitter
  • Pinterest
  • Linked In
  • GitHub

Contact Info

Amethyst Website Design

Email: Contact Marcy
Phone: 602.759.0501

PO Box 94782
Phoenix AZ 85070
Located in Ahwatukee Foothills

member of local first az
  • Sitemap
  • Cookie Policy
  • Terms and Conditions
  • Privacy Policy

© 2021   Amethyst Website Design   ◆   Log in

Using WordPress and the Genesis Framework

This site uses cookies for the best browsing experience. By continuing to use this site, you accept our Cookie Policy »OK, got it!