WordPress.org

Make WordPress Core

Ticket #21443: 21443.2.patch

File 21443.2.patch, 5.6 KB (added by lancewillett, 6 years ago)

Simplify the font CSS loading and minor cleanup, introduce custom_fonts_url() for reusing same code

  • wp-content/themes/twentytwelve/functions.php

     
    111111         * Depends on Theme Options setting.
    112112         */
    113113        $options = $twentytwelve_options->get_theme_options();
    114         if ( $options['enable_fonts'] ) {
    115                 $protocol = is_ssl() ? 'https' : 'http';
    116                 wp_enqueue_style( 'twentytwelve-fonts', "$protocol://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700" );
    117         }
     114        if ( $options['enable_fonts'] )
     115                wp_enqueue_style( 'twentytwelve-fonts', $twentytwelve_options->custom_fonts_url() );
    118116
    119117        /**
    120118         * Load our main CSS file.
     
    373371                $content_width = 960;
    374372        }
    375373}
    376 add_action( 'template_redirect', 'twentytwelve_content_width' );
    377 
    378 /**
    379  * Bind JS handler to make Theme Customizer preview reload
    380  * custom background `body_class` value changes asynchronously.
    381  *
    382  * @since Twenty Twelve 1.0
    383  */
    384 function twentytwelve_customize_preview_js() {
    385         wp_enqueue_script( 'twentytwelve-customizer', get_template_directory_uri() . '/js/theme-customizer.js', array( 'customize-preview' ), '20120725', true );
    386 }
    387 add_action( 'customize_preview_init', 'twentytwelve_customize_preview_js' );
    388  No newline at end of file
     374add_action( 'template_redirect', 'twentytwelve_content_width' );
     375 No newline at end of file
  • wp-content/themes/twentytwelve/inc/theme-options.php

     
    3737                if ( 'twentytwelve' != get_stylesheet() )
    3838                        $this->option_key = get_stylesheet() . '_theme_options';
    3939
    40                 add_action( 'admin_init',         array( $this, 'options_init'       ) );
    41                 add_action( 'admin_menu',         array( $this, 'add_page'           ) );
    42                 add_action( 'customize_register', array( $this, 'customize_register' ) );
     40                add_action( 'admin_init',             array( $this, 'options_init'         ) );
     41                add_action( 'admin_menu',             array( $this, 'add_page'             ) );
     42                add_action( 'customize_register',     array( $this, 'customize_register'   ) );
     43                add_action( 'customize_preview_init', array( $this, 'customize_preview_js' ) );
    4344        }
    4445
    4546        /**
     
    203204         * @return void
    204205         */
    205206        public function customize_register( $wp_customize ) {
     207
     208                // Add postMessage support for site title and tagline
     209                $wp_customize->get_setting( 'blogname' )->transport        = 'postMessage';
     210                $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';
     211
    206212                // Enable Web Fonts
    207213                $wp_customize->add_section( $this->option_key . '_enable_fonts', array(
    208214                        'title'    => __( 'Fonts', 'twentytwelve' ),
     
    215221                        'default'    => $defaults['enable_fonts'],
    216222                        'type'       => 'option',
    217223                        'capability' => 'edit_theme_options',
     224                        'transport'  => 'postMessage',
    218225                ) );
    219226
    220227                $wp_customize->add_control( $this->option_key . '_enable_fonts', array(
     
    224231                        'type'     => 'checkbox',
    225232                ) );
    226233        }
     234
     235        /**
     236         * Bind JS handlers to make Theme Customizer preview reload changes asynchronously.
     237         *
     238         * @since Twenty Twelve 1.0
     239         * @access public
     240         *
     241         * @return void
     242         */
     243        public function customize_preview_js() {
     244                wp_enqueue_script( 'twentytwelve-customizer', get_template_directory_uri() . '/js/theme-customizer.js', array( 'customize-preview' ), '20120725', true );
     245                wp_localize_script( 'twentytwelve-customizer', 'twentytwelve_customizer', array(
     246                        'option_key' => $this->option_key,
     247                        'link'       => $this->custom_fonts_url(),
     248                ) );
     249        }
     250
     251        /**
     252         * Create path to load fonts CSS file with correct protocol.
     253         *
     254         * @since Twenty Twelve 1.0
     255         * @access public
     256         *
     257         * @return string Path to load fonts CSS.
     258         */
     259        public function custom_fonts_url() {
     260                $protocol = is_ssl() ? 'https' : 'http';
     261                return $protocol . '://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700';
     262        }
    227263}
     264 No newline at end of file
  • wp-content/themes/twentytwelve/js/theme-customizer.js

     
    1 ( function( $ ){
     1/**
     2 * Theme Customizer enhancements for a better user experience.
     3 *
     4 * Contains handlers to make Theme Customizer preview reload changes asynchronously.
     5 * Things like fonts, site title and description, and background color changes.
     6 *
     7 * See related settings in Twenty_Twelve_Options::customize_preview_js()
     8 */
     9
     10( function( $ ) {
     11        // Site title and description.
     12        wp.customize( 'blogname', function( value ) {
     13                value.bind( function( to ) {
     14                        $( '.site-title a' ).html( to );
     15                } );
     16        } );
     17        wp.customize( 'blogdescription', function( value ) {
     18                value.bind( function( to ) {
     19                        $( '.site-description' ).html( to );
     20                } );
     21        } );
     22
     23        // Custom fonts.
     24        wp.customize( twentytwelve_customizer.option_key + '[enable_fonts]', function( value ) {
     25                value.bind( function( to ) {
     26                        if ( to ) {
     27                                $( 'head' ).append( '<link rel="stylesheet" id="twentytwelve-fonts-css" href="' + twentytwelve_customizer.link + '" type="text/css" media="all" />' );
     28                        } else {
     29                                $( '#twentytwelve-fonts-css' ).remove();
     30                        }
     31                } );
     32        } );
     33
    234        // Hook into background color change and adjust body class value as needed.
    335        wp.customize( 'background_color', function( value ) {
    436                var body = $( 'body' );