From 57031b69851808623e679125bb195d499065fde8 Mon Sep 17 00:00:00 2001 From: Lance Willett Date: Tue, 28 Aug 2012 02:18:43 +0000 Subject: [PATCH] Twenty Twelve: simplify custom font loading behavior, see #21694. * Remove theme options code and support from theme. * Keep Open Sans font first in the stack and make it always loaded. * Move Customizer pieces from Theme Options out of class structure and into functions.php. git-svn-id: http://core.svn.wordpress.org/trunk@21639 1a063a9b-81f0-0310-95a4-ce76da25c4cd --- functions.php | 40 ++++--- inc/theme-options.php | 260 ----------------------------------------- js/theme-customizer.js | 15 +-- style.css | 2 +- 4 files changed, 30 insertions(+), 287 deletions(-) delete mode 100644 inc/theme-options.php diff --git a/functions.php b/functions.php index 21d678e6b..cd17f5e17 100644 --- a/functions.php +++ b/functions.php @@ -42,8 +42,6 @@ if ( ! isset( $content_width ) ) * @since Twenty Twelve 1.0 */ function twentytwelve_setup() { - global $twentytwelve_options; - /* * Makes Twenty Twelve available for translation. * @@ -53,10 +51,6 @@ function twentytwelve_setup() { */ load_theme_textdomain( 'twentytwelve', get_template_directory() . '/languages' ); - // Load up our theme options page and related code. - require( get_template_directory() . '/inc/theme-options.php' ); - $twentytwelve_options = new Twenty_Twelve_Options(); - // This theme styles the visual editor with editor-style.css to match the theme style. add_editor_style(); @@ -94,8 +88,6 @@ require( get_template_directory() . '/inc/custom-header.php' ); * @since Twenty Twelve 1.0 */ function twentytwelve_scripts_styles() { - global $twentytwelve_options; - /* * Adds JavaScript to pages with the comment form to support * sites with threaded comments (when in use). @@ -110,11 +102,9 @@ function twentytwelve_scripts_styles() { /* * Loads our special font CSS file. - * Depends on Theme Options setting. */ - $options = $twentytwelve_options->get_theme_options(); - if ( $options['enable_fonts'] ) - wp_enqueue_style( 'twentytwelve-fonts', $twentytwelve_options->custom_fonts_url(), array(), null ); + $protocol = is_ssl() ? 'https' : 'http'; + wp_enqueue_style( 'twentytwelve-fonts', "$protocol://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700", array(), null ); /* * Loads our main stylesheet. @@ -399,4 +389,28 @@ function twentytwelve_content_width() { $content_width = 960; } } -add_action( 'template_redirect', 'twentytwelve_content_width' ); \ No newline at end of file +add_action( 'template_redirect', 'twentytwelve_content_width' ); + +/** + * Add postMessage support for site title and description for the Theme Customizer. + * + * @since Twenty Twelve 1.0 + * + * @param WP_Customize_Manager $wp_customize Theme Customizer object. + * @return void + */ +function twentytwelve_customize_register( $wp_customize ) { + $wp_customize->get_setting( 'blogname' )->transport = 'postMessage'; + $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage'; +} +add_action( 'customize_register', 'twentytwelve_customize_register' ); + +/** + * Binds JS handlers to make Theme Customizer preview reload changes asynchronously. + * + * @since Twenty Twelve 1.0 + */ +function twentytwelve_customize_preview_js() { + wp_enqueue_script( 'twentytwelve-customizer', get_template_directory_uri() . '/js/theme-customizer.js', array( 'customize-preview' ), '20120827', true ); +} +add_action( 'customize_preview_init', 'twentytwelve_customize_preview_js' ); diff --git a/inc/theme-options.php b/inc/theme-options.php deleted file mode 100644 index f8dd328b3..000000000 --- a/inc/theme-options.php +++ /dev/null @@ -1,260 +0,0 @@ -option_key = get_stylesheet() . '_theme_options'; - - add_action( 'admin_init', array( $this, 'options_init' ) ); - add_action( 'admin_menu', array( $this, 'add_page' ) ); - add_action( 'customize_register', array( $this, 'customize_register' ) ); - add_action( 'customize_preview_init', array( $this, 'customize_preview_js' ) ); - } - - /** - * Registers the form setting for our options array. - * - * This function is attached to the admin_init action hook. - * - * This call to register_setting() registers a validation callback, validate(), - * which is used when the option is saved, to ensure that our option values are properly - * formatted, and safe. - * - * @access public - * - * @return void - */ - public function options_init() { - // Load our options for use in any method. - $this->options = $this->get_theme_options(); - - // Register our option group. - register_setting( - 'twentytwelve_options', // Options group, see settings_fields() call in render_page() - $this->option_key, // Database option, see get_theme_options() - array( $this, 'validate' ) // The sanitization callback, see validate() - ); - - // Register our settings field group. - add_settings_section( - 'general', // Unique identifier for the settings section - '', // Section title (we don't want one) - '__return_false', // Section callback (we don't want anything) - 'theme_options' // Menu slug, used to uniquely identify the page; see add_page() - ); - - // Register our individual settings fields. - add_settings_field( - 'enable_fonts', // Unique identifier for the field for this section - __( 'Enable Web Fonts', 'twentytwelve' ), // Setting field label - array( $this, 'settings_field_enable_fonts' ), // Function that renders the settings field - 'theme_options', // Menu slug, used to uniquely identify the page; see add_page() - 'general' // Settings section. Same as the first argument in the add_settings_section() above - ); - } - - /** - * Adds our theme options page to the admin menu. - * - * This function is attached to the admin_menu action hook. - * - * @access public - * - * @return void - */ - public function add_page() { - $theme_page = add_theme_page( - __( 'Theme Options', 'twentytwelve' ), // Name of page - __( 'Theme Options', 'twentytwelve' ), // Label in menu - 'edit_theme_options', // Capability required - 'theme_options', // Menu slug, used to uniquely identify the page - array( $this, 'render_page' ) // Function that renders the options page - ); - } - - /** - * Returns the default options. - * - * @access public - * - * @return array - */ - public function get_default_theme_options() { - $default_theme_options = array( - 'enable_fonts' => false, - ); - - return apply_filters( 'twentytwelve_default_theme_options', $default_theme_options ); - } - - /** - * Returns the options array. - * - * @access public - * - * @return array - */ - public function get_theme_options() { - return get_option( $this->option_key, $this->get_default_theme_options() ); - } - - /** - * Renders the enable fonts checkbox setting field. - * - * @access public - * - * @return void - */ - public function settings_field_enable_fonts() { - $options = $this->options; - ?> - - -
- - -

