WordPress 4.0
[autoinstalls/wordpress.git] / wp-content / themes / twentythirteen / inc / custom-header.php
1 <?php
2 /**
3  * Implement a custom header for Twenty Thirteen
4  *
5  * @link http://codex.wordpress.org/Custom_Headers
6  *
7  * @package WordPress
8  * @subpackage Twenty_Thirteen
9  * @since Twenty Thirteen 1.0
10  */
11
12 /**
13  * Set up the WordPress core custom header arguments and settings.
14  *
15  * @uses add_theme_support() to register support for 3.4 and up.
16  * @uses twentythirteen_header_style() to style front-end.
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.
19  * @uses register_default_headers() to set up the bundled header images.
20  *
21  * @since Twenty Thirteen 1.0
22  */
23 function twentythirteen_custom_header_setup() {
24         $args = array(
25                 // Text color and image (empty to use none).
26                 'default-text-color'     => '220e10',
27                 'default-image'          => '%s/images/headers/circle.png',
28
29                 // Set height and width, with a maximum value for the width.
30                 'height'                 => 230,
31                 'width'                  => 1600,
32
33                 // Callbacks for styling the header and the admin preview.
34                 'wp-head-callback'       => 'twentythirteen_header_style',
35                 'admin-head-callback'    => 'twentythirteen_admin_header_style',
36                 'admin-preview-callback' => 'twentythirteen_admin_header_image',
37         );
38
39         add_theme_support( 'custom-header', $args );
40
41         /*
42          * Default custom headers packaged with the theme.
43          * %s is a placeholder for the theme template directory URI.
44          */
45         register_default_headers( array(
46                 'circle' => array(
47                         'url'           => '%s/images/headers/circle.png',
48                         'thumbnail_url' => '%s/images/headers/circle-thumbnail.png',
49                         'description'   => _x( 'Circle', 'header image description', 'twentythirteen' )
50                 ),
51                 'diamond' => array(
52                         'url'           => '%s/images/headers/diamond.png',
53                         'thumbnail_url' => '%s/images/headers/diamond-thumbnail.png',
54                         'description'   => _x( 'Diamond', 'header image description', 'twentythirteen' )
55                 ),
56                 'star' => array(
57                         'url'           => '%s/images/headers/star.png',
58                         'thumbnail_url' => '%s/images/headers/star-thumbnail.png',
59                         'description'   => _x( 'Star', 'header image description', 'twentythirteen' )
60                 ),
61         ) );
62 }
63 add_action( 'after_setup_theme', 'twentythirteen_custom_header_setup', 11 );
64
65 /**
66  * Load our special font CSS files.
67  *
68  * @since Twenty Thirteen 1.0
69  */
70 function twentythirteen_custom_header_fonts() {
71         // Add Source Sans Pro and Bitter fonts.
72         wp_enqueue_style( 'twentythirteen-fonts', twentythirteen_fonts_url(), array(), null );
73
74         // Add Genericons font.
75         wp_enqueue_style( 'genericons', get_template_directory_uri() . '/genericons/genericons.css', array(), '3.03' );
76 }
77 add_action( 'admin_print_styles-appearance_page_custom-header', 'twentythirteen_custom_header_fonts' );
78
79 /**
80  * Style the header text displayed on the blog.
81  *
82  * get_header_textcolor() options: Hide text (returns 'blank'), or any hex value.
83  *
84  * @since Twenty Thirteen 1.0
85  */
86 function twentythirteen_header_style() {
87         $header_image = get_header_image();
88         $text_color   = get_header_textcolor();
89
90         // If no custom options for text are set, let's bail.
91         if ( empty( $header_image ) && $text_color == get_theme_support( 'custom-header', 'default-text-color' ) )
92                 return;
93
94         // If we get this far, we have custom styles.
95         ?>
96         <style type="text/css" id="twentythirteen-header-css">
97         <?php
98                 if ( ! empty( $header_image ) ) :
99         ?>
100                 .site-header {
101                         background: url(<?php header_image(); ?>) no-repeat scroll top;
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                         }
113                 }
114         <?php
115                 endif;
116
117                 // Has the text been hidden?
118                 if ( ! display_header_text() ) :
119         ?>
120                 .site-title,
121                 .site-description {
122                         position: absolute;
123                         clip: rect(1px 1px 1px 1px); /* IE7 */
124                         clip: rect(1px, 1px, 1px, 1px);
125                 }
126         <?php
127                         if ( empty( $header_image ) ) :
128         ?>
129                 .site-header .home-link {
130                         min-height: 0;
131                 }
132         <?php
133                         endif;
134
135                 // If the user has set a custom color for the text, use that.
136                 elseif ( $text_color != get_theme_support( 'custom-header', 'default-text-color' ) ) :
137         ?>
138                 .site-title,
139                 .site-description {
140                         color: #<?php echo esc_attr( $text_color ); ?>;
141                 }
142         <?php endif; ?>
143         </style>
144         <?php
145 }
146
147 /**
148  * Style the header image displayed on the Appearance > Header admin panel.
149  *
150  * @since Twenty Thirteen 1.0
151  */
152 function twentythirteen_admin_header_style() {
153         $header_image = get_header_image();
154 ?>
155         <style type="text/css" id="twentythirteen-admin-header-css">
156         .appearance_page_custom-header #headimg {
157                 border: none;
158                 -webkit-box-sizing: border-box;
159                 -moz-box-sizing:    border-box;
160                 box-sizing:         border-box;
161                 <?php
162                 if ( ! empty( $header_image ) ) {
163                         echo 'background: url(' . esc_url( $header_image ) . ') no-repeat scroll top; background-size: 1600px auto;';
164                 } ?>
165                 padding: 0 20px;
166         }
167         #headimg .home-link {
168                 -webkit-box-sizing: border-box;
169                 -moz-box-sizing:    border-box;
170                 box-sizing:         border-box;
171                 margin: 0 auto;
172                 max-width: 1040px;
173                 <?php
174                 if ( ! empty( $header_image ) || display_header_text() ) {
175                         echo 'min-height: 230px;';
176                 } ?>
177                 width: 100%;
178         }
179         <?php if ( ! display_header_text() ) : ?>
180         #headimg h1,
181         #headimg h2 {
182                 position: absolute !important;
183                 clip: rect(1px 1px 1px 1px); /* IE7 */
184                 clip: rect(1px, 1px, 1px, 1px);
185         }
186         <?php endif; ?>
187         #headimg h1 {
188                 font: bold 60px/1 Bitter, Georgia, serif;
189                 margin: 0;
190                 padding: 58px 0 10px;
191         }
192         #headimg h1 a {
193                 text-decoration: none;
194         }
195         #headimg h1 a:hover {
196                 text-decoration: underline;
197         }
198         #headimg h2 {
199                 font: 200 italic 24px "Source Sans Pro", Helvetica, sans-serif;
200                 margin: 0;
201                 text-shadow: none;
202         }
203         .default-header img {
204                 max-width: 230px;
205                 width: auto;
206         }
207         </style>
208 <?php
209 }
210
211 /**
212  * Output markup to be displayed on the Appearance > Header admin panel.
213  *
214  * This callback overrides the default markup displayed there.
215  *
216  * @since Twenty Thirteen 1.0
217  */
218 function twentythirteen_admin_header_image() {
219         ?>
220         <div id="headimg" style="background: url(<?php header_image(); ?>) no-repeat scroll top; background-size: 1600px auto;">
221                 <?php $style = ' style="color:#' . get_header_textcolor() . ';"'; ?>
222                 <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>
224                         <h2 id="desc" class="displaying-header-text"<?php echo $style; ?>><?php bloginfo( 'description' ); ?></h2>
225                 </div>
226         </div>
227 <?php }