Customize WooCommerce colors

WordPress Customizer allows users to tweak their website and let them see a live preview of the changes. It uses the WordPress Customize API introduced in WordPress 3.4. You can easily access the WordPress Customizer interface from Dashboard -> Appearance -> Customize.

Customizing WordPress themes for end users was starting to become a nightmare. There was no unified approach to customizing a theme. Each developer chose what they were comfortable with.

WordPress contributors wanted to introduce a default editing experience. So, on 2015, April 22 it was made mandatory to all WordPress.org themes to use Theme Customize API for theme options.

History of the WordPress Customizer

2012, June 13 – Theme customizer was introduced in WordPress version 3.4.
2015, April 22 – WordPress.org themes enforced to use Theme Customize API
2017, January 5 – Matt Mullenweg announced 3 main focus of 2017 (REST API, Editor and Customizer).
2017, January 5 – Weston Ruter and Mel Choyce appointed as Customizer team leads.

Native WordPress Customizer Controls

There are several built-in Customizer controls developers can leverage to build a unique editing experience. Here is the list of core Customizer controls:

WP_Customize_Control
WP_Customize_Color_Control
WP_Customize_Media_Control
WP_Customize_Upload_Control
WP_Customize_Image_Control
WP_Customize_Background_Image_Control
WP_Customize_Cropped_Image_Control
WP_Customize_Site_Icon_Control
WP_Customize_Header_Image_Control
WP_Customize_Nav_Menu_*_Control (5)
WP_Customize_Theme_Control
WP_Widget_Area_Customize_Control
WP_Widget_Form_Customize_Control

Source: Make Site management Easy with Live Preview in the Customizer by Nick Halsey

External Libraries of WordPress Customizer Controls

After the announcement made by WordPress Theme Review Team (WPTRT) on April 22, 2015 that themes in the repository must use Theme Customize API, a huge number of themes began to adopt Theme Customize API. Libraries of Customizer Custom Controls starting to get popular.

Among them we listed some of the best libraries or framework sorted by GitHub stars. Depending on your needs you can use these custom controls in your next WordPress project.

1. Kirki

With more than 46 contributors involved in this project, Kirki is the most popular WordPress library when it comes to extending the Customizer.

Using Kirki you can extend the Customizer and various controls like Color palettes, checkboxes, radio images, typography fields, repeater fields and many more. Kirki is actively developed by Aristeides Stathopoulos.

2. WordPress Theme Customizer Custom Controls

A collection of custom controls for WordPress customizer, developed by Paul underwood. So far using this library you can add control like Category Dropdown, Date Picker, Layout Picker, Menu Dropdown, Post Dropdown, Tags Dropdown, Text Editor, Textarea, Taxonomy Dropdown, User List Dropdown and Google Fonts Dropdown in your WordPress project.

3. Customizer Library

Customizer Library developed by Devin Price lets you add following custom controls to your WordPress theme or plugin: Checkbox, Select, Radio, Upload, Image, Color, Text, URL, Range, Textarea and Select (Typography).

4. Google Font Picker Control

Google Font picker custom control for WordPress customizer developed by Patrick Rauland. You can use this framework to easily add a Google Fonts in your theme or plugin which can be accessed via the Customizer.

5. WordPress Customizer Range Value Control

WordPress Customizer Range Value Control developed by Per Søderlind, is a generic range with value.

6. WordPress Customizer Toggle Control

Customizer Custom control developed by Per Søderlind lets you add Toggle on/off control to your theme customization arsenal.

7. WP Customizer Utilities

Custom WordPress customizer controls and settings (layout builder and gradient control) developed by ProteusThemes to improve their themes user experience.

8. Polygon Customizer Boilerplate

Add WordPress customizer control like Subsection, Radio Image, Google Fonts, Numeric Slider and Multiple Checkbox.

9. O2

Enhance your WordPress customization experience with custom customizer controls like Radio image, Icon picker and select controls.

10. WordPress Customizer Builder

A wrapper for $wp_customize built by Sjors Ottjes that makes developing with the WordPress customizer easier.

11. WordPress Theme Customizer Extra Custom controls

Add additional customizer custom controls like Toggle Checkbox, Info, Separator, Multi Input, Sidebar Dropdown, Image Radio Button, Slider Control and many more.

12. WordPress Customizer SASS Compiler

A WordPress Plugin that add’s a range of options for you to change the SASS variables directly into the WordPress customizer. This plugin currently adds Twitter Bootstrap to your WordPress install and includes a range of options for you to change the SASS variables on the fly from within your WordPress install.

13. Customizer Definitely

Framework built by Felix Arntz to make adding customizer panels, sections and fields to WordPress simple. It all works using a single action and an array.

14. FontManager Library for WordPress

Add FontManager to customize your websites Font Weight, Font Type, Font Color, Line Height, Font Size. You can easily include this file in your themes or plugins and control your fonts style.

15. Customizer Social Icons

Displaying Social Media Icons in your website is now maybe one of the most basic feature. This control will let you do that easily via Customizer. Using this control the style of icon, colors, size, and spacing of the social media icons.

16. Zentheme Pikadate

A pretty flexible date picker or calendar customizer custom control. You can add a date picker control in your theme or plugin using this control.

17. Dp-customizer

DP Customizer is a lighweight framework that creates wrapper Functions for WordPress Customize API.

18. Content Layout Control

Custom control is lightweight framework built by Nate Wright of Theme of The Crop to add different component to your page. Using via customizer interface you can add various component like Blocks, Testimonial or any other section you’ve created. It looks very exciting and useful. You can check out the control demo video here.

Besides these frameworks there are many more Customizer controls can be found on internet. If you want to stay updated about WordPress Customizer improvement bookmark these following links.

19. Customize Image Gallery Control

This control will power up your editing ability by extending the WP_Customize_Control class and help you add Customizer support for WordPress image gallery. It will allow you to choose multiple images from Media Library.

20. Customizer Repeater

Customizer Repeater is a custom control for the WordPress Theme Customizer that will let you add repeater field. Currently it supports eight types of fields : repeater_image_control, repeater_icon_control, repeater_title_control, repeater_subtitle_control, repeater_text_control, repeater_link_control, repeater_shortcode_control, repeater_repeater_control.

Important Links:

Share:

Leave a Reply