3 * Twenty Sixteen Customizer functionality
6 * @subpackage Twenty_Sixteen
7 * @since Twenty Sixteen 1.0
11 * Sets up the WordPress core custom header and custom background features.
13 * @since Twenty Sixteen 1.0
15 * @see twentysixteen_header_style()
17 function twentysixteen_custom_header_and_background() {
18 $color_scheme = twentysixteen_get_color_scheme();
19 $default_background_color = trim( $color_scheme[0], '#' );
20 $default_text_color = trim( $color_scheme[3], '#' );
23 * Filter the arguments used when adding 'custom-background' support in Twenty Sixteen.
25 * @since Twenty Sixteen 1.0
27 * @param array $args {
28 * An array of custom-background support arguments.
30 * @type string $default-color Default color of the background.
33 add_theme_support( 'custom-background', apply_filters( 'twentysixteen_custom_background_args', array(
34 'default-color' => $default_background_color,
38 * Filter the arguments used when adding 'custom-header' support in Twenty Sixteen.
40 * @since Twenty Sixteen 1.0
42 * @param array $args {
43 * An array of custom-header support arguments.
45 * @type string $default-text-color Default color of the header text.
46 * @type int $width Width in pixels of the custom header image. Default 1200.
47 * @type int $height Height in pixels of the custom header image. Default 280.
48 * @type bool $flex-height Whether to allow flexible-height header images. Default true.
49 * @type callable $wp-head-callback Callback function used to style the header image and text
50 * displayed on the blog.
53 add_theme_support( 'custom-header', apply_filters( 'twentysixteen_custom_header_args', array(
54 'default-text-color' => $default_text_color,
57 'flex-height' => true,
58 'wp-head-callback' => 'twentysixteen_header_style',
61 add_action( 'after_setup_theme', 'twentysixteen_custom_header_and_background' );
63 if ( ! function_exists( 'twentysixteen_header_style' ) ) :
65 * Styles the header text displayed on the site.
67 * Create your own twentysixteen_header_style() function to override in a child theme.
69 * @since Twenty Sixteen 1.0
71 * @see twentysixteen_custom_header_and_background().
73 function twentysixteen_header_style() {
74 // If the header text option is untouched, let's bail.
75 if ( display_header_text() ) {
79 // If the header text has been hidden.
81 <style type="text/css" id="twentysixteen-header-css">
86 .site-branding .site-title,
88 clip: rect(1px, 1px, 1px, 1px);
94 endif; // twentysixteen_header_style
97 * Adds postMessage support for site title and description for the Customizer.
99 * @since Twenty Sixteen 1.0
101 * @param WP_Customize_Manager $wp_customize The Customizer object.
103 function twentysixteen_customize_register( $wp_customize ) {
104 $color_scheme = twentysixteen_get_color_scheme();
106 $wp_customize->get_setting( 'blogname' )->transport = 'postMessage';
107 $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';
109 // Add color scheme setting and control.
110 $wp_customize->add_setting( 'color_scheme', array(
111 'default' => 'default',
112 'sanitize_callback' => 'twentysixteen_sanitize_color_scheme',
113 'transport' => 'postMessage',
116 $wp_customize->add_control( 'color_scheme', array(
117 'label' => __( 'Base Color Scheme', 'twentysixteen' ),
118 'section' => 'colors',
120 'choices' => twentysixteen_get_color_scheme_choices(),
124 // Add page background color setting and control.
125 $wp_customize->add_setting( 'page_background_color', array(
126 'default' => $color_scheme[1],
127 'sanitize_callback' => 'sanitize_hex_color',
128 'transport' => 'postMessage',
131 $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'page_background_color', array(
132 'label' => __( 'Page Background Color', 'twentysixteen' ),
133 'section' => 'colors',
136 // Remove the core header textcolor control, as it shares the main text color.
137 $wp_customize->remove_control( 'header_textcolor' );
139 // Add link color setting and control.
140 $wp_customize->add_setting( 'link_color', array(
141 'default' => $color_scheme[2],
142 'sanitize_callback' => 'sanitize_hex_color',
143 'transport' => 'postMessage',
146 $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'link_color', array(
147 'label' => __( 'Link Color', 'twentysixteen' ),
148 'section' => 'colors',
151 // Add main text color setting and control.
152 $wp_customize->add_setting( 'main_text_color', array(
153 'default' => $color_scheme[3],
154 'sanitize_callback' => 'sanitize_hex_color',
155 'transport' => 'postMessage',
158 $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'main_text_color', array(
159 'label' => __( 'Main Text Color', 'twentysixteen' ),
160 'section' => 'colors',
163 // Add secondary text color setting and control.
164 $wp_customize->add_setting( 'secondary_text_color', array(
165 'default' => $color_scheme[4],
166 'sanitize_callback' => 'sanitize_hex_color',
167 'transport' => 'postMessage',
170 $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'secondary_text_color', array(
171 'label' => __( 'Secondary Text Color', 'twentysixteen' ),
172 'section' => 'colors',
175 add_action( 'customize_register', 'twentysixteen_customize_register', 11 );
178 * Registers color schemes for Twenty Sixteen.
180 * Can be filtered with {@see 'twentysixteen_color_schemes'}.
182 * The order of colors in a colors array:
183 * 1. Main Background Color.
184 * 2. Page Background Color.
186 * 4. Main Text Color.
187 * 5. Secondary Text Color.
189 * @since Twenty Sixteen 1.0
191 * @return array An associative array of color scheme options.
193 function twentysixteen_get_color_schemes() {
195 * Filter the color schemes registered for use with Twenty Sixteen.
197 * The default schemes include 'default', 'dark', 'gray', 'red', and 'yellow'.
199 * @since Twenty Sixteen 1.0
201 * @param array $schemes {
202 * Associative array of color schemes data.
204 * @type array $slug {
205 * Associative array of information for setting up the color scheme.
207 * @type string $label Color scheme label.
208 * @type array $colors HEX codes for default colors prepended with a hash symbol ('#').
209 * Colors are defined in the following order: Main background, page
210 * background, link, main text, secondary text.
214 return apply_filters( 'twentysixteen_color_schemes', array(
216 'label' => __( 'Default', 'twentysixteen' ),
226 'label' => __( 'Dark', 'twentysixteen' ),
236 'label' => __( 'Gray', 'twentysixteen' ),
246 'label' => __( 'Red', 'twentysixteen' ),
256 'label' => __( 'Yellow', 'twentysixteen' ),
268 if ( ! function_exists( 'twentysixteen_get_color_scheme' ) ) :
270 * Retrieves the current Twenty Sixteen color scheme.
272 * Create your own twentysixteen_get_color_scheme() function to override in a child theme.
274 * @since Twenty Sixteen 1.0
276 * @return array An associative array of either the current or default color scheme HEX values.
278 function twentysixteen_get_color_scheme() {
279 $color_scheme_option = get_theme_mod( 'color_scheme', 'default' );
280 $color_schemes = twentysixteen_get_color_schemes();
282 if ( array_key_exists( $color_scheme_option, $color_schemes ) ) {
283 return $color_schemes[ $color_scheme_option ]['colors'];
286 return $color_schemes['default']['colors'];
288 endif; // twentysixteen_get_color_scheme
290 if ( ! function_exists( 'twentysixteen_get_color_scheme_choices' ) ) :
292 * Retrieves an array of color scheme choices registered for Twenty Sixteen.
294 * Create your own twentysixteen_get_color_scheme_choices() function to override
297 * @since Twenty Sixteen 1.0
299 * @return array Array of color schemes.
301 function twentysixteen_get_color_scheme_choices() {
302 $color_schemes = twentysixteen_get_color_schemes();
303 $color_scheme_control_options = array();
305 foreach ( $color_schemes as $color_scheme => $value ) {
306 $color_scheme_control_options[ $color_scheme ] = $value['label'];
309 return $color_scheme_control_options;
311 endif; // twentysixteen_get_color_scheme_choices
314 if ( ! function_exists( 'twentysixteen_sanitize_color_scheme' ) ) :
316 * Handles sanitization for Twenty Sixteen color schemes.
318 * Create your own twentysixteen_sanitize_color_scheme() function to override
321 * @since Twenty Sixteen 1.0
323 * @param string $value Color scheme name value.
324 * @return string Color scheme name.
326 function twentysixteen_sanitize_color_scheme( $value ) {
327 $color_schemes = twentysixteen_get_color_scheme_choices();
329 if ( ! array_key_exists( $value, $color_schemes ) ) {
335 endif; // twentysixteen_sanitize_color_scheme
338 * Enqueues front-end CSS for color scheme.
340 * @since Twenty Sixteen 1.0
342 * @see wp_add_inline_style()
344 function twentysixteen_color_scheme_css() {
345 $color_scheme_option = get_theme_mod( 'color_scheme', 'default' );
347 // Don't do anything if the default color scheme is selected.
348 if ( 'default' === $color_scheme_option ) {
352 $color_scheme = twentysixteen_get_color_scheme();
354 // Convert main text hex color to rgba.
355 $color_textcolor_rgb = twentysixteen_hex2rgb( $color_scheme[3] );
357 // If the rgba values are empty return early.
358 if ( empty( $color_textcolor_rgb ) ) {
362 // If we get this far, we have a custom color scheme.
364 'background_color' => $color_scheme[0],
365 'page_background_color' => $color_scheme[1],
366 'link_color' => $color_scheme[2],
367 'main_text_color' => $color_scheme[3],
368 'secondary_text_color' => $color_scheme[4],
369 'border_color' => vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.2)', $color_textcolor_rgb ),
373 $color_scheme_css = twentysixteen_get_color_scheme_css( $colors );
375 wp_add_inline_style( 'twentysixteen-style', $color_scheme_css );
377 add_action( 'wp_enqueue_scripts', 'twentysixteen_color_scheme_css' );
380 * Binds the JS listener to make Customizer color_scheme control.
382 * Passes color scheme data as colorScheme global.
384 * @since Twenty Sixteen 1.0
386 function twentysixteen_customize_control_js() {
387 wp_enqueue_script( 'color-scheme-control', get_template_directory_uri() . '/js/color-scheme-control.js', array( 'customize-controls', 'iris', 'underscore', 'wp-util' ), '20150825', true );
388 wp_localize_script( 'color-scheme-control', 'colorScheme', twentysixteen_get_color_schemes() );
390 add_action( 'customize_controls_enqueue_scripts', 'twentysixteen_customize_control_js' );
393 * Binds JS handlers to make the Customizer preview reload changes asynchronously.
395 * @since Twenty Sixteen 1.0
397 function twentysixteen_customize_preview_js() {
398 wp_enqueue_script( 'twentysixteen-customize-preview', get_template_directory_uri() . '/js/customize-preview.js', array( 'customize-preview' ), '20150825', true );
400 add_action( 'customize_preview_init', 'twentysixteen_customize_preview_js' );
403 * Returns CSS for the color schemes.
405 * @since Twenty Sixteen 1.0
407 * @param array $colors Color scheme colors.
408 * @return string Color scheme CSS.
410 function twentysixteen_get_color_scheme_css( $colors ) {
411 $colors = wp_parse_args( $colors, array(
412 'background_color' => '',
413 'page_background_color' => '',
415 'main_text_color' => '',
416 'secondary_text_color' => '',
417 'border_color' => '',
423 /* Background Color */
425 background-color: {$colors['background_color']};
428 /* Page Background Color */
430 background-color: {$colors['page_background_color']};
436 button[disabled]:hover,
437 button[disabled]:focus,
438 input[type="button"],
439 input[type="button"][disabled]:hover,
440 input[type="button"][disabled]:focus,
442 input[type="reset"][disabled]:hover,
443 input[type="reset"][disabled]:focus,
444 input[type="submit"],
445 input[type="submit"][disabled]:hover,
446 input[type="submit"][disabled]:focus,
447 .menu-toggle.toggled-on,
448 .menu-toggle.toggled-on:hover,
449 .menu-toggle.toggled-on:focus,
452 .pagination .prev:hover,
453 .pagination .prev:focus,
454 .pagination .next:hover,
455 .pagination .next:focus,
456 .pagination .nav-links:before,
457 .pagination .nav-links:after,
458 .widget_calendar tbody a,
459 .widget_calendar tbody a:hover,
460 .widget_calendar tbody a:focus,
463 .page-links a:focus {
464 color: {$colors['page_background_color']};
471 .main-navigation a:hover,
472 .main-navigation a:focus,
473 .dropdown-toggle:hover,
474 .dropdown-toggle:focus,
475 .social-navigation a:hover:before,
476 .social-navigation a:focus:before,
477 .post-navigation a:hover .post-title,
478 .post-navigation a:focus .post-title,
481 .site-branding .site-title a:hover,
482 .site-branding .site-title a:focus,
483 .entry-title a:hover,
484 .entry-title a:focus,
485 .entry-footer a:hover,
486 .entry-footer a:focus,
487 .comment-metadata a:hover,
488 .comment-metadata a:focus,
489 .pingback .comment-edit-link:hover,
490 .pingback .comment-edit-link:focus,
492 .comment-reply-link:hover,
493 .comment-reply-link:focus,
497 color: {$colors['link_color']};
504 input[type="button"]:hover,
505 input[type="button"]:focus,
506 input[type="reset"]:hover,
507 input[type="reset"]:focus,
508 input[type="submit"]:hover,
509 input[type="submit"]:focus,
510 .pagination .prev:hover,
511 .pagination .prev:focus,
512 .pagination .next:hover,
513 .pagination .next:focus,
514 .widget_calendar tbody a,
516 .page-links a:focus {
517 background-color: {$colors['link_color']};
520 input[type="text"]:focus,
521 input[type="email"]:focus,
522 input[type="url"]:focus,
523 input[type="password"]:focus,
524 input[type="search"]:focus,
530 border-color: {$colors['link_color']};
533 /* Main Text Color */
540 .social-navigation a,
545 .site-branding .site-title a,
547 .page-links > .page-links-title,
549 .comment-reply-title small a:hover,
550 .comment-reply-title small a:focus {
551 color: {$colors['main_text_color']};
555 .menu-toggle.toggled-on,
556 .menu-toggle.toggled-on:hover,
557 .menu-toggle.toggled-on:focus,
559 .post-navigation div + div,
565 .comment-reply-title {
566 border-color: {$colors['main_text_color']};
570 button[disabled]:hover,
571 button[disabled]:focus,
572 input[type="button"],
573 input[type="button"][disabled]:hover,
574 input[type="button"][disabled]:focus,
576 input[type="reset"][disabled]:hover,
577 input[type="reset"][disabled]:focus,
578 input[type="submit"],
579 input[type="submit"][disabled]:hover,
580 input[type="submit"][disabled]:focus,
581 .menu-toggle.toggled-on,
582 .menu-toggle.toggled-on:hover,
583 .menu-toggle.toggled-on:focus,
589 background-color: {$colors['main_text_color']};
592 /* Secondary Text Color */
595 * IE8 and earlier will drop any block with CSS3 selectors.
596 * Do not combine these styles with the next block.
598 body:not(.search-results) .entry-summary {
599 color: {$colors['secondary_text_color']};
603 .post-password-form label,
607 .post-navigation .meta-nav,
610 .widget_recent_entries .post-date,
611 .widget_rss .rss-date,
618 .taxonomy-description,
621 .pingback .edit-link,
623 .pingback .comment-edit-link,
626 .comment-awaiting-moderation,
631 .wp-caption .wp-caption-text,
634 .widecolumn .mu_register label {
635 color: {$colors['secondary_text_color']};
638 .widget_calendar tbody a:hover,
639 .widget_calendar tbody a:focus {
640 background-color: {$colors['secondary_text_color']};
654 input[type="password"],
655 input[type="search"],
658 .main-navigation .primary-menu,
660 .dropdown-toggle:after,
661 .social-navigation a,
669 .comment-list article,
670 .comment-list .pingback,
671 .comment-list .trackback,
674 .widecolumn .mu_register .mu_alert {
675 border-color: {$colors['main_text_color']}; /* Fallback for IE7 and IE8 */
676 border-color: {$colors['border_color']};
681 background-color: {$colors['main_text_color']}; /* Fallback for IE7 and IE8 */
682 background-color: {$colors['border_color']};
685 @media screen and (min-width: 56.875em) {
686 .main-navigation li:hover > a,
687 .main-navigation li.focus > a {
688 color: {$colors['link_color']};
691 .main-navigation ul ul,
692 .main-navigation ul ul li {
693 border-color: {$colors['border_color']};
696 .main-navigation ul ul:before {
697 border-top-color: {$colors['border_color']};
698 border-bottom-color: {$colors['border_color']};
701 .main-navigation ul ul li {
702 background-color: {$colors['page_background_color']};
705 .main-navigation ul ul:after {
706 border-top-color: {$colors['page_background_color']};
707 border-bottom-color: {$colors['page_background_color']};
716 * Outputs an Underscore template for generating CSS for the color scheme.
718 * The template generates the css dynamically for instant display in the
719 * Customizer preview.
721 * @since Twenty Sixteen 1.0
723 function twentysixteen_color_scheme_css_template() {
725 'background_color' => '{{ data.background_color }}',
726 'page_background_color' => '{{ data.page_background_color }}',
727 'link_color' => '{{ data.link_color }}',
728 'main_text_color' => '{{ data.main_text_color }}',
729 'secondary_text_color' => '{{ data.secondary_text_color }}',
730 'border_color' => '{{ data.border_color }}',
733 <script type="text/html" id="tmpl-twentysixteen-color-scheme">
734 <?php echo twentysixteen_get_color_scheme_css( $colors ); ?>
738 add_action( 'customize_controls_print_footer_scripts', 'twentysixteen_color_scheme_css_template' );
741 * Enqueues front-end CSS for the page background color.
743 * @since Twenty Sixteen 1.0
745 * @see wp_add_inline_style()
747 function twentysixteen_page_background_color_css() {
748 $color_scheme = twentysixteen_get_color_scheme();
749 $default_color = $color_scheme[1];
750 $page_background_color = get_theme_mod( 'page_background_color', $default_color );
752 // Don't do anything if the current color is the default.
753 if ( $page_background_color === $default_color ) {
758 /* Custom Page Background Color */
760 background-color: %1$s;
766 button[disabled]:hover,
767 button[disabled]:focus,
768 input[type="button"],
769 input[type="button"][disabled]:hover,
770 input[type="button"][disabled]:focus,
772 input[type="reset"][disabled]:hover,
773 input[type="reset"][disabled]:focus,
774 input[type="submit"],
775 input[type="submit"][disabled]:hover,
776 input[type="submit"][disabled]:focus,
777 .menu-toggle.toggled-on,
778 .menu-toggle.toggled-on:hover,
779 .menu-toggle.toggled-on:focus,
782 .pagination .prev:hover,
783 .pagination .prev:focus,
784 .pagination .next:hover,
785 .pagination .next:focus,
786 .pagination .nav-links:before,
787 .pagination .nav-links:after,
788 .widget_calendar tbody a,
789 .widget_calendar tbody a:hover,
790 .widget_calendar tbody a:focus,
793 .page-links a:focus {
797 @media screen and (min-width: 56.875em) {
798 .main-navigation ul ul li {
799 background-color: %1$s;
802 .main-navigation ul ul:after {
803 border-top-color: %1$s;
804 border-bottom-color: %1$s;
809 wp_add_inline_style( 'twentysixteen-style', sprintf( $css, $page_background_color ) );
811 add_action( 'wp_enqueue_scripts', 'twentysixteen_page_background_color_css', 11 );
814 * Enqueues front-end CSS for the link color.
816 * @since Twenty Sixteen 1.0
818 * @see wp_add_inline_style()
820 function twentysixteen_link_color_css() {
821 $color_scheme = twentysixteen_get_color_scheme();
822 $default_color = $color_scheme[2];
823 $link_color = get_theme_mod( 'link_color', $default_color );
825 // Don't do anything if the current color is the default.
826 if ( $link_color === $default_color ) {
831 /* Custom Link Color */
835 .main-navigation a:hover,
836 .main-navigation a:focus,
837 .dropdown-toggle:hover,
838 .dropdown-toggle:focus,
839 .social-navigation a:hover:before,
840 .social-navigation a:focus:before,
841 .post-navigation a:hover .post-title,
842 .post-navigation a:focus .post-title,
845 .site-branding .site-title a:hover,
846 .site-branding .site-title a:focus,
847 .entry-title a:hover,
848 .entry-title a:focus,
849 .entry-footer a:hover,
850 .entry-footer a:focus,
851 .comment-metadata a:hover,
852 .comment-metadata a:focus,
853 .pingback .comment-edit-link:hover,
854 .pingback .comment-edit-link:focus,
856 .comment-reply-link:hover,
857 .comment-reply-link:focus,
868 input[type="button"]:hover,
869 input[type="button"]:focus,
870 input[type="reset"]:hover,
871 input[type="reset"]:focus,
872 input[type="submit"]:hover,
873 input[type="submit"]:focus,
874 .pagination .prev:hover,
875 .pagination .prev:focus,
876 .pagination .next:hover,
877 .pagination .next:focus,
878 .widget_calendar tbody a,
880 .page-links a:focus {
881 background-color: %1$s;
884 input[type="text"]:focus,
885 input[type="email"]:focus,
886 input[type="url"]:focus,
887 input[type="password"]:focus,
888 input[type="search"]:focus,
897 @media screen and (min-width: 56.875em) {
898 .main-navigation li:hover > a,
899 .main-navigation li.focus > a {
905 wp_add_inline_style( 'twentysixteen-style', sprintf( $css, $link_color ) );
907 add_action( 'wp_enqueue_scripts', 'twentysixteen_link_color_css', 11 );
910 * Enqueues front-end CSS for the main text color.
912 * @since Twenty Sixteen 1.0
914 * @see wp_add_inline_style()
916 function twentysixteen_main_text_color_css() {
917 $color_scheme = twentysixteen_get_color_scheme();
918 $default_color = $color_scheme[3];
919 $main_text_color = get_theme_mod( 'main_text_color', $default_color );
921 // Don't do anything if the current color is the default.
922 if ( $main_text_color === $default_color ) {
926 // Convert main text hex color to rgba.
927 $main_text_color_rgb = twentysixteen_hex2rgb( $main_text_color );
929 // If the rgba values are empty return early.
930 if ( empty( $main_text_color_rgb ) ) {
934 // If we get this far, we have a custom color scheme.
935 $border_color = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.2)', $main_text_color_rgb );
938 /* Custom Main Text Color */
945 .social-navigation a,
950 .site-branding .site-title a,
952 .page-links > .page-links-title,
954 .comment-reply-title small a:hover,
955 .comment-reply-title small a:focus {
960 .menu-toggle.toggled-on,
961 .menu-toggle.toggled-on:hover,
962 .menu-toggle.toggled-on:focus,
964 .post-navigation div + div,
970 .comment-reply-title {
975 button[disabled]:hover,
976 button[disabled]:focus,
977 input[type="button"],
978 input[type="button"][disabled]:hover,
979 input[type="button"][disabled]:focus,
981 input[type="reset"][disabled]:hover,
982 input[type="reset"][disabled]:focus,
983 input[type="submit"],
984 input[type="submit"][disabled]:hover,
985 input[type="submit"][disabled]:focus,
986 .menu-toggle.toggled-on,
987 .menu-toggle.toggled-on:hover,
988 .menu-toggle.toggled-on:focus,
994 background-color: %1$s;
1006 input[type="email"],
1008 input[type="password"],
1009 input[type="search"],
1011 .main-navigation li,
1012 .main-navigation .primary-menu,
1014 .dropdown-toggle:after,
1015 .social-navigation a,
1017 .comment-navigation,
1023 .comment-list article,
1024 .comment-list .pingback,
1025 .comment-list .trackback,
1026 .comment-reply-link,
1028 .widecolumn .mu_register .mu_alert {
1029 border-color: %1$s; /* Fallback for IE7 and IE8 */
1035 background-color: %1$s; /* Fallback for IE7 and IE8 */
1036 background-color: %2$s;
1039 @media screen and (min-width: 56.875em) {
1040 .main-navigation ul ul,
1041 .main-navigation ul ul li {
1045 .main-navigation ul ul:before {
1046 border-top-color: %2$s;
1047 border-bottom-color: %2$s;
1052 wp_add_inline_style( 'twentysixteen-style', sprintf( $css, $main_text_color, $border_color ) );
1054 add_action( 'wp_enqueue_scripts', 'twentysixteen_main_text_color_css', 11 );
1057 * Enqueues front-end CSS for the secondary text color.
1059 * @since Twenty Sixteen 1.0
1061 * @see wp_add_inline_style()
1063 function twentysixteen_secondary_text_color_css() {
1064 $color_scheme = twentysixteen_get_color_scheme();
1065 $default_color = $color_scheme[4];
1066 $secondary_text_color = get_theme_mod( 'secondary_text_color', $default_color );
1068 // Don't do anything if the current color is the default.
1069 if ( $secondary_text_color === $default_color ) {
1074 /* Custom Secondary Text Color */
1077 * IE8 and earlier will drop any block with CSS3 selectors.
1078 * Do not combine these styles with the next block.
1080 body:not(.search-results) .entry-summary {
1085 .post-password-form label,
1089 .post-navigation .meta-nav,
1091 .comment-navigation,
1092 .widget_recent_entries .post-date,
1093 .widget_rss .rss-date,
1100 .taxonomy-description,
1103 .pingback .edit-link,
1104 .comment-metadata a,
1105 .pingback .comment-edit-link,
1106 .comment-form label,
1108 .comment-awaiting-moderation,
1113 .wp-caption .wp-caption-text,
1116 .widecolumn .mu_register label {
1120 .widget_calendar tbody a:hover,
1121 .widget_calendar tbody a:focus {
1122 background-color: %1$s;
1126 wp_add_inline_style( 'twentysixteen-style', sprintf( $css, $secondary_text_color ) );
1128 add_action( 'wp_enqueue_scripts', 'twentysixteen_secondary_text_color_css', 11 );