Ok, so life has intruded and I haven’t updated things here as often as I’d hoped.

So here’s a little treat: how to display your content in two columns.

Why should you display content in two columns? Narrower text columns can increase readability, especially if you have a wide ( 600px or more ) content column. There is a lot of discussion out there on the advantages of narrow text columns, give Google a shot if you’re interested.

We could create a plugin for this, but for ease of demonstration, we’ll just put it in the theme’s functions.php file. Note: with some themes like Thesis or Genesis, you may need to add this to a ‘custom’ functions file. Consult your documentation.

We will define two shortcode pairs, [leftcol] and [rightcol]. You’ll start the left column content with the [leftcol] shortcode tag, and end it with the [/leftcol] closing tag. Repeat for the right column. Shortcode tags MUST begin on a new line in your editor, or WordPress won’t recognize them as shortcodes. If you see one of the shortcode tags in your displayed post, that’s probably why.

Here is what the two columns above look like in the post editor:

[leftcol]How to do it? We're going to use the WordPress shortcode handler, and a little bit of CSS, instead of modifying a theme template. This way, if you WANT two columns, you can have them, if not, don't. Also, it's still a little problematic to split a body of text automagically using scripting.[/leftcol]
[rightcol] The columns usually NEVER break where you want. Using shortcodes to define the column content allows us to control what goes where.[/rightcol]

Here is the code:

/**********************
*
* shortcode handler for columnization of project posts
* ex: [leftcol]content here...[/leftcol]
*/
function shortcode_columnize_left( $atts, $content = null ) {
 $content = wptexturize( $content );
 $content = wpautop( $content );
 $content = '<div style="width: 45%; margin-right: 5%; float: left; text-align: justify; ">' . $content . '</div>';
 return $content;
}

/* columnize right inserts 'clear' div after content */
function shortcode_columnize_right( $atts, $content = null ) {
 $content = wptexturize( $content );
 $content = wpautop( $content );
 $content = '<div style="width: 45%; float: left; text-align: justify;">' . $content . '</div><div style="clear: both;"></div>';
 return $content;
}
add_shortcode( 'leftcol', 'shortcode_columnize_left' );
add_shortcode( 'rightcol', 'shortcode_columnize_right' );

We define functions to take the content that is between the shortcode tag pairs, run it through the same filters that WordPress uses for post content, wptexturize() and wpautop(), then spit it out within a div with a width of 45%, right margin of 5%, floated to the left, and the same with the right column but without the right margin. We add a div after the right content with a style of “clear: both” so that the rest of the page content clears the floated divs.

Then we tell WordPress to use our functions when it encounters the [leftcol] and [rightcol] shortcode tags within our post.

Voila, finit. That’s all there is to it.

I am done completely with print design and design in general. Because it’s also spring-cleaning time for my office in preparation for a move, these books really need to find a new home. I would prefer to sell them as one package, but let me know if there’s one or two that you want.

There are almost $250 worth of books here, all in good shape. They have been read, though, so they’re not pristine.

Buy-it-now price: $75 + $10 shipping, total $85. Hit the preloaded PayPal button below or at the end of the post. Yes, you can use credit card or debit card.

Or – give me an offer. I’d like to see these go to someone who can use them and will appreciate them.

Graphic effects and typographic treatments. Jim Krause, $22.99 USD. ISBN 1-58180-046-0

Brochure, poster/flyer, web design, advertising, newsletter, page layout, stationery ideas. Jim Krause, $22.99 USD. ISBN 1-58180-146-7

An index of 150+ concepts, images and exercises to ignite your design ingenuity. Jim Krause, $24.99 USD. ISBN 1-58180-438-5

Over 1100 Color Combinations, CMYK & RGB Formulas, for print and web media. Jim Krause, $23.99 USD. ISBN 1-58180-236-6

A graphic designer’s guide to designing effective compositions, selecting dynamic components & devloping creative concepts. Jim Krause, $24.99 USD. ISBN 1-58180-501-2

375+ pages of design ideas, edited by the famous David E. Carter, $29.99 USD. ISBN 0-06-008763-3

Design and Typographic Principles for the Visual Novice, Robin Williams, $14.95USD. ISBN 1-56609-159-4

The Non-Designer’s Type Book, Robin Williams, $24.99USD. ISBN 0-201-35367-9

Everything you need to know to create dynamic layouts. Graham Davis, $21.99USD. ISBN 1-58180-260-9

Design principles, decisions, projects. David Dabner, $23.99USD. ISBN 1-58180-435-0

An update: Twitter has seen fit to deprecate (discontinue) the search function that this plugin depended on. Until I can come up with some kind of solution, you should deactivate the plugin if you’re using it; you might have some unexpected errors.

Today is release day for Twavatar – Twitter Avatars For Your WordPress Blog.

It is a simple plugin that displays a commenter’s Twitter profile image in place of the standard WordPress gravatar. If a Twitter image can’t be found, the regular gravatar is displayed.

Twavatar is nice to twitter – it only looks once, and if it finds a profile URL, it caches it in your database for future use. Future versions of the plugin will have an expiry time on the cached URL to ensure avatarial freshness.

You can download the plugin from its page.