Last time I posted a function to split text content into columns which didn’t really work for lists, images basically anything that wasn’t paragraphs. Not ideal. So below you will find a little function that will break anything it finds in the_content into two columns. Bang!.
/**
* Columnize the post content
*/
function nmm_add_some_columns($content){
$doc = new DOMDocument;
$doc->loadHTML($content);
foreach($doc->getElementsByTagName('*') as $node) {
if($node->nodeName != 'html' && $node->nodeName != 'body') {
$slices[] = $doc->saveHTML($node);
}
}
if(isset($slices) && is_array($slices)) {
$breakpoint = ceil(count($slices)/2);
if($breakpoint >= 1) {
$b=0;
$output = '<div class="columns first">';
foreach($slices as $key => $s) {
if($b==$breakpoint && $breakpoint >= 1) {
$output .= '</div><div class="columns last">';
}
$output .= htmlspecialchars_decode($s); $b++;
}
$output.= '</div>';
$content = $output;
}
}
return $content;
}
add_filter( 'the_content', 'nmm_add_some_columns', 999 );
You can use the same css from last time as an example, however you might want to style your lists, images etc within the columns at wider screen widths…
