Hi,

i follow this tutorial for awesome Justin Tadlock so many thanks to him : http://justintadlock.com/archives/2015/05/26/multiple-checkbox-customizer-control

Intro:
i work on new wordpress theme and i moved from redux framework to kirki. the problem is redux has a lot of useful fields i miss it in kirki like background, link color (color, :hover, :active), border and spacing field that support postMesage.

Technically to build all of this fields you need to build control with multiple inputs and save all of this inputs in a associative array so from this concept i start build the background control.

My prefix: mom_

Files:
background-control.php - gist
background-control.js - gist
background-control-preview.js - gist

Add field:

my_custom_options::add_field( 'mom_option', array(
  'type'        => 'mom_background',
  'sanitize_callback' => 'mom_background_field_sanitize',
  'settings'    => 'header_background',
  'label'       => __('Header background', MOM_TEXTDOMAIN),
  'section'     => 'main_header',
  'transport'   => 'postMessage',
));

Get field value:

print_r(get_theme_mod('header_backgroun'))
array('color' => '#fff', 'image' => 'http://image_url.png', 'repeat' => 'no-repeat'...)

Results:

How it works:

i create inputs with simple HTML code. collect the information of each input with name attribute to build a valid json string to save it in value-holder input (hidden input).

then sanitize the json string with this function to build the associative array to save in wordpress database as theme mod.

What i miss:

• don't test this field with defaults and reset button
• I am sure there is a better way to doing this
• not tested with repeater

Conclusion:

This is my first pull request and i don't know what i do so i explain everything in this comment, i hope that be helped