wp/wp-content/themes/twentythirteen/inc/custom-header.php
changeset 5 5e2f62d02dcd
parent 0 d970ebf37754
child 7 cf61fcea0001
equal deleted inserted replaced
4:346c88efed21 5:5e2f62d02dcd
     1 <?php
     1 <?php
     2 /**
     2 /**
     3  * Implement a custom header for Twenty Thirteen
     3  * Implement a custom header for Twenty Thirteen
     4  *
     4  *
     5  * @link http://codex.wordpress.org/Custom_Headers
     5  * @link https://codex.wordpress.org/Custom_Headers
     6  *
     6  *
     7  * @package WordPress
     7  * @package WordPress
     8  * @subpackage Twenty_Thirteen
     8  * @subpackage Twenty_Thirteen
     9  * @since Twenty Thirteen 1.0
     9  * @since Twenty Thirteen 1.0
    10  */
    10  */
    17  * @uses twentythirteen_admin_header_style() to style wp-admin form.
    17  * @uses twentythirteen_admin_header_style() to style wp-admin form.
    18  * @uses twentythirteen_admin_header_image() to add custom markup to wp-admin form.
    18  * @uses twentythirteen_admin_header_image() to add custom markup to wp-admin form.
    19  * @uses register_default_headers() to set up the bundled header images.
    19  * @uses register_default_headers() to set up the bundled header images.
    20  *
    20  *
    21  * @since Twenty Thirteen 1.0
    21  * @since Twenty Thirteen 1.0
    22  *
       
    23  * @return void
       
    24  */
    22  */
    25 function twentythirteen_custom_header_setup() {
    23 function twentythirteen_custom_header_setup() {
    26 	$args = array(
    24 	$args = array(
    27 		// Text color and image (empty to use none).
    25 		// Text color and image (empty to use none).
    28 		'default-text-color'     => '220e10',
    26 		'default-text-color'     => '220e10',
    66 
    64 
    67 /**
    65 /**
    68  * Load our special font CSS files.
    66  * Load our special font CSS files.
    69  *
    67  *
    70  * @since Twenty Thirteen 1.0
    68  * @since Twenty Thirteen 1.0
    71  *
       
    72  * @return void
       
    73  */
    69  */
    74 function twentythirteen_custom_header_fonts() {
    70 function twentythirteen_custom_header_fonts() {
    75 	// Add Source Sans Pro and Bitter fonts.
    71 	// Add Source Sans Pro and Bitter fonts.
    76 	wp_enqueue_style( 'twentythirteen-fonts', twentythirteen_fonts_url(), array(), null );
    72 	wp_enqueue_style( 'twentythirteen-fonts', twentythirteen_fonts_url(), array(), null );
    77 
    73 
    78 	// Add Genericons font.
    74 	// Add Genericons font.
    79 	wp_enqueue_style( 'genericons', get_template_directory_uri() . '/fonts/genericons.css', array(), '2.09' );
    75 	wp_enqueue_style( 'genericons', get_template_directory_uri() . '/genericons/genericons.css', array(), '3.03' );
    80 }
    76 }
    81 add_action( 'admin_print_styles-appearance_page_custom-header', 'twentythirteen_custom_header_fonts' );
    77 add_action( 'admin_print_styles-appearance_page_custom-header', 'twentythirteen_custom_header_fonts' );
    82 
    78 
    83 /**
    79 /**
    84  * Style the header text displayed on the blog.
    80  * Style the header text displayed on the blog.
    85  *
    81  *
    86  * get_header_textcolor() options: Hide text (returns 'blank'), or any hex value.
    82  * get_header_textcolor() options: Hide text (returns 'blank'), or any hex value.
    87  *
    83  *
    88  * @since Twenty Thirteen 1.0
    84  * @since Twenty Thirteen 1.0
    89  *
       
    90  * @return void
       
    91  */
    85  */
    92 function twentythirteen_header_style() {
    86 function twentythirteen_header_style() {
    93 	$header_image = get_header_image();
    87 	$header_image = get_header_image();
    94 	$text_color   = get_header_textcolor();
    88 	$text_color   = get_header_textcolor();
    95 
    89 
   104 		if ( ! empty( $header_image ) ) :
    98 		if ( ! empty( $header_image ) ) :
   105 	?>
    99 	?>
   106 		.site-header {
   100 		.site-header {
   107 			background: url(<?php header_image(); ?>) no-repeat scroll top;
   101 			background: url(<?php header_image(); ?>) no-repeat scroll top;
   108 			background-size: 1600px auto;
   102 			background-size: 1600px auto;
       
   103 		}
       
   104 		@media (max-width: 767px) {
       
   105 			.site-header {
       
   106 				background-size: 768px auto;
       
   107 			}
       
   108 		}
       
   109 		@media (max-width: 359px) {
       
   110 			.site-header {
       
   111 				background-size: 360px auto;
       
   112 			}
   109 		}
   113 		}
   110 	<?php
   114 	<?php
   111 		endif;
   115 		endif;
   112 
   116 
   113 		// Has the text been hidden?
   117 		// Has the text been hidden?
   142 
   146 
   143 /**
   147 /**
   144  * Style the header image displayed on the Appearance > Header admin panel.
   148  * Style the header image displayed on the Appearance > Header admin panel.
   145  *
   149  *
   146  * @since Twenty Thirteen 1.0
   150  * @since Twenty Thirteen 1.0
   147  *
       
   148  * @return void
       
   149  */
   151  */
   150 function twentythirteen_admin_header_style() {
   152 function twentythirteen_admin_header_style() {
   151 	$header_image = get_header_image();
   153 	$header_image = get_header_image();
   152 ?>
   154 ?>
   153 	<style type="text/css" id="twentythirteen-admin-header-css">
   155 	<style type="text/css" id="twentythirteen-admin-header-css">
   210  * Output markup to be displayed on the Appearance > Header admin panel.
   212  * Output markup to be displayed on the Appearance > Header admin panel.
   211  *
   213  *
   212  * This callback overrides the default markup displayed there.
   214  * This callback overrides the default markup displayed there.
   213  *
   215  *
   214  * @since Twenty Thirteen 1.0
   216  * @since Twenty Thirteen 1.0
   215  *
       
   216  * @return void
       
   217  */
   217  */
   218 function twentythirteen_admin_header_image() {
   218 function twentythirteen_admin_header_image() {
   219 	?>
   219 	$style = 'color: #' . get_header_textcolor() . ';';
   220 	<div id="headimg" style="background: url(<?php header_image(); ?>) no-repeat scroll top; background-size: 1600px auto;">
   220 	if ( ! display_header_text() ) {
   221 		<?php $style = ' style="color:#' . get_header_textcolor() . ';"'; ?>
   221 		$style = 'display: none;';
       
   222 	}
       
   223 	?>
       
   224 	<div id="headimg" style="background: url(<?php echo esc_url( get_header_image() ); ?>) no-repeat scroll top; background-size: 1600px auto;">
   222 		<div class="home-link">
   225 		<div class="home-link">
   223 			<h1 class="displaying-header-text"><a id="name"<?php echo $style; ?> onclick="return false;" href="#"><?php bloginfo( 'name' ); ?></a></h1>
   226 			<h1 class="displaying-header-text"><a id="name" style="<?php echo esc_attr( $style ); ?>" onclick="return false;" href="#" tabindex="-1"><?php bloginfo( 'name' ); ?></a></h1>
   224 			<h2 id="desc" class="displaying-header-text"<?php echo $style; ?>><?php bloginfo( 'description' ); ?></h2>
   227 			<h2 id="desc" class="displaying-header-text" style="<?php echo esc_attr( $style ); ?>"><?php bloginfo( 'description' ); ?></h2>
   225 		</div>
   228 		</div>
   226 	</div>
   229 	</div>
   227 <?php }
   230 <?php }