Lego2012
9/26/2016 - 10:16 PM

WordPress: Widget aware Areas

WordPress: Widget aware Areas

/* Widget Counts */

.widget-count-2 .widget,
.widget-count-3 .widget,
.widget-count-4 .widget,
.widget-count-5 .widget,
.widget-count-6 .widget {
    float: left;
    margin-left: 2.564102564102564%;
    margin-bottom: 20px;
}

.widget-count-2 .widget:first-child,
.widget-count-3 .widget:first-child,
.widget-count-4 .widget:first-child,
.widget-count-5 .widget:first-child,
.widget-count-6 .widget:first-child {
    clear: both;
    margin-left: 0;
}

.widget-count-2 .widget {
    width: 48.717948717948715%;
}

.widget-count-3 .widget {
    width: 31.623931623931625%;
}

.widget-count-4 .widget {
    width: 23.076923076923077%;
}

.widget-count-5 .widget {
    width: 17.9487179487179488%;
}

.widget-count-6 .widget {
    width: 14.52991452991453%;
}

@media only screen and (max-width: 1140px) {

    .widget-count-2 .widget,
    .widget-count-3 .widget,
    .widget-count-4 .widget,
    .widget-count-5 .widget,
    .widget-count-6 .widget {
        clear: both;
        margin-left: 0;
        width: 100%;
    }
    
}
<?php
// Do NOT include the opening php tag

//* Setup widget counts
function dynamik_count_widgets( $id ) {
    global $sidebars_widgets;

    if ( isset( $sidebars_widgets[ $id ] ) ) {
        return count( $sidebars_widgets[ $id ] );
    }

}

function dynamik_widget_area_class( $id ) {
    $count = dynamik_count_widgets( $id );
    
    if( $count == 2 ) {
        $class .= ' widget-count-2';
    } elseif( $count == 3 ) {
        $class .= ' widget-count-3';
    } elseif( $count == 4 ) {
        $class .= ' widget-count-4';
    } elseif( $count == 5 ) {
        $class .= ' widget-count-5';
    } elseif( $count == 6 ) {
        $class .= ' widget-count-6';
    } else {    
        $class .= '';
    }
    return $class;
    
}

//* Add markup for the after ez home widget areas
add_action( 'dynamik_hook_after_ez_home', 'dynamik_after_ez_home_widgets' );
function dynamik_after_ez_home_widgets() {

    genesis_widget_area( 'after-ez-home-1', array(
        'before' => '<div id="after-ez-home-1" class="widget-aware' . dynamik_widget_area_class( 'after-ez-home-1' ) . ' clearfix"><div class="ez-widget-area clearfix">',
        'after'  => '</div></div>',
    ) );

    genesis_widget_area( 'after-ez-home-2', array(
        'before' => '<div id="after-ez-home-2" class="widget-aware' . dynamik_widget_area_class( 'after-ez-home-2' ) . ' clearfix"><div class="ez-widget-area clearfix">',
        'after'  => '</div></div>',
    ) );

    genesis_widget_area( 'after-ez-home-3', array(
        'before' => '<div id="after-ez-home-3" class="widget-aware' . dynamik_widget_area_class( 'after-ez-home-3' ) . ' clearfix"><div class="ez-widget-area clearfix">',
        'after'  => '</div></div>',
    ) );

    genesis_widget_area( 'after-ez-home-4', array(
        'before' => '<div id="after-ez-home-4" class="widget-aware' . dynamik_widget_area_class( 'after-ez-home-4' ) . ' clearfix"><div class="ez-widget-area clearfix">',
        'after'  => '</div></div>',
    ) );
    
    genesis_widget_area( 'after-ez-home-5', array(
        'before' => '<div id="after-ez-home-5" class="widget-aware' . dynamik_widget_area_class( 'after-ez-home-5' ) . ' clearfix"><div class="ez-widget-area clearfix">',
        'after'  => '</div></div>',
    ) );

}
    
//* Register after ez home widget areas
genesis_register_sidebar( array(
    'id'          => 'after-ez-home-1',
    'name'        => __( 'After EZ Home #1', 'dynamik-gen' ),
) );
genesis_register_sidebar( array(
    'id'          => 'after-ez-home-2',
    'name'        => __( 'After EZ Home #2', 'dynamik-gen' ),
) );
genesis_register_sidebar( array(
    'id'          => 'after-ez-home-3',
    'name'        => __( 'After EZ Home #3', 'dynamik-gen' ),
) );
genesis_register_sidebar( array(
    'id'          => 'after-ez-home-4',
    'name'        => __( 'After EZ Home #4', 'dynamik-gen' ),
) );
genesis_register_sidebar( array(
    'id'          => 'after-ez-home-5',
    'name'        => __( 'After EZ Home #5', 'dynamik-gen' ),
) );