Cómo agregar un fragmento de JavaScript al pie de página que requiere jQuery

27

Sé que puedo agregar un archivo de script al pie de página de WordPress que requiere jquery usando este código:

<?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');
?>

Pero, ¿qué pasa si quiero agregar solo un fragmento normal de jquery en línea, no un archivo? ¿Cómo se puede hacer esto?

Editar

Sé que puedo usar este script para agregar algo al pie de página:

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

Pero, ¿cómo especifico el script que se utiliza? Requiere jquery para ejecutarse.

Saif Bechan
fuente
No hay una función integrada para hacer esto, lo sé, es por qué wp_register_scripty wp_enqueue_scriptexiste, pero puede verificarlo usando jquery.
Wyck el
2
Perdón por el voto negativo, pero no creo que entiendas mi pregunta. He leído el códice y conozco la opción. Pero no quiero wp_enqueue_scriptun archivo de script en el pie de página, quiero agregar un fragmento en el pie de página que requiere jquery. Voté la respuesta directamente tomada del códice. Leí el códice y no encontré una respuesta, por eso hago una pregunta. Si me redirige al códice de nuevo, lo rechazo.
Saif Bechan
Gracias wyck, creo que este es el caso, gracias por entender la pregunta correctamente. Creo que usaré un script JS externo en lugar de estar seguro de que el script se puede ejecutar.
Saif Bechan

Respuestas:

30

La forma más fácil de hacer esto es en realidad una combinación de wp_enqueue_scriptlas acciones de pie de página que Saif y v0idless ya mencionaron. Frecuentemente uso jQuery en mis temas y complementos, pero también pongo todos los otros scripts en el pie de página.

La mejor manera de poner las cosas en cola sería esta:

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' );

Pero este código recortado supone que usted es el que pone en cola el script, es decir, lo está haciendo en su propio complemento o tema.

Por el momento, no hay forma de agregar un script en línea al pie de página de WordPress y tampoco cargarlo con dependencias. Pero hay una alternativa, si estás dispuesto.

La alternativa

Cuando WordPress trabaja con scripts, los carga internamente en un objeto para realizar un seguimiento de ellos. Básicamente, hay 3 listas dentro del objeto:

  • registrado
  • cola
  • hecho
  • que hacer

Cuando registra un script por primera wp_register_scripts()vez, se coloca en la lista registrada. Cuando wp_enqueue_script()el script, se copia a la lista de colas. Después de imprimirlo en la página, se agrega a la lista de finalizados.

Entonces, en lugar de poner en cola su script de pie de página para requerir jQuery, puede documentar que necesita usar jQuery y simplemente verificar programáticamente para asegurarse de que jQuery esté cargado.

Esto se usa wp_script_is()para verificar dónde se encuentra el script.

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

Es posible que pueda usar este mismo código para forzar a jQuery a cargar también en el pie de página, pero no lo he probado ... por lo que su kilometraje puede variar.

EAMann
fuente
¿Su fragmento de código proporcionado es aceptado por los estándares de desarrollo de plugins de WordPress? Si es así, entonces me va a utilizar en mi plug-in ... por favor, dame una respuesta a esto ...
Laraib
¿El último fragmento? No. Los complementos de WordPress siempre deben poner en cola los requisitos del script. Obligar a jQuery a cargar fuera del sistema de colas de esta manera es solo algo que debe hacer en su propio sitio donde controla el 100% del entorno. Es no apropiado para un plugin para hacer eso.
EAMann
entonces, ¿puedes darme un ejemplo de trabajo para eso, por favor ...?
laraib
Debido a que estoy desarrollando mi primer complemento de WordPress y me encantaría que el equipo de WordPress lo acepte ... esperando cualquier respuesta por favor ... diga su opinión sobre esto para que pueda crear y hacer que mi complemento sea aceptado ...
laraib
12

Desde wordpress 4.5 puede agregar script en línea por wp_add_inline_script(). Para agregar un fragmento de JavaScript al pie de página que requiere jQuery, este código lo ayuda

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 con wordpress jquery

Dhinju Divakaran
fuente
1

Usa la wp_footeracción de esta manera:

add_action( 'wp_footer', 'wpse33008');
function wpse33008() {
?>
<script type="text/javascript">
    /** INSERT SCRIPT HERE **/
</script>
<?php
}
v0idless
fuente
1
Esta no es una buena respuesta. Le pregunté cómo podía especificar el script que requería jQuery. Si el usuario no tiene jquery ejecutándose, su implementación no se ejecutará.
Saif Bechan
0

Sé que OP quiere especificar un requisito en jQuery, y los autores de WordPress deberían haber permitido que los fragmentos se pusieran en cola junto a los archivos de script, pero no lo hicieron, por lo que recomiendo no intentar forzarlo. Si no quiere meterse con la cola o su orden, como yo (porque estoy usando otros complementos que combinan y optimizan los scripts), entonces la respuesta realmente es usar la wp_footeracción de esta manera:

<?php

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

Puedes usar la wp_footeracción para hacer esto. Verifique el códice para wp_footer .

Rutwick Gangurde
fuente
Lo sé, pero ¿cómo puede especificar que el script que agrega al pie de página depende de jquery? Mira mi edición para ser más picante.
Saif Bechan
¿Incluso te molestas en leer el códice antes de rechazar las respuestas de las personas? ¿Alguna vez has leído sobre el in_footerargumento wp_enqueue_script? Lea esto: codex.wordpress.org/Function_Reference/wp_enqueue_script . Te dice cómo usarlo con la wp_footeracción.
Rutwick Gangurde