javascript - wp_enqueue_script - wp_dequeue_script para el tema secundario para reemplazar script
wp_enqueue_script ejemplo (5)
Tengo un tema secundario y puedo agregar el script que quiero usar para reemplazar algunas funciones del tema y reemplazar algunos de los botones.
Pero no puedo quitar el botón anterior, así que ambos se muestran uno encima del otro. ¿Cómo puedo eliminar el script parent js?
aquí está mi function.php
para el tema infantil
function replace_scroll(){
// Remove the Default JavaScript
wp_dequeue_script( ''dp-js'' );
// Add your own script
$js_url = get_bloginfo(''stylesheet_directory'') . ''/js'';
wp_enqueue_script(''dp'',"$js_url/dp1.scripts.js");
}
add_action( ''wp_enqueue_scripts'', ''replace_scroll'' );
Prueba con el tema padre Twenty Fourteen que tiene esto en su archivo functions.php
:
function twentyfourteen_scripts() {
// other enqueues
wp_enqueue_script( ''twentyfourteen-script'', get_template_directory_uri() . ''/js/functions.js'', array( ''jquery'' ), ''20131209'', true );
}
add_action( ''wp_enqueue_scripts'', ''twentyfourteen_scripts'' );
La acción wp_enqueue_scripts
no tiene una prioridad declarada, por lo que usa el valor predeterminado 10
. Para que el proceso de dequeue tenga que agregar una prioridad más baja en nuestro archivo theme functions.php
:
function remove_twentyfourteen_scripts()
{
wp_dequeue_script( ''twentyfourteen-script'' );
}
add_action( ''wp_enqueue_scripts'', ''remove_twentyfourteen_scripts'', 11 ); // <-- HERE
Necesita averiguar dónde está generando los botones el tema principal.
Si están siendo generados por javascript, puede quitar la cola del script que está creando los botones. Solo tenga cuidado, ya que cualquier otro javascript en ese archivo será eliminado también. Si esto es un problema, la mejor manera de hacerlo es copiar el script js a su carpeta de temas, eliminar la parte que no desea, dequear el original y poner en cola el script alterado.
Como hacer esto.
Para quitar la cola de un script, necesita saber su manejo. Aquí hay un fantástico tutorial sobre cómo obtener los identificadores de scripts, muy útil. Para resumir en caso de que el enlace se muera:
Agregado a su archivo functions.php
function wpcustom_inspect_scripts_and_styles() {
global $wp_scripts;
global $wp_styles;
// Runs through the queue scripts
foreach( $wp_scripts->queue as $handle ) :
$scripts_list .= $handle . '' | '';
endforeach;
// Runs through the queue styles
foreach( $wp_styles->queue as $handle ) :
$styles_list .= $handle . '' | '';
endforeach;
printf(''Scripts: %1$s Styles: %2$s'',
$scripts_list,
$styles_list);
}
add_action( ''wp_print_scripts'', ''wpcustom_inspect_scripts_and_styles'' );
Esto imprimirá una lista de todos los js y css cargados en su página en la parte superior. Si tiene problemas para averiguar qué es qué, siempre puede usar un inspector dom, como Chrome o Firefox. En cromo, haga clic con el botón derecho - inspeccione el elemento - Recursos - Marcos - Su sitio URL - scripts.
Esto le dará una lista de todos los scripts y sus ubicaciones.
Una vez que haya descubierto qué secuencia de comandos necesita, cópiela en su tema y elimine la parte que está agregando los botones.
A continuación, dequeue la secuencia de comandos no deseados utilizando el controlador que encontramos anteriormente, y enueue la nueva.
function wpcustom_deregister_scripts_and_styles(){
wp_deregister_script(''my-script-handle'');
wp_enqueue_script( ''my-new-script'', get_template_directory_uri() . ''/js/my-new-script.js'', array(), ''1.0'', true );
}
add_action( ''wp_print_styles'', ''wpcustom_deregister_scripts_and_styles'', 100 );
Si los botones están siendo generados por php, deberá encontrar el archivo que está generando el html en su tema principal, copiarlo en su tema secundario y eliminar las líneas ofensivas.
En un flujo de wordpress típico, los complementos se cargan antes del tema y, en el caso del tema secundario, el tema secundario se carga antes del tema principal, específicamente, el archivo functions.php
de un tema secundario se incluye antes de las funciones.php de un elemento primario. Por lo tanto, wp_enqueue_scripts
acciones wp_enqueue_scripts
se apilan y luego se wp_enqueue_scripts
en ese orden, a menos que la prioridad de las acciones se defina de manera diferente a ese valor predeterminado (10). El problema aquí es que estás tratando de quitar la secuencia de comandos que aún no se ha puesto en cola.
Para eliminar la secuencia de comandos agregada por el elemento principal, aumente la prioridad de la acción wp_enqueue_scripts
del tema secundario al valor superior al valor definido en la acción del tema principal.
// get_template_directory_uri(), if used in child theme, the parent theme directory URI will be returned,
// use get_stylesheet_directory_uri() to get the child''s theme directory uri
add_action( ''wp_enqueue_scripts'', ''child_theme_enqueue_scripts'', 11 );
function child_theme_enqueue_scripts()
{
wp_dequeue_script( ''parent-theme-script'' );
wp_enqueue_script( ''child-theme-script'', get_stylesheet_directory_uri() . ''/js/script.js'' );
}
Para reemplazar la secuencia de comandos, por ejemplo, si desea realizar algunos cambios y dejar las dependencias y la localización existentes, existen dos formas.
Use wp_enqueue_script
con el mismo nombre de handle
, debido a que si intenta registrar o poner en cola un manejador ya registrado, los nuevos parámetros serán ignorados, lo cual es útil si el padre localiza posteriormente el script para conservar los datos localizados.
// default priority 10
add_action( ''wp_enqueue_scripts'', ''child_theme_enqueue_scripts'' );
function child_theme_enqueue_scripts()
{
wp_enqueue_script( ''parent-theme-script'', get_stylesheet_directory_uri() . ''/js/script.js'' );
}
Use el objeto global $wp_scripts
para modificar solo las propiedades requeridas, por ejemplo, cambie solo la propiedad src
del script ya en cola o registrado.
// priority 11
add_action( ''wp_enqueue_scripts'', ''child_theme_enqueue_scripts'', 11 );
function child_theme_enqueue_scripts()
{
global $wp_scripts;
$wp_scripts->registered[ ''parent-theme-script'' ]->src = get_stylesheet_directory_uri() . ''/js/script.js'';
}
El hecho de que el tema secundario se cargue primero es bastante práctico ya que el uso del tema secundario no es para reemplazar, sino más bien como una adición al tema principal.
Algunos problemas aquí para comenzar
Debería utilizar
get_stylesheet_directory_uri()
para temas secundarios yget_template_directory_uri()
para temas principales en lugar de las funcionesget_bloginfo()
. Último es más lento y utiliza las dos primeras funcionesLos scripts y los estilos deben anularse el registro AND y eliminarse de la cola para eliminarlos por completo de la cola
La prioridad es importante. Necesita conectar su función más tarde para asegurarse de que los estilos y scripts estén registrados antes de eliminarlos, de lo contrario no funcionará.
Solución:
Copie el archivo js principal al tema secundario y ábralo y haga los cambios necesarios. Guarda el archivo
Ahora necesita quitar la cola Y anular el registro del archivo padre js y luego ponerle el nuevo archivo hijo js del tema
Ejemplo
/*
* Use any number above 10 for priority as the default is 10
* any number after 10 will load after
*/
add_action( ''wp_enqueue_scripts'', ''my_custom_scripts'', 100 );
function my_custom_scripts()
{
wp_dequeue_script( ''parent-script-handle'' );
wp_deregister_script( ''parent-script-handle'' );
// Now the parent script is completely removed
/*
* Now enqueue you child js file, no need to register if you are not
* doing conditional loading
*/
wp_enqueue_script( ''child-script-handle'', get_stylesheet_directory_uri() . ''/child-script.js'' );
//Now we have done it correctly
}
Quiero agregar que necesitamos usar get_stylesheet_directory_uri()
al agregar el script de reemplazo porque get_template_directory_uri()
devuelve el directorio del tema principal.
Vea los documentos de WordPress aquí