I've seen the example for adding a shortcut to the blogname:

$wp_customize->get_setting( 'blogname' )->transport = 'postMessage';
$wp_customize->selective_refresh->add_partial( 'blogname', array(
    'selector' => '.site-title',
    'render_callback' => 'blogname_render_func',
) );

However, how do you do that for a theme mod?

In my theme, I add a theme mod via Kirki like so:

Kirki::add_config('opts', array(
    'capability' => 'edit_theme_options',
    'option_type' => 'theme_mod',

Kirki::add_field('opts', array(
    'settings' => 'button_navigation',
    'type'     => 'toggle',

However, when I try:

$wp_customize->get_setting( 'button_navigation' )->transport = 'postMessage';
$wp_customize->selective_refresh->add_partial( 'button_navigation', array(
    'selector' => '.menu-button',
    'render_callback' => 'my_nav_render',
) );

I get:

Warning: Creating default object from empty value

Which is expected, considering I'm adding a theme mod instead of a setting while using get_setting().

If I try something like:

$wp_customize->get_theme_mod( 'button_navigation' )->transport = 'postMessage';

I get:

Fatal error: Uncaught Error: Call to undefined method WP_Customize_Manager::get_theme_mod()

If I remove the part where I set transport = 'postMessage', the shortcut icon appears at the right place in the Customizer preview and clicking on it takes you to the correct controller. However, when you modify the value, the whole page refreshes, instead of just the partial. I'm sure it's because I don't change the transport type. How do I change it?

  • A “setting” in the Customizer is a construct that models objects in WordPress. By default it actually already models a theme mod. You have to specifically indicate if it is modeling an option instead by supplying the type param. I have not used Kirki, however, so I can't speak to how it wraps the Customizer API. – Weston Ruter Jul 10 '17 at 19:14

You need to use the partial refresh feature of kirki

'transport' => 'postMessage',
    'partial_refresh' => array( 
    'my_nav_render_setting' => array( 
        'selector' => '.menu-button', 
        'render_callback' => 'my_nav_render', 
    ) ),

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.