Wie man UI-Buttons im Customizer wie twentyseventeen hinzufügt

Es ist also schon ein paar Tage her, seit ich darüber nachgedacht habe und immer noch keine Ahnung davon habe, wie ich es in meinem eigenen Thema machen kann. Ich habe mir das auch angesehen, aber nichts. Ich sah mir den Customizer von 17 an und stellte fest, dass der Code dafür verantwortlich war

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

Ich habe das gleiche mit meinem Customizer in meinem benutzerdefinierten Thema, aber es hat überhaupt nicht funktioniert.

MEIN 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 für den render_callback

 function check_copy_right_text(){ echo get_theme_mod('copyright_text'); } 

Solutions Collecting From Web of "Wie man UI-Buttons im Customizer wie twentyseventeen hinzufügt"

Dein Code ist gut, ich denke du verpasst den Front-End Teil, hier ist der komplette Code für 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'); } 

und footer.php das in das front-end da ein copyright-Text footer.php annehmen footer.php :

 < ?php check_copy_right_text(); ?> 

Wenn Sie zum Customizer gehen, sollten Sie den Edit Shortcut Button wie Edit Shortcut Button :

Bildbeschreibung hier eingeben

Wenn nicht, müssen Sie ein bisschen CSS hinzufügen, um die Schaltfläche besser zu positionieren. Sie können das CSS zu style.css oder eine CSS-Datei nur zum Korrigieren der Schaltflächen erstellen, wenn Sie mehr Schaltflächen benötigen, die CSS benötigen. add_action( 'customize_preview_init', 'my_function_with_wp_enqueue_with_my_css_only_for_the_customizer' ); daran, add_action( 'customize_preview_init', 'my_function_with_wp_enqueue_with_my_css_only_for_the_customizer' );

Ich habe einen zusätzlichen Wert in Ihrer Einstellung hinzugefügt:

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

Wenn Sie den transport auf postMessage einstellen, wird die gesamte Vorschau neu geladen, da sie standardmäßig aktualisiert wird. Auf diese Weise wird nur das Placement (das heißt der Teil einer selektiven Aktualisierung) aktualisiert.

Ich empfehle Ihnen, dies und das zu lesen.

Zögern Sie nicht zu fragen, diese function ist irgendwie neu und ich Selective Refresh Partials zu allen meinen Selective Refresh Partials hinzu.

Übrigens müssen Sie für Optionen, die eine Google Map (oder ähnlich) rendern, JavaScript hinzufügen.