Comment ajouter un extrait de code JavaScript au pied de page qui nécessite jQuery

27

Je sais que je peux ajouter un fichier de script au pied de page de wordpress qui nécessite jquery en utilisant ce code:

<?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 faire si je veux ajouter juste un extrait normal de jquery inline, 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é nécessite l' exécution de jquery .

Saif Bechan
la source
Il n'y a pas de fonction intégrée pour faire cela que je sais, c'est pourquoi wp_register_scriptet wp_enqueue_scriptexiste, mais vous pouvez vérifier en utilisant jquery lui-même.
Wyck
2
Désolé pour le downvote, mais je ne pense pas que vous compreniez ma question. J'ai lu le codex et je connais l'option. Mais je ne veux pas d' wp_enqueue_scriptun fichier de script dans le pied de page, je veux ajouter un extrait dans le pied de page qui nécessite jquery. J'ai rétrogradé la réponse directement tirée du codex. J'ai lu le codex et je n'ai pas trouvé de réponse, c'est pourquoi je pose une question. Si vous me redirigez à nouveau vers le codex, je downvote.
Saif Bechan
Merci wyck, je pense que c'est le cas, merci d'avoir bien compris la question. Je pense que j'utiliserai simplement un script JS externe plutôt que d'être sûr que le script peut être exécuté.
Saif Bechan

Réponses:

30

La façon la plus simple de le faire est en fait une combinaison des wp_enqueue_scriptactions de pied de page que Saif et v0idless ont déjà référencées. 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 coupé suppose que vous êtes celui qui met le script en file d'attente, c'est-à-dire que vous le faites dans votre propre plugin ou thème.

Pour le moment, il n'y a aucun moyen 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 garder la trace. Il y a essentiellement 3 listes à l'intérieur de l'objet:

  • inscrit
  • queue
  • terminé
  • faire

Lorsque vous enregistrez un script pour la première fois, 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 tâches terminées.

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

Cela permet wp_script_is()de vérifier où le script est répertorié.

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 peut- être utiliser ce même code pour forcer jQuery à se charger également dans le pied de page, mais je n'ai pas testé cela ... donc votre kilométrage peut varier.

EAMann
la source
votre extrait de code fourni est-il accepté par les normes de développement de plugins WordPress? Si oui, alors je vais l'utiliser dans mon plugin ... s'il vous plaît donnez-moi une réponse à ce sujet ...
laraib
Le dernier extrait? Les plugins WordPress doivent toujours mettre en file d'attente les exigences de script. Forcer jQuery à se charger en dehors du système de file d'attente de cette manière n'est que quelque chose que vous devez faire sur votre propre site où vous contrôlez 100% de l'environnement. Il n'est jamais approprié qu'un plugin le fasse.
EAMann
alors pouvez-vous me donner un exemple de travail pour cela s'il vous plaît ... ????
laraib
Parce que je développe mon premier plugin WordPress et j'aimerais que cela soit accepté par l'équipe WordPress ... en attente de votre réponse s'il vous plaît .... donnez votre avis à ce sujet afin que je puisse créer et faire accepter mon plugin ...
laraib
12

Depuis wordpress 4.5, vous pouvez ajouter un script en ligne par wp_add_inline_script(). Pour ajouter un extrait 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

Dhinju Divakaran
la source
1

Utilisez l' wp_footeraction comme ceci:

add_action( 'wp_footer', 'wpse33008');
function wpse33008() {
?>
<script type="text/javascript">
    /** INSERT SCRIPT HERE **/
</script>
<?php
}
v0idless
la source
1
Ce n'est pas une bonne réponse. J'ai demandé comment je pouvais spécifier le script requis jQuery. Si l'utilisateur n'a pas jquery en cours d'exécution, votre implémentation ne s'exécutera pas.
Saif Bechan
0

Je sais que OP veut spécifier une exigence sur jQuery, et 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 fait, donc je recommande de ne pas essayer de le forcer. Si vous ne voulez pas du tout gâcher la file d'attente ou son ordre, comme moi (parce que j'utilise d'autres plugins qui combinent et optimisent des scripts), alors la réponse est vraiment d'utiliser l' wp_footeraction comme ceci:

<?php

add_action(
    'wp_footer'
    , function() {
        ?>
        <script>
            if (window.jQuery) {
                // your snippet
            }
        </script>
        <?php
    }
    , 21 # after enqueued footer scripts
);
Walf
la source
-2

Vous pouvez utiliser l' wp_footeraction pour ce faire. Vérifiez le codex pour wp_footer .

Rutwick Gangurde
la source
Je sais, mais comment pouvez-vous spécifier que le script que vous ajoutez au pied de page dépend de jquery. Vérifiez mon montage pour être plus précis.
Saif Bechan
Avez-vous même pris la peine de lire autour du codex avant de voter contre les réponses des gens? Avez-vous déjà lu cet in_footerargument wp_enqueue_script? Lisez ceci: codex.wordpress.org/Function_Reference/wp_enqueue_script . Il vous indique comment l'utiliser avec l' wp_footeraction.
Rutwick Gangurde