web-dev-qa-db-fra.com

Comment puis-je ajouter une icône de raccourci d'édition dans wordpress sans utiliser l'actualisation sélective

Je développe un thème et je me demande si, de toute façon, je peux ajouter un raccourci d'édition visuelle sans rafraîchissement sélectif?

$wp_customize->get_setting( 'blogname' )->transport        = 'postMessage';

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

Puis-je faire comme

$wp_customize->get_setting( 'blogname' )->transport        = 'postMessage';
$wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';

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

En fait, cela fonctionne et donne le résultat souhaité .. mais j’utilise Kirki comme cadre et pour une raison quelconque, je ne suis pas en mesure de le faire. Je ne veux tout simplement pas utiliser l'actualisation sélective par défaut. Je veux utiliser ma propre fonction javascript avec postMessage et je ne suis pas en mesure d'implémenter la balise selector ici.

Voici mon code:

Kirki::add_field( 'theme_config', array(
    'type'     => 'text',
    'settings' => 'about_us_video_setting',
    'label'    => __( 'Video Link', 'rst' ),
    'section'  => 'about_us_section',
    'default'  => esc_attr__( 'youtube.com', 'rst' ),
    'transport' => 'postMessage',
    'partial_refresh' => array( 
    'about_us_video_setting' => array( 
        'selector' => '#youtube-video', 
        'render_callback' => 'show_video', 
    ) ),
    'active_callback'    => array(
        array(
            'setting'  => 'is_front_page',
            'operator' => '==',
            'value'    => true,
        ),
    ),

) );

ce que je veux c'est

Kirki::add_field( 'theme_config', array(
    'type'     => 'text',
    'settings' => 'about_us_video_setting',
    'label'    => __( 'Video Link', 'rst' ),
    'section'  => 'about_us_section',
    'default'  => esc_attr__( 'youtube.com', 'rst' ),
    'transport' => 'postMessage',
     'selector' => '#youtube-video',        
    'active_callback'    => array(
        array(
            'setting'  => 'is_front_page',
            'operator' => '==',
            'value'    => true,
        ),
    ),

) );

Est-ce que… même si je donne le transport comme postMessage, ce qui est fait est juste d'actualiser par défaut au lieu d'utiliser mon propre javascript qui est

( function( $ ) {
// Change the previewed URL to the selected page when changing the page_for_posts.
wp.customize( 'about_us_video_setting', function( setting ) {
    setting.bind( function( url ) {
        $('.embed-responsive-item').attr('src',url);
    });
});

} )( jQuery );

Je veux juste clarifier car je n'ai trouvé aucune documentation. Utiliser l'actualisation sélective pour afficher les raccourcis d'édition est-il un critère?

d'éditer raccourcis je veux dire cette icône de crayon  enter image description here  qui vous amène à l'emplacement souhaité pour éditer.

1
Taj Khan

Il existe un moyen simple de le faire en utilisant __return_false . L'inconvénient est que vous obtenez une double actualisation car il vérifie la présence d'un partiel, puis renvoie "false", ce qui entraîne une actualisation complète. Cela pose problème si vous utilisez javascript uniquement pour afficher un aperçu "en temps réel". Dans ce cas, vous devrez utiliser la solution de Weston Ruter.

Si vous n'utilisez pas réellement l'aperçu postMessage et souhaitez simplement afficher le raccourci, ce n'est pas grave, car vous avez de toute façon besoin de l'actualisation complète.

Je ne sais pas pourquoi ils n'ont pas intégré ces raccourcis d'édition partiels à ceux qui n'utilisent que du javascript.

En kirki:

'transport' => 'postMessage',    
'partial_refresh' => array(
            'about_us_video_setting' => array(
                'selector' => '#youtube-video',
                'render_callback' => '__return_false'
            )
        )

La norme:

$wp_customize->get_setting( 'about_us_video_setting' )->transport   = 'postMessage';

$wp_customize->selective_refresh->add_partial( 'about_us_video_setting', array(
            'selector' => '#youtube-video',
            'render_callback' => '__return_false',
        ) );
1
Alison

Ce que vous pouvez faire est d'étendre wp.customize.selectiveRefresh.Partial en JavaScript pour créer un type Partiel personnalisé qui remplace le comportement refresh pour appliquer un aperçu en direct basé sur JS au lieu d'effectuer un appel Ajax pour effectuer une demande d'actualisation partielle.

Vous pouvez vous référer à un exemple dans le plugin Personnaliser le métadron de la barre latérale , en particulier dans le type sidebar_meta_background_color partial.

Donc, si vous enregistrez des partiels avec ce type sidebar_meta_background_color, ils utiliseraient cette sous-classe JS avec la méthode refresh remplacée.

0
Weston Ruter