wp met en file d'attente le script en ligne en raison de dépendances

35

Existe-t-il un moyen d'utiliser wp_enqueue_script () pour les scripts en ligne?

Je le fais parce que mon script en ligne dépend d'un autre script et j'aimerais pouvoir l'insérer après l'avoir chargé.

C'est aussi un script en ligne parce que je passe des variables php dans le javascript (comme le chemin du thème, etc.)

Merci d'avance.

    
posée chrisjlee 03.08.2011 - 23:11

6 réponses

33

Eh bien, vous avez wp_localize_script (), mais ce n'est que pour transmettre des données.

Sinon, vous pouvez le faire:

function print_my_inline_script() {
  if ( wp_script_is( 'some-script-handle', 'done' ) ) {
?>
<script type="text/javascript">
// js code goes here
</script>
<?php
  }
}
add_action( 'wp_footer', 'print_my_inline_script' );

L'idée est que vous ne devriez pas vous fier à l'impression de votre script en ligne exactement après le script dont il dépend, mais ultérieurement.

    
réponse donnée scribu 04.08.2011 - 00:18
7

Ne faites pas simplement un script en ligne, puis transmettez-lui les paramètres dynamiques sous forme de variables. Otto a rédigé un excellent guide sur la manière de procéder efficacement.

WordPress 3.3 rendra également cela plus puissant: enlace

    
réponse donnée Viper007Bond 04.08.2011 - 01:02
7

Cette solution est similaire à la réponse de @ scribu, mais elle suit le formulaire wp_enquque_script() . placez le script dans l'en-tête si ses dépendances sont incluses dans l'en-tête.

/**
 * Enqueue inline Javascript. @see wp_enqueue_script().
 * 
 * KNOWN BUG: Inline scripts cannot be enqueued before 
 *  any inline scripts it depends on, (unless they are
 *  placed in header, and the dependant in footer).
 * 
 * @param string      $handle    Identifying name for script
 * @param string      $src       The JavaScript code
 * @param array       $deps      (optional) Array of script names on which this script depends
 * @param bool        $in_footer (optional) Whether to enqueue the script before </head> or before </body> 
 * 
 * @return null
 */
function enqueue_inline_script( $handle, $js, $deps = array(), $in_footer = false ){
    // Callback for printing inline script.
    $cb = function()use( $handle, $js ){
        // Ensure script is only included once.
        if( wp_script_is( $handle, 'done' ) )
            return;
        // Print script & mark it as included.
        echo "<script type=\"text/javascript\" id=\"js-$handle\">\n$js\n</script>\n";
        global $wp_scripts;
        $wp_scripts->done[] = $handle;
    };
    // ('wp_print_scripts' is called in header and footer, but $cb has re-inclusion protection.)
    $hook = $in_footer ? 'wp_print_footer_scripts' : 'wp_print_scripts';

    // If no dependencies, simply hook into header or footer.
    if( empty($deps)){
        add_action( $hook, $cb );
        return;
    }

    // Delay printing script until all dependencies have been included.
    $cb_maybe = function()use( $deps, $in_footer, $cb, &$cb_maybe ){
        foreach( $deps as &$dep ){
            if( !wp_script_is( $dep, 'done' ) ){
                // Dependencies not included in head, try again in footer.
                if( ! $in_footer ){
                    add_action( 'wp_print_footer_scripts', $cb_maybe, 11 );
                }
                else{
                    // Dependencies were not included in 'wp_head' or 'wp_footer'.
                }
                return;
            }
        }
        call_user_func( $cb );
    };
    add_action( $hook, $cb_maybe, 0 );
}

// Usage
enqueue_inline_script('test','alert(\'enqueue inline script test\');',array( 'jquery'));

Remarque: ceci utilise des fonctions anonymes, mais pour les versions de PHP antérieures à la version 5.3, cela peut facilement être converti en classe.

    
réponse donnée Stephen M. Harris 28.03.2014 - 15:02
4

La meilleure façon que j'ai trouvée consiste à utiliser wp_localize_script() , comme @scribu l'a suggéré.

Habituellement, j’ai décidé d’utiliser Javascript en ligne car je devais fournir des variables PHP à mon script. Cela peut être résolu avec wp_localize_script() . Je vais donner un exemple:

Vous avez un tableau $aFoo avec quelques options et vous devez le transmettre à un script.

$aFoo = array( 'option1' => $option1Value, 'option2' => $option2Value ); 

Utilisation du script en ligne:

<script> 
    var oFoo = {};
    oFoo.option1 = <?php echo $aFoo['option1'] ?>;  
    oFoo.option2 = <?php echo $aFoo['option2'] ?>;            
    //do some stuff with oFoo
</script>

Utilisation de wp_localize_script() :

wp_register_script( 'script_name', 'pathToScript/script.js', array( 'jquery' )); //if jQuery is not needed just remove the last argument. 
wp_localize_script( 'script_name', 'object_name', $aFoo ); //pass 'object_name' to script.js
wp_enqueue_script( 'script_name' );    

Alors, pathToScript/script.js serait:

var oFoo = {};
oFoo.option1 = object_name.option1;   
oFoo.option2 = object_name.option2;            
//do some stuff with oFoo (no PHP needed)

De cette façon, vous n’avez plus besoin de scripts en ligne.

    
réponse donnée Manolo 18.08.2014 - 16:29
4

Depuis WordPress 4.5, vous pouvez utiliser wp_add_inline_script () :

.
add_action( 'wp_enqueue_scripts', 'cyb_enqueue_scripts' );
function cyb_enqueue_scripts() {
   wp_enqueue_script( 'myscript', 'url/to/myscript.js', array(), '1.0' );
   wp_add_inline_script( 'myscript', 'Your inline javascript code gos here' );
}
    
réponse donnée cybmeta 15.05.2016 - 17:18
3

scribu est absolument correct. Quoi qu'il en soit, je veux ajouter quelques informations:

Je souhaite que ma fonction génère un script une fois, quelle que soit la fréquence à laquelle il est appelé. C'est une fonction liée au contenu, donc je ne peux pas attendre pour un hook. J'ai utilisé les infos de scribus et quelques lectures du noyau WP pour en arriver à ceci:

function print_script_once() {
    if(!wp_script_is('my-handle', 'done')) {
        echo "<script>alert('once!');</script>";
        global $wp_scripts;
        $wp_scripts->done[] = 'my-handle';
    }
}
add_action('get_footer', print_script_once);

En utilisant cette méthode, je peux imprimer un script en ligne une fois. Dans mon cas, j'ai une fonction qui crée un bouton de partage et nécessite qu'un script soit exécuté pour tous les boutons. Mais une seule fois.

    
réponse donnée Julian F. Weinert 29.01.2014 - 13:29

Lire d'autres questions sur les étiquettes