The Theme Customization API allows developers to build customization settings and controls in WordPress themes. It utilizes panels, sections, settings, and controls. Panels group sections. Sections contain controls. Controls allow changing settings, which define what the controls change. WordPress themes since version 3.4 include default customization options. Developers can also create custom controls using classes like WP_Customize_Control and subclasses for specific control types. The API allows live previews of theme customizations.

1. Theme Customizer

2. WordPress Theme
Customization API
The Theme Customization API allows
developers to build controls and settings
options in the Customize section found in
the Appearance menu in the WordPress
Dashboard.

3. Built-in
Every WordPress Theme which is installed in WordPress 3.4 and
above is provided with some default settings and controls on the Theme
Customizer Page. You don't need to declare them with add_section().
▪ title_tagline - Site Title & Tagline
▪ colors - Colors
▪ header_image - Header Image
▪ background_image - Background Image
▪ nav - Navigation
▪ static_front_page - Static Front Page

4. • Section - represent a group
of settings
• Setting - represents a
customization option of a
Theme.
• Control - is a HTML form
element on the Theme
Customizer page and it
allows admins to change a
setting on real time preview.
Controls are linked to a single
setting, and a single section.
Control
Control
Control
Control
Section
Section
Section
Definition
Setting
Setting

5. Latest update
Panels - they were added in WordPress 4.0. Group the various
sections up into Panels.
Section
Panels
• Panels group Sections together
• Sections contain Controls
• Controls are what the user changes
• Settings define what the Controls change

6. Panel, Section, Setting and Control
Panel Section Setting Control
Usage
$wp_customize.
>add_panel($id,6$args);
$wp_customize.
>add_section($id,6$args);
$wp_customize.
>add_setting($id,6$args);
$wp_customize.
>add_control($id,6$args);
Parameters
$id - (string) (required) A
unique slug-like string to use as
an id.
$args - (array) (required) An
associative array containing
arguments for the panel.
$id - (string) (required) A
unique slug-like string to use as
an id.
$args - (array) (required) An
associative array containing
arguments for the control.
$id - (string) (required) A
unique slug-like ID for the theme
setting.
$args - (array) (required) An
associative array containing
arguments for the setting.
$id - (mixed) (required) A
string or a specific
customization controller
object.
$args - (array) (required)
Not used if $id is a control
object, otherwise an instance
of WP_Customize_Control()
(plain text) is created using
the specified arguments.
Arguments
title (Translation ready)
priority
description (Translation
ready)
title (Translation ready)
priority
description (Translation
ready)
panel
default
type
capability
theme_supports
transport
sanitize_callback
sanitize_js_callback
label (Translation ready)
section
settings
type
choices

7. WP Customize class
WP_Customize_Control()
Creates a control that allows users to enter plain text. This is also the parent class for
the classes that follow.
WP_Customize_Color_Control()
Creates a control that allows users to select a color from a color wheel.
WP_Customize_Upload_Control()
Creates a control that allows users to upload media.
WP_Customize_Image_Control()
Creates a control that allows users to select or upload an image.
WP_Customize_Background_Image_Control()
Creates a control that allows users to select a new background image.
WP_Customize_Header_Image_Control()
Creates a control that allows users to select a new header image.

8. WP Customize control
Input Types
With this class you can create the following input types:
▪ text (default)
▪ checkbox
▪ radio (requires choices array in $args)
▪ select (requires choices array in $args)
▪ dropdown-pages
▪ textarea (since WordPress 4.0)

9. Theme customize flow
Developer
Admin
Create theme customizer
Setting
Theme customizer ValueTheme
Call value Do stuff
Website Update

10. Note
If you would like to upload your theme on WordPress.org, here
are somethings that you must follow to meet their requirements.
• Sanitize URL
• Translation ready

11. Reference
• https://codex.wordpress.org/Theme_Customization_API
• https://developer.wordpress.org/themes/advanced-topics/
customizer-api/
• http://ottopress.com/tag/customizer/
• http://www.sitepoint.com/getting-started-with-the-wordpress-
theme-customization-api/
• http://www.smashingmagazine.com/2013/03/05/the-wordpress-
theme-customizer-a-developers-guide/
• http://kirki.org

12. Thank you