If I was going to be doing something like this, then I would actually build 2 shortcodes. One for the ‘boxes’ and one for the inside ‘box’. I do believe that is the only way plausable.
When you build one for the outside box, just make sure to use do_shortcode(); around the content variable. If you do not use the do_shortcode(), you will not be able to use shortcodes [] inside of another shortcode.
add_shortcode('boxes', 'shortcode_boxes');
add_shortcode('box', 'shortcode_box');
function shortcode_boxes($args, $content = null) {
extract(shortcode_atts(array(
'style' => ''
), $args));
return '<section class="'. $style .'">'. do_shortcode($content) .'</section>';
}
function shortcode_box($args, $content = null) {
extract(shortcode_atts(array(
'id' => ''
), $args));
return '<article id="'. $id .'">'. do_shortcode($content) .'</article>';
}
This is done in HTML5, but you could just change article & section to div and everything would be ok.
Usage:
[boxes class="blue"]
[box id="one"]content[/box]
[box id="two"]content[/box]
[/boxes]
You are going to want to use the Text version on the editor instead of Visual, unless you have a rewrite filter on to fix the spaces/p/br If not, you will have to use
[boxes style="blue"]
[box id="one"]
content
[/box]
[box id="two"]
content
[/box]
[/boxes]
Let me know if you have any problems, questions, or concerns.
—Edit—
Replaced style with class:
<section class="'. $style .'">
The class should be set in your style.css, in this example, blue.
.blue {
/* class style */
}