Comment ajouter la balise defer = «defer» dans les javascripts du plugin?

29

Je ne pouvais pas ajouter de balise defer dans les javascripts du plugin. Le test de vitesse des développeurs Google me suggère d'ajouter une balise defer dans le formulaire de contact 7 javascripts.

C'est ainsi que le formulaire de contact 7 inclut javascript dans l'en-tête.

add_action( 'wp_enqueue_scripts', 'wpcf7_enqueue_scripts' );

function wpcf7_enqueue_scripts() {
    // jquery.form.js originally bundled with WordPress is out of date and deprecated
    // so we need to deregister it and re-register the latest one
    wp_deregister_script( 'jquery-form' );
    wp_register_script( 'jquery-form', wpcf7_plugin_url( 'jquery.form.js' ),
        array( 'jquery' ), '2.52', true );

    $in_footer = true;
    if ( 'header' === WPCF7_LOAD_JS )
        $in_footer = false;

    wp_enqueue_script( 'contact-form-7', wpcf7_plugin_url( 'scripts.js' ),
        array( 'jquery', 'jquery-form' ), WPCF7_VERSION, $in_footer );

    do_action( 'wpcf7_enqueue_scripts' );
}

Maintenant, comment ajouter la balise defer = "defer" dans le code ci-dessus?

Giri
la source
2
Billet
scribu
1
Belle question @Viruthagiri.
Ramkumar M

Réponses:

57

A partir de WordPress 4.1 il y a un filtre: script_loader_tag. Vous pouvez l'utiliser pour trouver le bon script:

add_filter( 'script_loader_tag', function ( $tag, $handle ) {

    if ( 'contact-form-7' !== $handle )
        return $tag;

    return str_replace( ' src', ' defer="defer" src', $tag );
}, 10, 2 );

Ancienne réponse

Il n'y a pas de filtre dédié disponible ... au moins je ne peux pas en voir un. Mais …

  • wp_print_scripts() appels WP_Scripts->do_items()
  • qui appelle WP_Scripts->do_item()
  • qui utilise esc_url()
  • qui ne fait offrir un filtre: 'clean_url'.

Et c'est reparti:

function add_defer_to_cf7( $url )
{
    if ( FALSE === strpos( $url, 'contact-form-7' )
      or FALSE === strpos( $url, '.js' )
    )
    { // not our file
        return $url;
    }
    // Must be a ', not "!
    return "$url' defer='defer";
}
add_filter( 'clean_url', 'add_defer_to_cf7', 11, 1 );

Attention: non testé, juste une idée. :)

Mise à jour

J'ai écrit et testé un plugin avec ce code. Voir https://gist.github.com/1584783

fuxia
la source
C'est parfait aussi à utiliser avec data-main dans requirejs
Nicola Peluchetti
C'est un joli hack, et si simple. Je pense que ce serait bien aussi d'ajouter charset = 'utf-8' si nécessaire!
Webaware
Génial, mais pourquoi: Doit être un ', pas "!?
henrywright
@henrywright WordPress ajouter des 'deux côtés de la chaîne retournée, un "résultat en HTML non valide.
fuxia
2
Probablement une bonne idée au cas où quelqu'un voudrait que cela fonctionne avec d'autres scripts serait de s'assurer de valider pour l'utiliser uniquement à la fin de la police, peut-être que l'utilisation de if( ! is_admin() ){}plugins populaires comme ACF pourrait vous donner des maux de tête.
crissoca