Skip to content
Browse files

Twenty Twelve: change homepage widget areas to use columns or multipl…

…e areas instead of one big area. Fixes #21619, props obenland.

git-svn-id: http://core.svn.wordpress.org/trunk@21555 1a063a9b-81f0-0310-95a4-ce76da25c4cd
  • Loading branch information...
1 parent 6de0e77 commit 4ee38a3ca692a1572d617870770c688806a9ff84 Lance Willett committed
View
30 wp-content/themes/twentytwelve/functions.php
@@ -183,7 +183,7 @@ function twentytwelve_widgets_init() {
register_sidebar( array(
'name' => __( 'Main Sidebar', 'twentytwelve' ),
'id' => 'sidebar-1',
- 'description' => __( 'Appears on posts and pages except the optional Homepage template, which uses its own set of widgets', 'twentytwelve' ),
+ 'description' => __( 'Appears on posts and pages except the optional Homepage template, which has its own widgets', 'twentytwelve' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h3 class="widget-title">',
@@ -191,8 +191,18 @@ function twentytwelve_widgets_init() {
) );
register_sidebar( array(
- 'name' => __( 'Homepage Widgets', 'twentytwelve' ),
- 'id' => 'sidebar-home',
+ 'name' => __( 'Homepage Widgets One', 'twentytwelve' ),
+ 'id' => 'sidebar-2',
+ 'description' => __( 'Appears when using the optional homepage template with a page set as Static Front Page', 'twentytwelve' ),
+ 'before_widget' => '<aside id="%1$s" class="widget %2$s">',
+ 'after_widget' => '</aside>',
+ 'before_title' => '<h3 class="widget-title">',
+ 'after_title' => '</h3>',
+ ) );
+
+ register_sidebar( array(
+ 'name' => __( 'Homepage Widgets Two', 'twentytwelve' ),
+ 'id' => 'sidebar-3',
'description' => __( 'Appears when using the optional homepage template with a page set as Static Front Page', 'twentytwelve' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
@@ -202,6 +212,20 @@ function twentytwelve_widgets_init() {
}
add_action( 'widgets_init', 'twentytwelve_widgets_init' );
+/**
+ * Count the number of footer sidebars to enable dynamic classes for the footer
+ *
+ * @since Twenty Twelve 1.0
+ */
+function twentytwelve_homepage_sidebar_class() {
+ $classes = array( 'widget-area' );
+
+ if ( is_active_sidebar( 2 ) && is_active_sidebar( 3 ) )
+ $classes[] = 'two';
+
+ echo 'class="' . implode( ' ', $classes ) . '"';
+}
+
if ( ! function_exists( 'twentytwelve_content_nav' ) ) :
/**
* Display navigation to next/previous pages when applicable.
View
32 wp-content/themes/twentytwelve/sidebar-home.php
@@ -1,17 +1,35 @@
<?php
/**
- * The Sidebar containing the homepage widget area.
+ * The Sidebar containing the homepage widget areas.
*
- * If no active widgets in this sidebar, it will be hidden completely.
+ * If no active widgets in either sidebar, they will be hidden completely.
*
* @package WordPress
* @subpackage Twenty_Twelve
* @since Twenty Twelve 1.0
*/
+
+/*
+The homepage widget area is triggered if any of the areas
+have widgets. So let's check that first.
+
+If none of the sidebars have widgets, then let's bail early.
+*/
+if ( ! is_active_sidebar( 2 ) && ! is_active_sidebar( 3 ) )
+ return;
+
+// If we get this far, we have widgets. Let do this.
?>
+<div id="secondary" <?php twentytwelve_homepage_sidebar_class(); ?> role="complementary">
+ <?php if ( is_active_sidebar( 2 ) ) : ?>
+ <div class="first home-widgets">
+ <?php dynamic_sidebar( 'sidebar-2' ); ?>
+ </div><!-- .first .home-widgets -->
+ <?php endif; ?>
- <?php if ( is_active_sidebar( 'sidebar-home' ) ) : ?>
- <div id="secondary" class="widget-area" role="complementary">
- <?php dynamic_sidebar( 'sidebar-home' ); ?>
- </div><!-- #secondary .widget-area -->
- <?php endif; ?>
+ <?php if ( is_active_sidebar( 3 ) ) : ?>
+ <div class="second home-widgets">
+ <?php dynamic_sidebar( 'sidebar-3' ); ?>
+ </div><!-- .second .home-widgets -->
+ <?php endif; ?>
+</div><!-- #secondary .widget-area -->
View
14 wp-content/themes/twentytwelve/style.css
@@ -1433,18 +1433,28 @@ img#wpstats {
float: right;
width: 47.916666667%;
}
- .page-template-homepage-php .widget-area .widget {
+ .page-template-homepage-php .widget-area .widget,
+ .page-template-homepage-php .widget-area.two .home-widgets {
float: left;
width: 51.875%;
margin-bottom: 24px;
margin-bottom: 1.714285714rem;
}
- .page-template-homepage-php .widget-area .widget:nth-child(even) {
+ .page-template-homepage-php .widget-area .widget:nth-child(odd) {
+ clear: right;
+ }
+ .page-template-homepage-php .widget-area .widget:nth-child(even),
+ .page-template-homepage-php .widget-area.two .home-widgets + .home-widgets {
float: right;
width: 39.0625%;
margin: 0 0 24px;
margin: 0 0 1.714285714rem;
}
+ .page-template-homepage-php .widget-area.two .widget,
+ .page-template-homepage-php .widget-area.two .widget:nth-child(even) {
+ float: none;
+ width: auto;
+ }
}
/* Minimum width of 960 pixels. */

0 comments on commit 4ee38a3

Please sign in to comment.
Something went wrong with that request. Please try again.