A煤n no tienes acceso a esta clase

Crea una cuenta y contin煤a viendo este curso

Hooks

5/13
Recursos

Aportes 13

Preguntas 11

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesi贸n.

Hooks:

C贸digo propio.

  • Action: Interrumpe la ejecuci贸n y agrega c贸digo.
    add_action(hook, function);
  • Filter: Interrumpe la ejecuci贸n y modifica el contenido.

Estilos

Registrar estilos.
wp_register_style(name, ruta, lista-dependencias, version, media-querie)
A帽adir estilo a wordpress.
wp_enqueue_style()
Recibe los mismos par谩metros, pero debemos a帽adir los estilos registrados anteriormente, pero ahora como dependencias en el array().

Scripts

wp_enqueue_script(name, ruta);

Los estilos y los scripts se agragan en un ciclo que debemos inicializar.
wp_head() -> styles
wp_footer() -> scripts

驴Cu谩ntos hooks hay en WordPress? Miles聽de ellos. S贸lo en WordPress ya tenemos m谩s de聽2.000 entre actions y filters. Pero esos son s贸lo los del core de WordPress. En realidad hay聽muchos m谩s, porque todos los themes y plugins que instalamos tambi茅n tienen sus propios hooks. O sea que es una locura. Sin entrar en detalle, podemos decir que聽los hooks son lo que nos permite modificar WordPress, un theme o un plugin "sin tocarlo". 驴Y porque es tan importante? Porque as铆 podemos actualizar WordPress, plugins y themes sin perder esas modificaciones. 驴 c贸mo localizar los hooks? Lo ideal ser铆a entrar en las entra帽as de WordPress y buscar ah铆. Cuando quieres modificar algo, vas a ese archivo, buscas entre la l铆neas de c贸digo, y cuando ves una acci贸n llamada聽do_action聽o聽apply_filters, ya lo tienes. Es es el punto en el que tienes la opci贸n de a帽adir, quitar o modificar c贸digo. Por otra parte, tambi茅n tenemos buscadores de hooks, siendo uno de los m谩s recomendables聽hookr.io, en el que tenemos una impresionante聽biblioteca de hooks de incalculable valor. Esa web vale todo su peso en oro, y adem谩s, es gratis.

5. Hooks

Vamos a conocer los Hooks de WordPress.

Tenemos principalmente dos Hooks:

  1. Action: Interrumpe la ejecuci贸n para ejecutar la acci贸n y luego continua.
  2. Filter: Adem谩s de poner ese c贸digo donde corresponde, nos permite modificar.

Aprendimos que la funci贸n para registrar estilos en WordPress es:

//El primer argumento es el indetificador de tu estilo
//El segundo argumento la ruta
// Tercer argumento un array
// Cuarto argumento puede ser un bool falso o puedes detallar en un string la versi贸n
// Quinto argumento tipo de media, se pone 'all'
wp_register_style("google-font1",
"https://fonts.googleapis.com/css2?family=Quicksand:[email protected];400;500;600;700&display=swap",
array(),
false,
'all');

Comparto el c贸digo que se hizo en clase:

functions.php

<?php

function arudope_assets(){
    wp_register_style("google-font1","https://fonts.googleapis.com/css2?family=Quicksand:[email protected];400;500;600;700&display=swap",array(),false,'all');
    wp_register_style("google-font2","https://fonts.googleapis.com/css2?family=Roboto:[email protected];400;500;700&display=swap",array(),false,'all');
    wp_register_style("bootstrap","https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css",array(),"5.1.3",'all');
    wp_register_style("bootstrap-icons","https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css",array(),"1.7.2",'all');

    wp_enqueue_style("estilos",get_template_directory_uri() . "/assets/css/style.css", array("google-font1", "google-font2", "bootstrap", "bootstrap-icons"));

    wp_enqueue_script("yardsales-js", get_template_directory_uri() . "/assets/js/script.js");
}

add_action("wp_enqueue_scripts", "arudope_assets");

Hooks

  • HOOKS聽son simplemente una posici贸n y no hacen nada por s铆 mismos. Son un lugar que permite a los desarrolladores 鈥渃onectar鈥 su c贸digo personalizado a WordPress en ubicaciones espec铆ficas y cambiar la forma en que WordPress funciona sin editar los archivos principales.

  • FILTER聽(Interrumpe la ejecuci贸n y modifica el contenido)

    son c贸digos que le permiten modificar los datos existentes antes de enviarlos de vuelta a WordPress para que se procesen antes de que muestre los datos modificados.

    Un filtro te permite hacer cosas como cambiar la longitud de un extracto, colocar publicaciones relacionadas debajo de tu contenido principal o cambiar un precio en WooCommerce.

  • ACTION 聽(Interrumpe la ejecuci贸n y agrega c贸digo)

    Tambi茅n son piezas de c贸digo que pueden crear funcionalidad adicional en un punto espec铆fico durante el procesamiento de una p谩gina. Por ejemplo, es posible que desee agregar otro widget o colocar un mensaje promocional en su p谩gina.

    **add_action(hook, function);**
    

