Columns DIY
by Corey McKrill on WordPress.org
Simple shortcodes for div-based columns and rows. Wrap desired content in [column][/column]. Mark the end of a row with [endrow]. CSS not included.
This plugin is intended for theme developers and others who want to have full control of their column styles while still providing a quick and easy framework for adding/editing column content via WordPress’s visual editor. It eliminates the need to type tedious, unmanageable chunks of HTML into the editor when specific posts or pages require a columnar layout.
That said, this plugin is not plug-and-play. It does not include any styles out-of-the-box, so if you start using the shortcodes without adding appropriate CSS rules, there probably won’t be any visible changes to your content.
See the Recipes page on the GitHub wiki for some styling examples.
Usage
- Designate each column with
[column]and[/column] - Mark the end of a row with
[endrow]
Features
- Includes enumerated column and row classes, allowing for per-column and -row styling. Also includes parity classes (odd/even) for striping.
- If a user forgets to add the last
[endrow]shortcode, the plugin will automatically insert a closing
wpautop() function.Example
Putting this into the visual editor:
[column]This is the column of Foo.
[/column]
[column]This is the column of Bar.
[/column][endrow]
Will result in this output:
This is the column of Foo.
This is the column of Bar.
Parameters
The following optional parameters can be added to the [column] shortcode:
- class (String : ”)
Classes for the columnelement. Separate multiple classes with spaces.- rowclass (String : ”)
Classes for the rowelement. Only works when included with the first[column]shortcode in a row.- style (String : ”)
Inline styles for the columnelement.- rowstyle (String : ”)
Inline styles for the rowelement. Only works when included with the first[column]shortcode in a row.- norow (Boolean : false)
Set to true to omit the row wrapper.Filters
The following filter hooks can be used to alter the output of the shortcodes:
diy_colclassdiy_colstylediy_columndiy_rowclassdiy_rowstylediy_beginrowdiy_endrow
Active installations10+Weekly downloads6-14.29%Version1.1Last updated4/19/2014WordPress version2.8Tested up to3.9.40Tagscolumnsshortcode - rowclass (String : ”)
