Twenty Fourteen: change to just one footer widget area and use Masonry JS to display the widgets in columns. Props Frank Klein, closes #24874.
Built from https://develop.svn.wordpress.org/trunk@25065 git-svn-id: http://core.svn.wordpress.org/trunk@25051 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Lance Willett
parent
3054d405e6
commit
0a85bdc7a1
|
|
@ -11,12 +11,14 @@
|
|||
|
||||
</div><!-- #main -->
|
||||
|
||||
<?php get_sidebar( 'footer' ); ?>
|
||||
|
||||
<footer id="colophon" class="site-footer" role="contentinfo">
|
||||
|
||||
<?php get_sidebar( 'footer' ); ?>
|
||||
|
||||
<div class="site-info">
|
||||
<?php do_action( 'twentyfourteen_credits' ); ?>
|
||||
<a href="<?php echo esc_url( __( 'http://wordpress.org/', 'twentythirteen' ) ); ?>" title="<?php esc_attr_e( 'Semantic Personal Publishing Platform', 'twentythirteen' ); ?>"><?php printf( __( 'Proudly powered by %s', 'twentythirteen' ), 'WordPress' ); ?></a>
|
||||
<a href="<?php echo esc_url( __( 'http://wordpress.org/', 'twentyfourteen' ) ); ?>" title="<?php esc_attr_e( 'Semantic Personal Publishing Platform', 'twentyfourteen' ); ?>"><?php printf( __( 'Proudly powered by %s', 'twentyfourteen' ), 'WordPress' ); ?></a>
|
||||
</div><!-- .site-info -->
|
||||
</footer><!-- #colophon -->
|
||||
</div><!-- #page -->
|
||||
|
|
|
|||
|
|
@ -142,45 +142,13 @@ function twentyfourteen_widgets_init() {
|
|||
'after_title' => '</h1>',
|
||||
) );
|
||||
register_sidebar( array(
|
||||
'name' => __( 'Footer Widget Area One', 'twentyfourteen' ),
|
||||
'name' => __( 'Footer Widget Area', 'twentyfourteen' ),
|
||||
'id' => 'sidebar-3',
|
||||
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
|
||||
'after_widget' => '</aside>',
|
||||
'before_title' => '<h1 class="widget-title">',
|
||||
'after_title' => '</h1>',
|
||||
) );
|
||||
register_sidebar( array(
|
||||
'name' => __( 'Footer Widget Area Two', 'twentyfourteen' ),
|
||||
'id' => 'sidebar-4',
|
||||
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
|
||||
'after_widget' => '</aside>',
|
||||
'before_title' => '<h1 class="widget-title">',
|
||||
'after_title' => '</h1>',
|
||||
) );
|
||||
register_sidebar( array(
|
||||
'name' => __( 'Footer Widget Area Three', 'twentyfourteen' ),
|
||||
'id' => 'sidebar-5',
|
||||
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
|
||||
'after_widget' => '</aside>',
|
||||
'before_title' => '<h1 class="widget-title">',
|
||||
'after_title' => '</h1>',
|
||||
) );
|
||||
register_sidebar( array(
|
||||
'name' => __( 'Footer Widget Area Four', 'twentyfourteen' ),
|
||||
'id' => 'sidebar-6',
|
||||
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
|
||||
'after_widget' => '</aside>',
|
||||
'before_title' => '<h1 class="widget-title">',
|
||||
'after_title' => '</h1>',
|
||||
) );
|
||||
register_sidebar( array(
|
||||
'name' => __( 'Footer Widget Area Five', 'twentyfourteen' ),
|
||||
'id' => 'sidebar-7',
|
||||
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
|
||||
'after_widget' => '</aside>',
|
||||
'before_title' => '<h1 class="widget-title">',
|
||||
'after_title' => '</h1>',
|
||||
) );
|
||||
}
|
||||
add_action( 'widgets_init', 'twentyfourteen_widgets_init' );
|
||||
|
||||
|
|
@ -213,6 +181,9 @@ function twentyfourteen_scripts() {
|
|||
if ( is_singular() && wp_attachment_is_image() )
|
||||
wp_enqueue_script( 'twentyfourteen-keyboard-image-navigation', get_template_directory_uri() . '/js/keyboard-image-navigation.js', array( 'jquery' ), '20130402' );
|
||||
|
||||
if ( is_active_sidebar( 'sidebar-3' ) )
|
||||
wp_enqueue_script( 'jquery-masonry' );
|
||||
|
||||
wp_enqueue_script( 'twentyfourteen-theme', get_template_directory_uri() . '/js/theme.js', array( 'jquery' ), '20130820', true );
|
||||
}
|
||||
add_action( 'wp_enqueue_scripts', 'twentyfourteen_scripts' );
|
||||
|
|
@ -330,52 +301,6 @@ function twentyfourteen_the_attached_image() {
|
|||
}
|
||||
endif;
|
||||
|
||||
/**
|
||||
* Count the number of footer sidebars to enable dynamic classes for the footer
|
||||
*
|
||||
*/
|
||||
function twentyfourteen_footer_sidebar_class() {
|
||||
$count = 0;
|
||||
|
||||
if ( is_active_sidebar( 'sidebar-3' ) )
|
||||
$count++;
|
||||
|
||||
if ( is_active_sidebar( 'sidebar-4' ) )
|
||||
$count++;
|
||||
|
||||
if ( is_active_sidebar( 'sidebar-5' ) )
|
||||
$count++;
|
||||
|
||||
if ( is_active_sidebar( 'sidebar-6' ) )
|
||||
$count++;
|
||||
|
||||
if ( is_active_sidebar( 'sidebar-7' ) )
|
||||
$count++;
|
||||
|
||||
$class = '';
|
||||
|
||||
switch ( $count ) {
|
||||
case '1':
|
||||
$class = 'one';
|
||||
break;
|
||||
case '2':
|
||||
$class = 'two';
|
||||
break;
|
||||
case '3':
|
||||
$class = 'three';
|
||||
break;
|
||||
case '4':
|
||||
$class = 'four';
|
||||
break;
|
||||
case '5':
|
||||
$class = 'five';
|
||||
break;
|
||||
}
|
||||
|
||||
if ( $class )
|
||||
printf( 'class="%s"', $class );
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets recent formatted posts that are not featured in FC plugin.
|
||||
*
|
||||
|
|
|
|||
|
|
@ -125,6 +125,17 @@
|
|||
}
|
||||
} );
|
||||
|
||||
// Arranges footer widgets vertically.
|
||||
if ( $.isFunction( $.fn.masonry ) ) {
|
||||
|
||||
$( '#footer-sidebar' ).masonry( {
|
||||
itemSelector: '.widget',
|
||||
columnWidth: 225,
|
||||
gutterWidth: 27,
|
||||
isRTL: $( 'body' ).is( '.rtl' )
|
||||
} );
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
} )( jQuery );
|
||||
|
|
@ -1,47 +1,21 @@
|
|||
<?php
|
||||
/**
|
||||
* The Sidebar containing the main widget areas.
|
||||
* The Sidebar containing the main widget area.
|
||||
*
|
||||
* @package WordPress
|
||||
* @subpackage Twenty_Fourteen
|
||||
*/
|
||||
?>
|
||||
<?php
|
||||
if ( ! is_active_sidebar( 'sidebar-3' )
|
||||
&& ! is_active_sidebar( 'sidebar-4' )
|
||||
&& ! is_active_sidebar( 'sidebar-5' )
|
||||
&& ! is_active_sidebar( 'sidebar-6' )
|
||||
&& ! is_active_sidebar( 'sidebar-7' )
|
||||
)
|
||||
return;
|
||||
if ( ! is_active_sidebar( 'sidebar-3' ) )
|
||||
return;
|
||||
?>
|
||||
<div id="supplementary" <?php twentyfourteen_footer_sidebar_class(); ?>>
|
||||
<div id="supplementary">
|
||||
|
||||
<?php if ( is_active_sidebar( 'sidebar-3' ) ) : ?>
|
||||
<div id="footer-sidebar-one" class="widget-area" role="complementary">
|
||||
<div id="footer-sidebar" class="widget-area" role="complementary">
|
||||
<?php dynamic_sidebar( 'sidebar-3' ); ?>
|
||||
</div><!-- #first .widget-area -->
|
||||
</div><!-- #footer-sidebar -->
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ( is_active_sidebar( 'sidebar-4' ) ) : ?>
|
||||
<div id="footer-sidebar-two" class="widget-area" role="complementary">
|
||||
<?php dynamic_sidebar( 'sidebar-4' ); ?>
|
||||
</div><!-- #second .widget-area -->
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ( is_active_sidebar( 'sidebar-5' ) ) : ?>
|
||||
<div id="footer-sidebar-three" class="widget-area" role="complementary">
|
||||
<?php dynamic_sidebar( 'sidebar-5' ); ?>
|
||||
</div><!-- #third .widget-area -->
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ( is_active_sidebar( 'sidebar-6' ) ) : ?>
|
||||
<div id="footer-sidebar-four" class="widget-area" role="complementary">
|
||||
<?php dynamic_sidebar( 'sidebar-6' ); ?>
|
||||
</div><!-- #fourth .widget-area -->
|
||||
<?php endif; ?>
|
||||
<?php if ( is_active_sidebar( 'sidebar-7' ) ) : ?>
|
||||
<div id="footer-sidebar-five" class="widget-area" role="complementary">
|
||||
<?php dynamic_sidebar( 'sidebar-7' ); ?>
|
||||
</div><!-- #fourth .widget-area -->
|
||||
<?php endif; ?>
|
||||
</div><!-- #supplementary -->
|
||||
|
|
|
|||
|
|
@ -2339,10 +2339,15 @@ span > object {
|
|||
/* =Footer Sidebar
|
||||
----------------------------------------------- */
|
||||
|
||||
#supplementary .widget-area {
|
||||
.site-footer .widget-area {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.site-footer .widget {
|
||||
float: left;
|
||||
padding-left: 27px;
|
||||
width: 198px;
|
||||
}
|
||||
|
||||
/* =Media Queries
|
||||
----------------------------------------------- */
|
||||
|
|
@ -2996,26 +3001,7 @@ span > object {
|
|||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
#supplementary .widget-area {
|
||||
float: left;
|
||||
padding: 0 27px;
|
||||
padding: 0 2.7rem;
|
||||
}
|
||||
#supplementary.one .widget-area {
|
||||
width: 100%;
|
||||
}
|
||||
#supplementary.two .widget-area {
|
||||
width: 50%;
|
||||
}
|
||||
#supplementary.three .widget-area {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
#supplementary.four .widget-area {
|
||||
width: 25%;
|
||||
}
|
||||
#supplementary.five .widget-area {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1150px) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue