Dynamic Rows Shortcode for wordpress

Question

i'm trying to add a shortcode to set a grid in wordpress content. My theme is based on foundation5 So I made a new file called "Shortcodes.php" and load it in the functions.php . I inserted the following code to the shortcodes file

<?php 
function spalten_zeilen_function($atts, $content = null) {
    extract(shortcode_atts(array(
        'width' => '',
        'position' => '',
        'vertical' => '',
    ), $atts));

    if ( $position == 'first' ) {
        $return_string = '<div class="row '.$vertical.'">';
    }
    $return_string = '<div class="small-'.$width.' columns '.$position.';">';
    $return_string = do_shortcode($content);
    $return_string .= '</div>';
    if ( $position == 'end' ) {
        $return_string = '</div>';
    }

    wp_reset_query();
    return $return_string;
}
function register_shortcodes(){
    add_shortcode('grid_shortcode', 'spalten_zeilen_function');
}
add_action( 'init', 'register_shortcodes');
add_filter('widget_text', 'do_shortcode'); // Shortcodes auch in Widgets ausführen
add_filter( 'comment_text', 'do_shortcode' ); // Shortcodes auch in den Kommentaren ausführen
add_filter( 'the_excerpt', 'do_shortcode'); // Shortcodes auch in den Excerpts ausführen

?>

So what I want to do is to open a new row if the shortcode handles the first content. Afterwards I want to set the width of the column and, if the shortcode handles the last content an end tag. After that the content itself follows, followed by a closing div for the row if it's the last content.

The rendered shortcode looks like

[grid_shortcode position="first" width="6" vertical="valign-top"]Fügen Sie hier den den gewünschten Inhalt Ihrer neuen Spalte ein.[grid_shortcode]

So I would expect something like

<div class="row"><div class="small-6 columns first">
Fügen Sie hier den den gewünschten Inhalt Ihrer neuen Spalte ein.</div>

Or like

[grid_shortcode position="end" width="6" vertical="valign-top"]Fügen Sie hier den den gewünschten Inhalt Ihrer neuen Spalte ein.[grid_shortcode]

So I would expect somethin like

<div class="small-6 columns end">Fügen Sie hier den den gewünschten Inhalt Ihrer neuen Spalte ein.</div></div>

But it just kills my template. Any idea or suggestions?

Thank you guys!

Answer 1

Actually it was just missing dots....

<?php 
function spalten_zeilen_function($atts, $content = null) {
    extract(shortcode_atts(array(
        'position' => '',
        'width' => '',
        'vertical' => '',
    ), $atts));

    $return_string = '';
    if ( $position == 'first' ) :
        $return_string .= '<div class="small-12 columns"><div class="row '.$vertical.'">';
    endif;
    $return_string .= '<div class="small-'.$width.' columns '.$position.';">';
    $return_string .= do_shortcode($content);
    $return_string .= '</div>';
    if ( $position == 'end' ) :
        $return_string .= '</div></div>';
    endif;

    wp_reset_query();
    return $return_string;
}
function register_shortcodes(){
    add_shortcode('grid_shortcode', 'spalten_zeilen_function');
}
add_action( 'init', 'register_shortcodes');
add_filter('widget_text', 'do_shortcode'); // Shortcodes auch in Widgets ausführen
add_filter( 'comment_text', 'do_shortcode' ); // Shortcodes auch in den Kommentaren ausführen
add_filter( 'the_excerpt', 'do_shortcode'); // Shortcodes auch in den Excerpts ausführen