Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Design > Voices That Matter

  • Print
  • + Share This
From the author of Setting Up Sections, Settings, and Controls

Setting Up Sections, Settings, and Controls

First off, we need to specify the section we're modifying in the Theme Customizer. In this case, we're adding some options to the Color section: Content Background Color, Content Text Color, and Content Link Color.

  1. In your functions.php file, after the opening brace ({) in your $wp_customize function, add the following code, using the name of your theme in place of THEMENAME:
  2. $colors = array();
      $colors[] = array( 'slug'=>'content_bg_color', 'default' => '#ffffff',
      'label' => __( 'Content Background Color', 'THEMENAME' ) );
      $colors[] = array( 'slug'=>'content_text_color', 'default' => '#000000',
      'label' => __( 'Content Text Color', 'THEMENAME' ) );
      $colors[] = array( 'slug'=>'content_link_color', 'default' => '#000000',
      'label' => __( 'Content Link Color', 'THEMENAME' ) );
  3. Next, we need to define the parameters for each Setting and Control. Add the following lines, with the opening brace ({) appearing below the section code you just added:
  4. foreach($colors as $color)
      {
  5. Now we can add the Settings and Controls. Add the following code just below that second opening brace ({):
  6.  // SETTINGS
        $wp_customize->add_setting( $color['slug'], array( 'default' => $color['default'],
        'type' => 'option', 'capability' => 'edit_theme_options' ));
    
        // CONTROLS
        $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize,
         $color['slug'], array( 'label' => $color['label'], 'section' => 'colors',
         'settings' => $color['slug'] )));
      }
  7. Add the final closing brace (}) to complete the $wp_customize function.
  8. Save and close your functions.php file.
  • + Share This
  • 🔖 Save To Your Account