layers_customizer_controls

Last Updated:
Back to Main Index

This filter allows modification of the controls() array, which outputs the Customizer Controls for Layers, such as Custom CSS field, Color Pickers, Checkboxes and Layout options.

Location

/core/customizer/config.php

Usage


In most cases, the core panels should not be removed from a child theme or extension, but you may want to filter them to add additional sections, or add conditions on custom sites, such as hiding all but the Colors for users with a certain role or capability.

Adding Custom Controls

The basic structure of a control is:

Each control uses an array to define itself, ie option-one , option-two  etc. At a minimum you need a type  and label  within each option.

type

Defines the type of control.

Below are the various types of controls defined in the Layers_Customizer_Control class which you can use. Each relates to a base element outlined in the input() function. See the location link above for examples of how these are used and what their dependents are.

  • layers-button
  • layers-checkbox
  • layers-button
  • layers-checkbox
  • layers-code
  • layers-color
  • layers-css
  • layers-font
  • layers-heading
  • layers-number
  • layers-range
  • layers-rte
  • layers-select-icons
  • layers-select-images
  • layers-select
  • layers-seperator
  • layers-text
  • layers-textarea

label

The title. This should use l10n method __()

placeholder

Used in combination with a type of layers-text , layers-textarea , laayers-rte  or layers-code  element, and sets some default text inside the field to use an example or instructions.

description

Long-form text describing what your control is used for (optional). Descriptions should be formatted with sprintf and use l10n method __()

class

Used to apply a special CSS class to the control

choices

Used in combination with a select type to define the drop-down options. The below example shows how we add a Widget Areas option using the layers-select type and populate the drop-down with 0-4 using choices.

Adding Controls to Existing Sections

This example shows how you would add text fields for adding Social Media Profiles to the existing Header → Header Layout( header-layout ) section in Layers. The primary difference here is the array_merge  , which takes your $social_media_controls array and merges it with the existing $controls. You don’t need to merge in this way when setting up a custom section with new custom controls.

See How to Add Customizer Sections & Controls

To add Customizer Options using the WordPress Core API, go here