Cómo poner en cola JavaScripts en un complemento


14

Esta vez estoy luchando mucho para incluir archivos JavaScript en la carpeta de complementos.

Estoy tratando de crear un complemento transfiriendo archivos de widgets desde el directorio de temas. Copié el archivo de widget, pero ese archivo de widget dependía de un archivo JavaScript, así que creé una carpeta / js / en el directorio de complementos. donde se alojan estos archivos "jquery.repeatable.js"

Usé este código, pero no parece incluir el archivo js.

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js' );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

Busqué esto en el foro: /programming/31489615/call-a-js-file-from-a-plugin-directory

Pero aún así esto no fue útil.

Estoy resumiendo mi pregunta. En mi directorio de complementos hay un archivo js debajo de esta carpeta - / js /

Deseo incluir cuál es el proceso correcto, ¿necesito registrar algo también?

¿Hay algo mal con esta porción 'admin_enqueue_scripts'?


Respuestas:


30

Su código parece correcto, pero cargará el script solo en el área de administración porque está poniendo el script en admin_enqueue_scriptsacción .

Para cargar el script en la interfaz, use wp_enqueue_scriptsaction (que no es lo mismo que la wp_enqueue_script()función ):

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js' );
}
add_action('wp_enqueue_scripts', 'Zumper_widget_enqueue_script');

Además, ese script parece depender de jQuery, por lo que debe declarar que la dependencia o el script se pueden cargar antes de jQuery y no funcionará. Además, recomiendo declarar la versión del scripot. De esta forma, si actualiza el script a una nueva versión, el navegador lo descargará nuevamente y descartará la copia que pueda tener en la memoria caché.

Por ejemplo, si la versión del script es 1.0:

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0' );
}
add_action('wp_enqueue_scripts', 'Zumper_widget_enqueue_script');

Si quieres cargarlo en el área de administración:

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0' );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

1

ACTUALIZADO:

Use este código en su lugar

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0.0', false );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

El tercer parámetro es declarar la dependencia y el cuarto es definir la versión.

Establezca el 5º parámetro de wp_enqueue_script()to true. Eso significa que este archivo se cargará en el pie de página.


El tercer parámetro de wp_enqueue_script()es declarar las dependencias del script. El quinto parámetro es el que debe elegir si desea cargar el script en el pie de página o en el encabezado. De todos modos, no creo que el lugar para cargar haga ninguna diferencia.
cybmeta

Gracias. Leí en algún otro complemento que alguien está haciendo así: wp_enqueue_script ('zumper', get_template_directory_uri (). '/Js/jquery.zumper.min.js',array('jquery'),false,true); Dijiste que establecer 3rd en verdadero significa que se cargará en el pie de página, entonces, ¿qué significa esta combinación verdadera y falsa?
El WP Intermedio

He actualizado mi respuesta. ¿Funciona?
mukto90

1

Normalmente uso el método plugins_url () para lograr poner en cola.

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugins_url('js/jquery.repeatable.js', __FILE__ ), '1.0.0', false );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.