[Summary view] [Print] [Text view]

   1  <?php
   2  /**
   3   * Twenty Eleven Theme Options
   4   *
   5   * @package WordPress
   6   * @subpackage Twenty_Eleven
   7   * @since Twenty Eleven 1.0
   8   */
   9  
  10  /**
  11   * Properly enqueue styles and scripts for our theme options page.
  12   *
  13   * This function is attached to the admin_enqueue_scripts action hook.
  14   *
  15   * @since Twenty Eleven 1.0
  16   *
  17   * @param string $hook_suffix An admin page's hook suffix.
  18   */
  19  function twentyeleven_admin_enqueue_scripts( $hook_suffix ) {
  20      wp_enqueue_style( 'twentyeleven-theme-options', get_template_directory_uri() . '/inc/theme-options.css', false, '20110602' );
  21      wp_enqueue_script( 'twentyeleven-theme-options', get_template_directory_uri() . '/inc/theme-options.js', array( 'farbtastic' ), '20110610' );
  22      wp_enqueue_style( 'farbtastic' );
  23  }
  24  add_action( 'admin_print_styles-appearance_page_theme_options', 'twentyeleven_admin_enqueue_scripts' );
  25  
  26  /**
  27   * Register the form setting for our twentyeleven_options array.
  28   *
  29   * This function is attached to the admin_init action hook.
  30   *
  31   * This call to register_setting() registers a validation callback, twentyeleven_theme_options_validate(),
  32   * which is used when the option is saved, to ensure that our option values are complete, properly
  33   * formatted, and safe.
  34   *
  35   * @since Twenty Eleven 1.0
  36   */
  37  function twentyeleven_theme_options_init() {
  38  
  39      register_setting(
  40          'twentyeleven_options',               // Options group, see settings_fields() call in twentyeleven_theme_options_render_page().
  41          'twentyeleven_theme_options',         // Database option, see twentyeleven_get_theme_options().
  42          'twentyeleven_theme_options_validate' // The sanitization callback, see twentyeleven_theme_options_validate().
  43      );
  44  
  45      // Register our settings field group.
  46      add_settings_section(
  47          'general',        // Unique identifier for the settings section.
  48          '',               // Section title (we don't want one).
  49          '__return_false', // Section callback (we don't want anything).
  50          'theme_options'   // Menu slug, used to uniquely identify the page; see twentyeleven_theme_options_add_page().
  51      );
  52  
  53      // Register our individual settings fields.
  54      add_settings_field(
  55          'color_scheme',                             // Unique identifier for the field for this section.
  56          __( 'Color Scheme', 'twentyeleven' ),       // Setting field label.
  57          'twentyeleven_settings_field_color_scheme', // Function that renders the settings field.
  58          'theme_options',                            // Menu slug, used to uniquely identify the page; see twentyeleven_theme_options_add_page().
  59          'general'                                   // Settings section. Same as the first argument in the add_settings_section() above.
  60      );
  61  
  62      add_settings_field( 'link_color', __( 'Link Color', 'twentyeleven' ), 'twentyeleven_settings_field_link_color', 'theme_options', 'general' );
  63      add_settings_field( 'layout', __( 'Default Layout', 'twentyeleven' ), 'twentyeleven_settings_field_layout', 'theme_options', 'general' );
  64  }
  65  add_action( 'admin_init', 'twentyeleven_theme_options_init' );
  66  
  67  /**
  68   * Change the capability required to save the 'twentyeleven_options' options group.
  69   *
  70   * @see twentyeleven_theme_options_init()     First parameter to register_setting() is the name of the options group.
  71   * @see twentyeleven_theme_options_add_page() The edit_theme_options capability is used for viewing the page.
  72   *
  73   * By default, the options groups for all registered settings require the manage_options capability.
  74   * This filter is required to change our theme options page to edit_theme_options instead.
  75   * By default, only administrators have either of these capabilities, but the desire here is
  76   * to allow for finer-grained control for roles and users.
  77   *
  78   * @param string $capability The capability used for the page, which is manage_options by default.
  79   * @return string The capability to actually use.
  80   */
  81  function twentyeleven_option_page_capability( $capability ) {
  82      return 'edit_theme_options';
  83  }
  84  add_filter( 'option_page_capability_twentyeleven_options', 'twentyeleven_option_page_capability' );
  85  
  86  /**
  87   * Add a theme options page to the admin menu, including some help documentation.
  88   *
  89   * This function is attached to the admin_menu action hook.
  90   *
  91   * @since Twenty Eleven 1.0
  92   */
  93  function twentyeleven_theme_options_add_page() {
  94      $theme_page = add_theme_page(
  95          __( 'Theme Options', 'twentyeleven' ),   // Name of page.
  96          __( 'Theme Options', 'twentyeleven' ),   // Label in menu.
  97          'edit_theme_options',                    // Capability required.
  98          'theme_options',                         // Menu slug, used to uniquely identify the page.
  99          'twentyeleven_theme_options_render_page' // Function that renders the options page.
 100      );
 101  
 102      if ( ! $theme_page ) {
 103          return;
 104      }
 105  
 106      add_action( "load-{$theme_page}", 'twentyeleven_theme_options_help' );
 107  }
 108  add_action( 'admin_menu', 'twentyeleven_theme_options_add_page' );
 109  
 110  function twentyeleven_theme_options_help() {
 111  
 112      $help = '<p>' . __( 'Some themes provide customization options that are grouped together on a Theme Options screen. If you change themes, options may change or disappear, as they are theme-specific. Your current theme, Twenty Eleven, provides the following Theme Options:', 'twentyeleven' ) . '</p>' .
 113              '<ol>' .
 114                  '<li>' . __( '<strong>Color Scheme</strong>: You can choose a color palette of "Light" (light background with dark text) or "Dark" (dark background with light text) for your site.', 'twentyeleven' ) . '</li>' .
 115                  '<li>' . __( '<strong>Link Color</strong>: You can choose the color used for text links on your site. You can enter the HTML color or hex code, or you can choose visually by clicking the "Select a Color" button to pick from a color wheel.', 'twentyeleven' ) . '</li>' .
 116                  '<li>' . __( '<strong>Default Layout</strong>: You can choose if you want your site&#8217;s default layout to have a sidebar on the left, the right, or not at all.', 'twentyeleven' ) . '</li>' .
 117              '</ol>' .
 118              '<p>' . __( 'Remember to click "Save Changes" to save any changes you have made to the theme options.', 'twentyeleven' ) . '</p>';
 119  
 120      $sidebar = '<p><strong>' . __( 'For more information:', 'twentyeleven' ) . '</strong></p>' .
 121          '<p>' . __( '<a href="https://wordpress.org/support/article/appearance-customize-screen/" target="_blank">Documentation on Theme Options</a>', 'twentyeleven' ) . '</p>' .
 122          '<p>' . __( '<a href="https://wordpress.org/support/" target="_blank">Support</a>', 'twentyeleven' ) . '</p>';
 123  
 124      $screen = get_current_screen();
 125  
 126      if ( method_exists( $screen, 'add_help_tab' ) ) {
 127          // WordPress 3.3.0.
 128          $screen->add_help_tab(
 129              array(
 130                  'title'   => __( 'Overview', 'twentyeleven' ),
 131                  'id'      => 'theme-options-help',
 132                  'content' => $help,
 133              )
 134          );
 135  
 136          $screen->set_help_sidebar( $sidebar );
 137      } else {
 138          // WordPress 3.2.0.
 139          add_contextual_help( $screen, $help . $sidebar );
 140      }
 141  }
 142  
 143  /**
 144   * Return an array of color schemes registered for Twenty Eleven.
 145   *
 146   * @since Twenty Eleven 1.0
 147   */
 148  function twentyeleven_color_schemes() {
 149      $color_scheme_options = array(
 150          'light' => array(
 151              'value'              => 'light',
 152              'label'              => __( 'Light', 'twentyeleven' ),
 153              'thumbnail'          => get_template_directory_uri() . '/inc/images/light.png',
 154              'default_link_color' => '#1b8be0',
 155          ),
 156          'dark'  => array(
 157              'value'              => 'dark',
 158              'label'              => __( 'Dark', 'twentyeleven' ),
 159              'thumbnail'          => get_template_directory_uri() . '/inc/images/dark.png',
 160              'default_link_color' => '#e4741f',
 161          ),
 162      );
 163  
 164      /**
 165       * Filters the Twenty Eleven color scheme options.
 166       *
 167       * @since Twenty Eleven 1.0
 168       *
 169       * @param array $color_scheme_options An associative array of color scheme options.
 170       */
 171      return apply_filters( 'twentyeleven_color_schemes', $color_scheme_options );
 172  }
 173  
 174  /**
 175   * Return an array of layout options registered for Twenty Eleven.
 176   *
 177   * @since Twenty Eleven 1.0
 178   */
 179  function twentyeleven_layouts() {
 180      $layout_options = array(
 181          'content-sidebar' => array(
 182              'value'     => 'content-sidebar',
 183              'label'     => __( 'Content on left', 'twentyeleven' ),
 184              'thumbnail' => get_template_directory_uri() . '/inc/images/content-sidebar.png',
 185          ),
 186          'sidebar-content' => array(
 187              'value'     => 'sidebar-content',
 188              'label'     => __( 'Content on right', 'twentyeleven' ),
 189              'thumbnail' => get_template_directory_uri() . '/inc/images/sidebar-content.png',
 190          ),
 191          'content'         => array(
 192              'value'     => 'content',
 193              'label'     => __( 'One-column, no sidebar', 'twentyeleven' ),
 194              'thumbnail' => get_template_directory_uri() . '/inc/images/content.png',
 195          ),
 196      );
 197  
 198      /**
 199       * Filters the Twenty Eleven layout options.
 200       *
 201       * @since Twenty Eleven 1.0
 202       *
 203       * @param array $layout_options An associative array of layout options.
 204       */
 205      return apply_filters( 'twentyeleven_layouts', $layout_options );
 206  }
 207  
 208  /**
 209   * Return the default options for Twenty Eleven.
 210   *
 211   * @since Twenty Eleven 1.0
 212   *
 213   * @return array An array of default theme options.
 214   */
 215  function twentyeleven_get_default_theme_options() {
 216      $default_theme_options = array(
 217          'color_scheme' => 'light',
 218          'link_color'   => twentyeleven_get_default_link_color( 'light' ),
 219          'theme_layout' => 'content-sidebar',
 220      );
 221  
 222      if ( is_rtl() ) {
 223          $default_theme_options['theme_layout'] = 'sidebar-content';
 224      }
 225  
 226      /**
 227       * Filters the Twenty Eleven default options.
 228       *
 229       * @since Twenty Eleven 1.0
 230       *
 231       * @param array $default_theme_options An array of default theme options.
 232       */
 233      return apply_filters( 'twentyeleven_default_theme_options', $default_theme_options );
 234  }
 235  
 236  /**
 237   * Return the default link color for Twenty Eleven, based on color scheme.
 238   *
 239   * @since Twenty Eleven 1.0
 240   *
 241   * @param string $color_scheme Optional. Color scheme.
 242   *                             Default null (or the active color scheme).
 243   * @return string The default link color.
 244   */
 245  function twentyeleven_get_default_link_color( $color_scheme = null ) {
 246      if ( null === $color_scheme ) {
 247          $options      = twentyeleven_get_theme_options();
 248          $color_scheme = $options['color_scheme'];
 249      }
 250  
 251      $color_schemes = twentyeleven_color_schemes();
 252      if ( ! isset( $color_schemes[ $color_scheme ] ) ) {
 253          return false;
 254      }
 255  
 256      return $color_schemes[ $color_scheme ]['default_link_color'];
 257  }
 258  
 259  /**
 260   * Return the options array for Twenty Eleven.
 261   *
 262   * @since Twenty Eleven 1.0
 263   */
 264  function twentyeleven_get_theme_options() {
 265      return get_option( 'twentyeleven_theme_options', twentyeleven_get_default_theme_options() );
 266  }
 267  
 268  /**
 269   * Render the Color Scheme setting field.
 270   *
 271   * @since Twenty Eleven 1.3
 272   */
 273  function twentyeleven_settings_field_color_scheme() {
 274      $options = twentyeleven_get_theme_options();
 275  
 276      foreach ( twentyeleven_color_schemes() as $scheme ) {
 277          ?>
 278      <div class="layout image-radio-option color-scheme">
 279      <label class="description">
 280          <input type="radio" name="twentyeleven_theme_options[color_scheme]" value="<?php echo esc_attr( $scheme['value'] ); ?>" <?php checked( $options['color_scheme'], $scheme['value'] ); ?> />
 281          <input type="hidden" id="default-color-<?php echo esc_attr( $scheme['value'] ); ?>" value="<?php echo esc_attr( $scheme['default_link_color'] ); ?>" />
 282          <span>
 283              <img src="<?php echo esc_url( $scheme['thumbnail'] ); ?>" width="136" height="122" alt="" />
 284              <?php echo esc_html( $scheme['label'] ); ?>
 285          </span>
 286      </label>
 287      </div>
 288          <?php
 289      }
 290  }
 291  
 292  /**
 293   * Render the Link Color setting field.
 294   *
 295   * @since Twenty Eleven 1.3
 296   */
 297  function twentyeleven_settings_field_link_color() {
 298      $options = twentyeleven_get_theme_options();
 299      ?>
 300      <input type="text" name="twentyeleven_theme_options[link_color]" id="link-color" value="<?php echo esc_attr( $options['link_color'] ); ?>" />
 301      <a href="#" class="pickcolor hide-if-no-js" id="link-color-example"></a>
 302      <input type="button" class="pickcolor button hide-if-no-js" value="<?php esc_attr_e( 'Select a Color', 'twentyeleven' ); ?>" />
 303      <div id="colorPickerDiv" style="z-index: 100; background:#eee; border:1px solid #ccc; position:absolute; display:none;"></div>
 304      <br />
 305      <span>
 306      <?php
 307      /* translators: %s: Link color. */
 308      printf( __( 'Default color: %s', 'twentyeleven' ), '<span id="default-color">' . twentyeleven_get_default_link_color( $options['color_scheme'] ) . '</span>' );
 309      ?>
 310      </span>
 311      <?php
 312  }
 313  
 314  /**
 315   * Render the Layout setting field.
 316   *
 317   * @since Twenty Eleven 1.3
 318   */
 319  function twentyeleven_settings_field_layout() {
 320      $options = twentyeleven_get_theme_options();
 321      foreach ( twentyeleven_layouts() as $layout ) {
 322          ?>
 323          <div class="layout image-radio-option theme-layout">
 324          <label class="description">
 325              <input type="radio" name="twentyeleven_theme_options[theme_layout]" value="<?php echo esc_attr( $layout['value'] ); ?>" <?php checked( $options['theme_layout'], $layout['value'] ); ?> />
 326              <span>
 327                  <img src="<?php echo esc_url( $layout['thumbnail'] ); ?>" width="136" height="122" alt="" />
 328                  <?php echo esc_html( $layout['label'] ); ?>
 329              </span>
 330          </label>
 331          </div>
 332          <?php
 333      }
 334  }
 335  
 336  /**
 337   * Render the theme options page for Twenty Eleven.
 338   *
 339   * @since Twenty Eleven 1.2
 340   */
 341  function twentyeleven_theme_options_render_page() {
 342      ?>
 343      <div class="wrap">
 344          <?php screen_icon(); ?>
 345          <?php $theme_name = function_exists( 'wp_get_theme' ) ? wp_get_theme() : get_current_theme(); ?>
 346          <h2>
 347          <?php
 348          /* translators: %s: Theme name. */
 349          printf( __( '%s Theme Options', 'twentyeleven' ), $theme_name );
 350          ?>
 351          </h2>
 352          <?php settings_errors(); ?>
 353  
 354          <form method="post" action="options.php">
 355              <?php
 356                  settings_fields( 'twentyeleven_options' );
 357                  do_settings_sections( 'theme_options' );
 358                  submit_button();
 359              ?>
 360          </form>
 361      </div>
 362      <?php
 363  }
 364  
 365  /**
 366   * Sanitize and validate form input.
 367   *
 368   * Accepts an array, return a sanitized array.
 369   *
 370   * @see twentyeleven_theme_options_init()
 371   * @todo set up Reset Options action
 372   *
 373   * @since Twenty Eleven 1.0
 374   *
 375   * @param array $input An array of form input.
 376   */
 377  function twentyeleven_theme_options_validate( $input ) {
 378      $defaults = twentyeleven_get_default_theme_options();
 379      $output   = $defaults;
 380  
 381      // Color scheme must be in our array of color scheme options.
 382      if ( isset( $input['color_scheme'] ) && array_key_exists( $input['color_scheme'], twentyeleven_color_schemes() ) ) {
 383          $output['color_scheme'] = $input['color_scheme'];
 384      }
 385  
 386      // Our defaults for the link color may have changed, based on the color scheme.
 387      $defaults['link_color'] = twentyeleven_get_default_link_color( $output['color_scheme'] );
 388      $output['link_color']   = $defaults['link_color'];
 389  
 390      // Link color must be 3 or 6 hexadecimal characters.
 391      if ( isset( $input['link_color'] ) && preg_match( '/^#?([a-f0-9]{3}){1,2}$/i', $input['link_color'] ) ) {
 392          $output['link_color'] = '#' . strtolower( ltrim( $input['link_color'], '#' ) );
 393      }
 394  
 395      // Theme layout must be in our array of theme layout options.
 396      if ( isset( $input['theme_layout'] ) && array_key_exists( $input['theme_layout'], twentyeleven_layouts() ) ) {
 397          $output['theme_layout'] = $input['theme_layout'];
 398      }
 399  
 400      /**
 401       * Filters the Twenty Eleven sanitized form input array.
 402       *
 403       * @since Twenty Eleven 1.0
 404       *
 405       * @param array $output   An array of sanitized form output.
 406       * @param array $input    An array of un-sanitized form input.
 407       * @param array $defaults An array of default theme options.
 408       */
 409      return apply_filters( 'twentyeleven_theme_options_validate', $output, $input, $defaults );
 410  }
 411  
 412  /**
 413   * Enqueue the styles for the current color scheme.
 414   *
 415   * @since Twenty Eleven 1.0
 416   */
 417  function twentyeleven_enqueue_color_scheme() {
 418      $options      = twentyeleven_get_theme_options();
 419      $color_scheme = $options['color_scheme'];
 420  
 421      if ( 'dark' === $color_scheme ) {
 422          wp_enqueue_style( 'dark', get_template_directory_uri() . '/colors/dark.css', array(), '20190404' );
 423      }
 424  
 425      /**
 426       * Fires after the styles for the Twenty Eleven color scheme are enqueued.
 427       *
 428       * @since Twenty Eleven 1.0
 429       *
 430       * @param string $color_scheme The color scheme.
 431       */
 432      do_action( 'twentyeleven_enqueue_color_scheme', $color_scheme );
 433  }
 434  add_action( 'wp_enqueue_scripts', 'twentyeleven_enqueue_color_scheme' );
 435  
 436  /**
 437   * Add a style block to the theme for the current link color.
 438   *
 439   * This function is attached to the wp_head action hook.
 440   *
 441   * @since Twenty Eleven 1.0
 442   */
 443  function twentyeleven_print_link_color_style() {
 444      $options    = twentyeleven_get_theme_options();
 445      $link_color = $options['link_color'];
 446  
 447      $default_options = twentyeleven_get_default_theme_options();
 448  
 449      // Don't do anything if the current link color is the default.
 450      if ( $default_options['link_color'] == $link_color ) {
 451          return;
 452      }
 453      ?>
 454      <style>
 455          /* Link color */
 456          a,
 457          #site-title a:focus,
 458          #site-title a:hover,
 459          #site-title a:active,
 460          .entry-title a:hover,
 461          .entry-title a:focus,
 462          .entry-title a:active,
 463          .widget_twentyeleven_ephemera .comments-link a:hover,
 464          section.recent-posts .other-recent-posts a[rel="bookmark"]:hover,
 465          section.recent-posts .other-recent-posts .comments-link a:hover,
 466          .format-image footer.entry-meta a:hover,
 467          #site-generator a:hover {
 468              color: <?php echo $link_color; ?>;
 469          }
 470          section.recent-posts .other-recent-posts .comments-link a:hover {
 471              border-color: <?php echo $link_color; ?>;
 472          }
 473          article.feature-image.small .entry-summary p a:hover,
 474          .entry-header .comments-link a:hover,
 475          .entry-header .comments-link a:focus,
 476          .entry-header .comments-link a:active,
 477          .feature-slider a.active {
 478              background-color: <?php echo $link_color; ?>;
 479          }
 480      </style>
 481      <?php
 482  }
 483  add_action( 'wp_head', 'twentyeleven_print_link_color_style' );
 484  
 485  /**
 486   * Add Twenty Eleven layout classes to the array of body classes.
 487   *
 488   * @since Twenty Eleven 1.0
 489   *
 490   * @param array $existing_classes An array of existing body classes.
 491   */
 492  function twentyeleven_layout_classes( $existing_classes ) {
 493      $options        = twentyeleven_get_theme_options();
 494      $current_layout = $options['theme_layout'];
 495  
 496      if ( in_array( $current_layout, array( 'content-sidebar', 'sidebar-content' ), true ) ) {
 497          $classes = array( 'two-column' );
 498      } else {
 499          $classes = array( 'one-column' );
 500      }
 501  
 502      if ( 'content-sidebar' === $current_layout ) {
 503          $classes[] = 'right-sidebar';
 504      } elseif ( 'sidebar-content' === $current_layout ) {
 505          $classes[] = 'left-sidebar';
 506      } else {
 507          $classes[] = $current_layout;
 508      }
 509  
 510      /**
 511       * Filters the Twenty Eleven layout body classes.
 512       *
 513       * @since Twenty Eleven 1.0
 514       *
 515       * @param array  $classes        An array of body classes.
 516       * @param string $current_layout The current theme layout.
 517       */
 518      $classes = apply_filters( 'twentyeleven_layout_classes', $classes, $current_layout );
 519  
 520      return array_merge( $existing_classes, $classes );
 521  }
 522  add_filter( 'body_class', 'twentyeleven_layout_classes' );
 523  
 524  /**
 525   * Implements Twenty Eleven theme options into Customizer
 526   *
 527   * @since Twenty Eleven 1.3
 528   *
 529   * @param WP_Customize_Manager $wp_customize Customizer object.
 530   */
 531  function twentyeleven_customize_register( $wp_customize ) {
 532      $wp_customize->get_setting( 'blogname' )->transport         = 'postMessage';
 533      $wp_customize->get_setting( 'blogdescription' )->transport  = 'postMessage';
 534      $wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';
 535  
 536      if ( isset( $wp_customize->selective_refresh ) ) {
 537          $wp_customize->selective_refresh->add_partial(
 538              'blogname',
 539              array(
 540                  'selector'            => '#site-title a',
 541                  'container_inclusive' => false,
 542                  'render_callback'     => 'twentyeleven_customize_partial_blogname',
 543              )
 544          );
 545          $wp_customize->selective_refresh->add_partial(
 546              'blogdescription',
 547              array(
 548                  'selector'            => '#site-description',
 549                  'container_inclusive' => false,
 550                  'render_callback'     => 'twentyeleven_customize_partial_blogdescription',
 551              )
 552          );
 553      }
 554  
 555      $options  = twentyeleven_get_theme_options();
 556      $defaults = twentyeleven_get_default_theme_options();
 557  
 558      $wp_customize->add_setting(
 559          'twentyeleven_theme_options[color_scheme]',
 560          array(
 561              'default'    => $defaults['color_scheme'],
 562              'type'       => 'option',
 563              'capability' => 'edit_theme_options',
 564          )
 565      );
 566  
 567      $schemes = twentyeleven_color_schemes();
 568      $choices = array();
 569      foreach ( $schemes as $scheme ) {
 570          $choices[ $scheme['value'] ] = $scheme['label'];
 571      }
 572  
 573      $wp_customize->add_control(
 574          'twentyeleven_color_scheme',
 575          array(
 576              'label'    => __( 'Color Scheme', 'twentyeleven' ),
 577              'section'  => 'colors',
 578              'settings' => 'twentyeleven_theme_options[color_scheme]',
 579              'type'     => 'radio',
 580              'choices'  => $choices,
 581              'priority' => 5,
 582          )
 583      );
 584  
 585      // Link Color (added to Color Scheme section in Customizer).
 586      $wp_customize->add_setting(
 587          'twentyeleven_theme_options[link_color]',
 588          array(
 589              'default'           => twentyeleven_get_default_link_color( $options['color_scheme'] ),
 590              'type'              => 'option',
 591              'sanitize_callback' => 'sanitize_hex_color',
 592              'capability'        => 'edit_theme_options',
 593          )
 594      );
 595  
 596      $wp_customize->add_control(
 597          new WP_Customize_Color_Control(
 598              $wp_customize,
 599              'link_color',
 600              array(
 601                  'label'    => __( 'Link Color', 'twentyeleven' ),
 602                  'section'  => 'colors',
 603                  'settings' => 'twentyeleven_theme_options[link_color]',
 604              )
 605          )
 606      );
 607  
 608      // Default Layout.
 609      $wp_customize->add_section(
 610          'twentyeleven_layout',
 611          array(
 612              'title'    => __( 'Layout', 'twentyeleven' ),
 613              'priority' => 50,
 614          )
 615      );
 616  
 617      $wp_customize->add_setting(
 618          'twentyeleven_theme_options[theme_layout]',
 619          array(
 620              'type'              => 'option',
 621              'default'           => $defaults['theme_layout'],
 622              'sanitize_callback' => 'sanitize_key',
 623          )
 624      );
 625  
 626      $layouts = twentyeleven_layouts();
 627      $choices = array();
 628      foreach ( $layouts as $layout ) {
 629          $choices[ $layout['value'] ] = $layout['label'];
 630      }
 631  
 632      $wp_customize->add_control(
 633          'twentyeleven_theme_options[theme_layout]',
 634          array(
 635              'section' => 'twentyeleven_layout',
 636              'type'    => 'radio',
 637              'choices' => $choices,
 638          )
 639      );
 640  }
 641  add_action( 'customize_register', 'twentyeleven_customize_register' );
 642  
 643  /**
 644   * Render the site title for the selective refresh partial.
 645   *
 646   * @since Twenty Eleven 2.4
 647   *
 648   * @see twentyeleven_customize_register()
 649   *
 650   * @return void
 651   */
 652  function twentyeleven_customize_partial_blogname() {
 653      bloginfo( 'name' );
 654  }
 655  
 656  /**
 657   * Render the site tagline for the selective refresh partial.
 658   *
 659   * @since Twenty Eleven 2.4
 660   *
 661   * @see twentyeleven_customize_register()
 662   *
 663   * @return void
 664   */
 665  function twentyeleven_customize_partial_blogdescription() {
 666      bloginfo( 'description' );
 667  }
 668  
 669  /**
 670   * Bind JS handlers to make Customizer preview reload changes asynchronously.
 671   *
 672   * Used with blogname and blogdescription.
 673   *
 674   * @since Twenty Eleven 1.3
 675   */
 676  function twentyeleven_customize_preview_js() {
 677      wp_enqueue_script( 'twentyeleven-customizer', get_template_directory_uri() . '/inc/theme-customizer.js', array( 'customize-preview' ), '20150401', true );
 678  }
 679  add_action( 'customize_preview_init', 'twentyeleven_customize_preview_js' );