Hi @miturn –
The easiest approach would be to re-render the element instead of relying on a live JavaScript update. Changes to HTML markup, fetching of images etc. are best handled in this way.
Regarding your custom control: could you provide a sample of the code that you’ve written or given some idea of how you’ve added it?
Cheers,
Andrew.
Thread Starter
miturn
(@miturn)
Thanks Andrew.
For the custom control, I registered a setting:
$panel_manager->add_setting( 'theme_menu_color', array(
'default' => "#000000",
'sanitize_callback' => 'tailor_sanitize_color',
'refresh' => array( 'theme' => 'js', ),
) );
And then in canvas.js:
SettingAPI.onChange( 'sidebar:theme_menu_color', function( to, from ) {
$('.theme-label').css({'color' : to });
} );
It works once the page is refreshed. Just not the live js update.
Sidebar settings don’t require that you specify a “refresh” method, however that shouldn’t matter. How have you registered the associated control? Is it a custom section as well?
What else are you doing in canvas.js? Are you sure that file has been enqueued properly?
Thread Starter
miturn
(@miturn)
I tried the refresh after I couldn’t get it to work.
$panel_manager->add_control( 'theme_menu_text_color', array(
'label' => __( 'Navigation Font Color', 'theme' ),
'description' => __( '', 'theme' ),
'type' => 'color',
'priority' => 15,
'section' => 'general',
'setting' => 'theme_menu_color',
) );
It seems that the wordpress color picker isn’t triggering a change.
I have quite a bit of other code in canvas.js that is working.
Thread Starter
miturn
(@miturn)
Andrew appreciate the help. If I’m customizing something on the page that is not a tailor element – like nav or header can I refresh the preview frame. Like in the wordpress customizer.
wp.customize.previewer.refresh(); or a selective refresh?