- - -
- -
-
- get_default_theme_options(); - - // The enable fonts checkbox should a boolean value, true or false. - $output['enable_fonts'] = ( isset( $input['enable_fonts'] ) && $input['enable_fonts'] ); - - return apply_filters( 'twentytwelve_options_validate', $output, $input, $defaults ); - } - - /** - * Implements Twenty Twelve theme options into Theme Customizer. - * - * @since Twenty Twelve 1.0 - * @access public - * @param WP_Customize_Manager $wp_customize Theme Customizer object. - * - * @return void - */ - public function customize_register( $wp_customize ) { - - // Add postMessage support for site title and tagline - $wp_customize->get_setting( 'blogname' )->transport = 'postMessage'; - $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage'; - - // Enable Web Fonts - $wp_customize->add_section( $this->option_key . '_enable_fonts', array( - 'title' => __( 'Fonts', 'twentytwelve' ), - 'priority' => 35, - ) ); - - $defaults = $this->get_default_theme_options(); - - $wp_customize->add_setting( $this->option_key . '[enable_fonts]', array( - 'default' => $defaults['enable_fonts'], - 'type' => 'option', - 'transport' => 'postMessage', - ) ); - - $wp_customize->add_control( $this->option_key . '_enable_fonts', array( - 'label' => __( 'Enable the Open Sans typeface.', 'twentytwelve' ), - 'section' => $this->option_key . '_enable_fonts', - 'settings' => $this->option_key . '[enable_fonts]', - 'type' => 'checkbox', - ) ); - } - - /** - * Binds JS handlers to make Theme Customizer preview reload changes asynchronously. - * - * @since Twenty Twelve 1.0 - * @access public - * - * @return void - */ - public function customize_preview_js() { - wp_enqueue_script( 'twentytwelve-customizer', get_template_directory_uri() . '/js/theme-customizer.js', array( 'customize-preview' ), '20120802', true ); - wp_localize_script( 'twentytwelve-customizer', 'twentytwelve_customizer', array( - 'option_key' => $this->option_key, - 'link' => $this->custom_fonts_url(), - ) ); - } - - /** - * Creates path to load fonts CSS file with correct protocol. - * - * @since Twenty Twelve 1.0 - * @access public - * - * @return string Path to load fonts CSS. - */ - public function custom_fonts_url() { - $protocol = is_ssl() ? 'https' : 'http'; - return $protocol . '://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700'; - } -} \ No newline at end of file diff --git a/js/theme-customizer.js b/js/theme-customizer.js index cbf524b6b..996be13af 100644 --- a/js/theme-customizer.js +++ b/js/theme-customizer.js @@ -2,9 +2,9 @@ * Theme Customizer enhancements for a better user experience. * * Contains handlers to make Theme Customizer preview reload changes asynchronously. - * Things like fonts, site title and description, and background color changes. + * Things like site title, description, and background color changes. * - * See related settings in Twenty_Twelve_Options::customize_preview_js() + * See related settings in twentytwelve_customize_preview_js() */ ( function( $ ) { @@ -20,17 +20,6 @@ } ); } ); - // Custom fonts. - wp.customize( twentytwelve_customizer.option_key + '[enable_fonts]', function( value ) { - value.bind( function( to ) { - if ( to ) { - $( 'head' ).append( '' ); - } else { - $( '#twentytwelve-fonts-css' ).remove(); - } - } ); - } ); - // Hook into background color change and adjust body class value as needed. wp.customize( 'background_color', function( value ) { value.bind( function( to ) { diff --git a/style.css b/style.css index fac53d5db..22b482791 100644 --- a/style.css +++ b/style.css @@ -297,7 +297,7 @@ object, video { max-width: 100%; } -.entry-content .twitter-tweet-rendered { +.entry-content .twitter-tweet-rendered { max-width: 100% !important; /* Override the Twitter embed fixed width */ }