0

So its been days since i've been looking into this and still found zero clue as to how to do it in my own custom theme. I've also had a look at this, but nothing. I had a look at the customizer of twenty-seventeen and found that the code responsible was 

$wp_customize->selective_refresh->add_partial( 'blogname', array( 'selector' => '.site-title a', 'render_callback' => 'twentyseventeen_customize_partial_blogname', ) );

I tired the same with my customizer in my custom theme but it didn't work at all.

MY CODE

$wp_customize->add_section( 'footer_section', array( 'title' => __( 'Footer Section', 'healthtech' ), 'panel' => '', ) ); /* * Settings for copyright text */ $wp_customize->add_section( 'footer_section', array( 'title' => __( 'Footer Section', 'healthtech' ), 'panel' => '', ) ); /* * Settings for copyright text */ $wp_customize->add_setting( 'copyright_text', array( 'default' => '', ) ); $wp_customize->add_control( new WP_Customize_Control( $wp_customize, 'copyright_text', array( 'label' => __( 'Copyright Text', 'healthtech' ), 'section' => 'footer_section', 'settings' => 'copyright_text', ) ) ); $wp_customize->selective_refresh->add_partial( 'copyright_text', array( 'selector' => 'span#copy-write', // You can also select a css class 'render_callback' => 'check_copy_right_text', ) );

Callback function for the render_callback

function check_copy_right_text(){ echo get_theme_mod('copyright_text'); }
Improve this question

1 Answer 1

Reset to default
1

Your code is good i think you are missing the front-end part, here is the complete code for functions.php:

/* Customizer fields */ function your_customizer_settings($wp_customize) { $wp_customize->add_section('footer_section', array( 'title' => __('Footer Section', 'healthtech'), 'panel' => '', )); /* * Settings for copyright text */ $wp_customize->add_section('footer_section', array( 'title' => __('Footer Section', 'healthtech'), 'panel' => '', )); /* * Settings for copyright text */ $wp_customize->add_setting('copyright_text', array( 'default' => '2342', 'transport' => 'postMessage' )); $wp_customize->add_control(new WP_Customize_Control($wp_customize, 'copyright_text', array( 'label' => __('Copyright Text', 'healthtech'), 'section' => 'footer_section', 'settings' => 'copyright_text', ) ) ); $wp_customize->selective_refresh->add_partial('copyright_text', array( 'selector' => 'span#copy-write', // You can also select a css class 'render_callback' => 'check_copy_right_text', )); } // Customizer action add_action('customize_register', 'your_customizer_settings'); function check_copy_right_text(){ echo get_theme_mod('copyright_text'); }

and put this in the front-end since its a copyright text lets assume footer.php:

<span id="copy-write"><?php check_copy_right_text(); ?></span>

if you go to the customizer you should see the Edit Shortcut Button like this:

enter image description here

if not you will have to add a bit of CSS to position better the button, you can add that CSS to style.css or create a CSS file only for correcting the buttons if you have more buttons that need CSS, remember to use add_action( 'customize_preview_init', 'my_function_with_wp_enqueue_with_my_css_only_for_the_customizer' );

i added an extra value in your setting:

$wp_customize->add_setting('copyright_text', array( 'default' => '2342', 'transport' => 'postMessage' //this one ));

if you dont set transport to postMessage the entire preview will reload since it will default to refresh, this way only that placement (that is what is called the part of a selective refresh) will update.

I recommend you to read this and this.

Dont hesitate to ask, this feature is kind of new and i am adding Selective Refresh Partials to all my theme options too.

By the way for options that render a Google Map (or similar) you will need to add JavaSCript.

Improve this answer
5
  • Thank you for the reply. It helped a lot. It wasn't exactly what I was looking for but, it turned out to be even better :) . However my other question is that, is it possible to add the pencil icon that we see with the twentyseventeen theme? If so could you tell me how to? Thank you :) Commented Feb 14, 2017 at 4:53
  • Its not showing the Edit Shortcut Button (the pencil icon) ? it should be there, maybe something is overlapping it, i edited my answer with a screenshot of it, it should be there in the HTML at least, maybe it needs a bit of CSS. Commented Feb 14, 2017 at 5:47
  • Well actually im not seeing the button tag at all prntscr.com/e8hghf Im, using a blank theme from underscore.me Commented Feb 14, 2017 at 5:56
  • Expand that <span> tag above "test" it should be inside that one. Commented Feb 14, 2017 at 6:04
  • You were correct Thank you so much. :) Hope its OK if i add this to my blog :) Commented Feb 14, 2017 at 6:08

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.