Ticket #26338: 26338.diff

wp-content/themes/twentyfourteen/inc/custom-header.php

@@ -18 +18 @@
  */
 function twentyfourteen_custom_header_setup() {
         add_theme_support( 'custom-header', apply_filters( 'twentyfourteen_custom_header_args', array(
-                'header-text'            => false,
+                'default-text-color'     => 'fff',
                 'width'                  => 1260,
                 'height'                 => 240,
                 'flex-height'            => true,
+                'wp-head-callback'       => 'twentyfourteen_header_style',
                 'admin-head-callback'    => 'twentyfourteen_admin_header_style',
                 'admin-preview-callback' => 'twentyfourteen_admin_header_image',
         ) ) );
 }
 add_action( 'after_setup_theme', 'twentyfourteen_custom_header_setup' );
 
+if ( ! function_exists( 'twentyfourteen_header_style' ) ) :
+/**
+ * Styles the header image and text displayed on the blog
+ *
+ * @see twentyfourteen_custom_header_setup().
+ *
+ */
+function twentyfourteen_header_style() {
+        $header_text_color = get_header_textcolor();
+
+        // If no custom options for text are set, let's bail
+        // $header_text_color options: HEADER_TEXTCOLOR is default, hide text (returns 'blank') or any hex value
+        if ( HEADER_TEXTCOLOR == $header_text_color )
+                return;
+        // If we get this far, we have custom styles. Let's do this.
+        ?>
+        <style type="text/css">
+        <?php
+                // Has the text been hidden?
+                if ( 'blank' == $header_text_color ) :
+        ?>
+                .site-title {
+                        position: absolute !important;
+                        clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
+                        clip: rect(1px, 1px, 1px, 1px);
+                }
+        <?php
+                // If the user has set a custom color for the text use that
+                else :
+        ?>
+                .site-title a {
+                        color: #<?php echo $header_text_color; ?> !important;
+                }
+        <?php endif; ?>
+        </style>
+        <?php
+}
+endif; // twentyfourteen_header_style
+
+
 if ( ! function_exists( 'twentyfourteen_admin_header_style' ) ) :
 /**
  * Style the header image displayed on the Appearance > Header admin panel.
@@ -42 +83 @@
         .appearance_page_custom-header #headimg {
                 background-color: #000;
                 border: none;
-                max-width: 1230px;
+                max-width: 1260px;
                 min-height: 48px;
         }
         #headimg h1 {
-                font-family: lato, sans-serif;
+                font-family: Lato, sans-serif;
                 font-size: 18px;
-                line-height: 1.3333333333;
-                margin: 12px 0 12px 27px;
+                line-height: 48px;
+                margin: 0 0 0 30px;
         }
         #headimg h1 a {
                 color: #fff;
@@ -77 +118 @@
                 <?php if ( get_header_image() ) : ?>
                 <img src="<?php header_image(); ?>" alt="">
                 <?php endif; ?>
-                <h1><a id="name" onclick="return false;" href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>
+                <h1 class="displaying-header-text"><a id="name"<?php echo sprintf( ' style="color:#%s;"', get_header_textcolor() ); ?> onclick="return false;" href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>
         </div>
 <?php
 }

wp-content/themes/twentyfourteen/inc/customizer.php

@@ -16 +16 @@
  */
 function twentyfourteen_customize_register( $wp_customize ) {
         // Add postMessage support for site title and description.
-        $wp_customize->get_setting( 'blogname' )->transport        = 'postMessage';
-        $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';
+        $wp_customize->get_setting( 'blogname' )->transport         = 'postMessage';
+        $wp_customize->get_setting( 'blogdescription' )->transport  = 'postMessage';
+        $wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';
 
+        // Rename the label to "Display Site Title & Tagline" in order to make this option extra clear.
+        $wp_customize->add_control( 'display_header_text', array(
+                'settings' => 'header_textcolor',
+                'label'    => __( 'Display Site Title & Tagline', 'twentyfourteen' ),
+                'section'  => 'title_tagline',
+                'type'     => 'checkbox',
+        ) );
+
+        // Rename the label to "Site Title Color" because this only effects the site title in this theme.
+        $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'header_textcolor', array(
+                'label'   => __( 'Site Title Color', 'twentyfourteen' ),
+                'section' => 'colors',
+        ) ) );
+
         // Add custom description to Colors and Background sections.
         $wp_customize->get_section( 'colors' )->description           = __( 'Background may only be visible on wide screens.', 'twentyfourteen' );
         $wp_customize->get_section( 'background_image' )->description = __( 'Background may only be visible on wide screens.', 'twentyfourteen' );
@@ -67 +82 @@
  * @since Twenty Fourteen 1.0
  */
 function twentyfourteen_customize_preview_js() {
-        wp_enqueue_script( 'twentyfourteen_customizer', get_template_directory_uri() . '/js/customizer.js', array( 'customize-preview' ), '20120827', true );
+        wp_enqueue_script( 'twentyfourteen_customizer', get_template_directory_uri() . '/js/customizer.js', array( 'customize-preview' ), '20131130', true );
 }
 add_action( 'customize_preview_init', 'twentyfourteen_customize_preview_js' );
 

wp-content/themes/twentyfourteen/js/customizer.js

@@ -15 +15 @@
                         $( '.site-description' ).text( to );
                 } );
         } );
+        // Header text color.
+        wp.customize( 'header_textcolor', function( value ) {
+                value.bind( function( to ) {
+                        if ( 'blank' == to ) {
+                                $( '.site-title a, .site-description' ).css( {
+                                        'clip': 'rect(1px, 1px, 1px, 1px)',
+                                        'position': 'absolute'
+                                } );
+                        } else {
+                                $( '.site-title a,  .site-description' ).css( {
+                                        'clip': 'auto',
+                                        'position': 'relative'
+                                } );
+
+                                $( '.site-title a' ).css( {
+                                        'color': to,
+                                } );
+                        }
+                } );
+        } );
 } )( jQuery );
+ No newline at end of file

wp-content/themes/twentyfourteen/style.css

@@ -3544 +3544 @@
                 margin: -3px 0 21px;
         }
 
+        .site-description:empty {
+                margin: 0;
+        }
+
         .secondary-navigation {
                 margin: 0 -30px 48px;
                 width: 182px;