Estilos y Scripts

Estilos y scripts tales como Google fonts o Bootstrap y archivos .js se registran en un archivo llamado functions.php

<?php

function plz_assets(){
	
	//Registrar estilo: wp_register_style(name, ruta, lista-dependencias, version, media-querie)
  wp_register_style("google-font","https://fonts.googleapis.com/css2?family=Quicksand:[email protected];400;500;600;700",array(),false,'all');
  wp_register_style("google-font-2","https://fonts.googleapis.com/css2?family=Roboto:[email protected]&display=swap",array(),false,'all');
	wp_register_style("bootstrap","https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css",array(),"5-1",'all');

	// A帽adir estilos: wp_enqueue_style(name, ruta, array("name1","name2","etc")
  wp_enqueue_style("estilos", get_template_directory_uri()."/assets/css/style.css", array("google-font","bootstrap"));

	// A帽adir scripts
  wp_enqueue_script("yardsale-js",get_template_directory_uri()."/assets/js/script.js");
}

// A帽adir funci贸n al entorno de ejecuci贸n de scripts
add_action("wp_enqueue_scripts","plz_assets");

Por 煤ltimo, es importante ejecutar el hook en el lugar correspondiente al ciclo de ejecuci贸n:

<?php wp_head(); //justo antes de terminar la etiqueta head ?>
<?php wp_footer(); //justo antes de terminar la etiqueta body?>

驴Qu茅 son los Hooks?
Son puntos concretos y estrat茅gicos dentro del core de WordPress que permiten a帽adir funcionalidades o modificar un comportamiento. Cuando la secuencia de carga llegue a ese punto concreto, se ejecuta la funci贸n que has 鈥渆nganchado鈥.

En WordPress existen dos tipos de hooks: acciones (actions hooks) y filtros (filters hooks)

Action Hooks
Las acciones o action hooks ejecutan una funci贸n propia en un lugar preciso en un momento determinado de la l铆nea de ejecuci贸n de WordPress. Cuando llega a un punto concreto, realiza la acci贸n que quieras adem谩s de las que ya se van a ejecutar por defecto. En resumen, los action hooks a帽aden c贸digo adicional a tu WordPress.

Filter hooks o filtros
Los filtros o filter hooks de WordPress manipulan la informaci贸n en un punto concreto de la ejecuci贸n antes de que se muestre en la pantalla o se almacene en la base de datos.

Ac谩 si me perd铆 un poco鈥 No me esperaba esto 馃槄
驴Es necesario ser experto en PHP para continuar? 驴o que nivel se requiere? S铆 bien entend铆 cuando habl贸 acerca de las funciones, pues estoy aprendiendo Ruby y algo de Python, igual considero me despiste鈥
Mi duda: 驴es necesario aprender PHP para realizar mis themes y adaptaciones personales en WordPress?
Yo me lo imaginaba m谩s como de tomar un theme y modificar su CSS y HTML para darle mi propio toque personal, pero veo que nada que ver aqu铆. 馃槕

** OJO CON ESTOS ERRORES DE TYPING**

Pase horas revisando mi c贸digo porque no generaba los estilos usando las funciones en php.

PRIMER POSIBLE ERROR
Escribir mal las carpetas: En mi caso fue en la carpeta 鈥渇unctions鈥 al no escribir la 鈥渟鈥 al final.

** SEGUNDO POSIBLE ERRO**
no colocar 鈥/鈥 al inicio del enlace a carpetas style o script.

"/assets/js/script.js"

importante no solo estar atentos a la S de functions.php si no a la forma de escribirlo, esto puede generar tambien problemas, lo se ya me paso, pero de los errores se aprende

tenia esta duda y encontre este post Registrar estilos es, de alg煤n modo, algo 鈥渙pcional鈥 en WordPress. Si crees que tu estilo no va a ser utilizado por ning煤n plugin o no vas a usar ning煤n c贸digo para cargarlo de nuevo, eres libre de ponerlo en cola sin registrarlo.

Llevo 2 a帽os sin usar php y ahora se me hace feo su uso. muy complicado

El enqueue corregido para que agregue las dos fuentes.

``
    wp_enqueue_style("estilos", get_template_directory_uri()."/assets/css/style.css", array("google-font", "google-font-2","bootstrap"
```));
```

Argumentos:

handle: es el nombre personalizado que le asignamos o un identificador 煤nico al script

src: direccion 贸 fuente del archivo

deps: se asignan las dependencias en caso que no exista se pasa un array vac铆o as铆;----- array() -----

ver: se asigna version del archivo

Argumentos:

wp_register_style( $handle:string, $src:string|boolean, $deps:array, $ver:string|boolean|null, $media:string )

wp_enqueue_script( $handle:string, $src:string, $deps:array, $ver:string|boolean|null, $in_footer:boolean )

diferencias entre el action y el filter es que uno interrumpe y agrega codigo y el otro interrumpe y tambien modifica los datos que va a imprimir en ese momento