Comment ajouter un extrait de code javascript au pied de page nécessitant jQuery

23

Je sais que je peux ajouter un fichier de script au pied de page de wordpress nécessitant jquery à l'aide du code suivant:

<?php
function my_scripts_method() {
   // register your script location, dependencies and version
   wp_register_script('custom_script',
       get_template_directory_uri() . '/js/custom_script.js',
       array('jquery'),
       '1.0',
       true);
   // enqueue the script
   wp_enqueue_script('custom_script');
}
add_action('wp_enqueue_scripts', 'my_scripts_method');
?>

Mais que se passe-t-il si je veux ajouter uniquement un extrait de code jquery normal en ligne, pas un fichier. Comment cela peut-il être fait?

Modifier

Je sais que je peux utiliser ce script pour ajouter quelque chose au pied de page:

<?php
function myscript() {
?>
<script type="text/javascript">
 // This depends on jquery
</script>
<?php
}
add_action('wp_footer', 'myscript');

Mais comment spécifier le script utilisé requiert l'exécution de jquery .

    
posée Saif Bechan 06.11.2011 - 11:30
la source

5 réponses

26

La méthode la plus simple consiste à combiner wp_enqueue_script et les actions de pied de page déjà référencées par Saif et v0idless. J'utilise fréquemment jQuery dans mes thèmes et plugins, mais je mets également tous les autres scripts dans le pied de page.

La meilleure façon de mettre les choses en file d'attente serait la suivante:

function myscript() {
?>
<script type="text/javascript">
  if ( undefined !== window.jQuery ) {
    // script dependent on jQuery
  }
</script>
<?php
}
add_action( 'wp_footer', 'myscript' );

function myscript_jquery() {
    wp_enqueue_script( 'jquery' );
}
add_action( 'wp_head' , 'myscript_jquery' );

Mais ce code extrait suppose que c'est vous qui mettez le script en file d'attente, c'est-à-dire que vous le faites dans votre propre plugin ou thème.

Pour le moment, il est impossible d'ajouter un script en ligne au pied de page WordPress et de le charger avec des dépendances. Mais il existe une alternative, si vous le souhaitez.

L'alternative

Lorsque WordPress fonctionne avec des scripts, il les charge en interne dans un objet pour en assurer le suivi. Il y a essentiellement 3 listes à l'intérieur de l'objet:

  • enregistré
  • file d'attente
  • terminé
  • to_do

Lorsque vous enregistrez pour la première fois un script contenant wp_register_scripts() , il est placé dans la liste enregistrée. Lorsque vous wp_enqueue_script() le script, il est copié dans la liste des files d'attente. Une fois imprimé sur la page, il est ajouté à la liste des réalisations.

Ainsi, plutôt que de mettre votre script de pied de page en file d'attente pour exiger jQuery, vous pouvez indiquer qu'il doit utiliser jQuery et juste vérifier par programme que jQuery est chargé.

Ceci utilise wp_script_is() pour vérifier l'emplacement du script dans la liste.

function myscript() {
    if( wp_script_is( 'jquery', 'done' ) ) {
    ?>
    <script type="text/javascript">
      // script dependent on jQuery
    </script>
    <?php
    }
}
add_action( 'wp_footer', 'myscript' );

Vous pourriez pouvoir utiliser ce même code pour forcer le chargement de jQuery dans le pied de page, mais je n'ai pas testé cela ... donc votre kilométrage peut varier.

    
réponse donnée EAMann 06.11.2011 - 18:22
la source
11

Depuis wordpress 4.5, vous pouvez ajouter un script inline de wp_add_inline_script() . Pour ajouter un extrait de code javascript au pied de page qui nécessite jQuery, ce code vous aide

function enqueue_jquery_in_footer( &$scripts ) {

    if ( ! is_admin() )
        $scripts->add_data( 'jquery', 'group', 1 );
}
add_action( 'wp_default_scripts', 'enqueue_jquery_in_footer' );

function theme_prefix_enqueue_script() {
   if(!wp_script_is('jquery', 'done')) {
     wp_enqueue_script('jquery');
   }
   wp_add_inline_script( 'jquery-migrate', 'jQuery(document).ready(function(){});' );
}
add_action( 'wp_enqueue_scripts', 'theme_prefix_enqueue_script' );

wp_add_inline_script avec wordpress jquery

    
réponse donnée Dhinju Divakaran 25.06.2016 - 08:44
la source
1

Utilisez l'action wp_footer comme ceci:

add_action( 'wp_footer', 'wpse33008');
function wpse33008() {
?>
<script type="text/javascript">
    /** INSERT SCRIPT HERE **/
</script>
<?php
}
    
réponse donnée v0idless 06.11.2011 - 15:17
la source
0

Je sais que OP souhaite spécifier une exigence sur jQuery. Les auteurs de WordPress auraient dû autoriser la mise en file d'attente des extraits de code à côté des fichiers de script, mais ils ne l'ont pas été. Je vous déconseille de forcer il. Si vous ne voulez pas vous mêler de la file d'attente ou de son ordre, comme moi (parce que j'utilise d'autres plugins combinant et optimisant les scripts), la réponse consiste à utiliser l'action wp_footer comme suit:

<?php

add_action(
    'wp_footer'
    , function() {
        ?>
        <script>
            if (window.jQuery) {
                // your snippet
            }
        </script>
        <?php
    }
    , 21 # after enqueued footer scripts
);
    
réponse donnée Walf 25.07.2018 - 11:56
la source
-2

Vous pouvez utiliser l'action wp_footer pour ce faire. Consultez le codex pour wp_footer .

    
réponse donnée Rutwick Gangurde 06.11.2011 - 14:30
la source

Lire d'autres questions sur les étiquettes