El gran libro de desarrollo de plugins WordPress E-Book

Jhon Jairo Rincón Cardona

• Herausgeber: Marcombo
• Kategorie: Wissenschaft und neue Technologien
• Sprache: Spanisch
• Veröffentlichungsjahr: 2022

Seitenzahl: 283

Beschreibung

Si es de los que siempre ha querido ir un poco más allá al crear una funcionalidad en WordPress para que realice algo específico, pero le ha resultado difícil porque no encuentra casi material que le sirva de guía, entonces ha llegado al libro indicado. En él se desarrolla un itinerario que va desde lo más básico hasta lo más avanzado, para que pueda comprender cómo funciona en realidad WordPress y pueda convertir sus ideas en poderosos plugins. Al finalizar su lectura, sabrá: •Manipular la base de datos de WordPress •Crear una estructura de archivos para sus plugins •Realizar consultas SQL a la base de datos de WordPress •Crear un plugin para la gestión de pop-ups •Utilizar múltiples funciones de WordPress para sus plugins •Manipular datos y roles de usuarios en WordPress •Hacer sus propios ganchos de acción personalizados •Crear sus propios widgets y un plugin para la gestión de usuarios Asimismo, el libro incluye gratis el acceso al curso online sobre desarrollo de plugins con Wordpress. ¡Dominar WordPress está a su alcance! Hágase ya con su ejemplar y póngase al día en todo lo relativo a este potente sistema de gestión de contenidos.

Leseprobe

El gran libro de desarrollo de plugins WordPress

Primera edición: 2022

©2022 Jhon Jairo Rincón

© 2022 MARCOMBO, S. L.

www.marcombo.com

Diseño de la cubierta: ENEDENÚ DISEÑO GRÁFICO

Correctora: Beatriz García Alonso

Revisor técnico: Pablo Martínez Izurzu

Directora de producción: M.a Rosa Castillo Hidalgo

«Cualquier forma de reproducción, distribución, comunicación pública o transformación de esta obra solo puede ser realizada con la autorización de sus titulares, salvo excepción prevista por la ley. Diríjase a CEDRO (Centro Español de Derechos Reprográficos, www.cedro.org) si necesita fotocopiar o escanear algún fragmento de esta obra».

ISBN: 978-84-267-3470-9

D.L.: B 7089-2022

Producción del ePub: booqlab

Índice

PARTE I: FUNCIONES Y MÉTODOS

Introducción

Lo que aprenderá en este libro

Instalando el servidor local wampserver

Instalando la plantilla para nuestro WordPress

Funciones y condicionales básicos de un plugin

¿Qué es un plugin?

Requisitos de cabecera, título y descripción del plugin

Ganchos de activación y desactivación

Métodos de desinstalación

Mejores prácticas para definir nuestras funciones o variables

Comprobación de las capacidades de usuario

Métodos de validación de datos

Métodos de desinfección para la entrada de datos

Nonces I

Nonces II

Menús y submenús de administración de WordPress

Creación de menús en la administración

Creando la función callback del menú

Creación de submenús

¿Qué son los hooks o ganchos en WordPress y para qué sirven?

Ganchos de acción o Action hooks I

Ganchos de acción o Action hooks II

Ganchos de filtro o filter hooks

Ganchos personalizados

Shortcodes

¿Qué es un shortcode?

Creando un shortcode complejo con parámetros

Modificando el shortcode con parámetros

Creando un filtro para nuestro shortcode

Eliminando el shortcode

Uso de las Api settings y Api options

¿Qué son las API settings?

Uso de la API de configuración I

Uso de la API de configuración II

Uso de la API de configuración III

Uso de la API options

Metadatos y Metaboxes

Metadatos I

Metadatos II

Metadatos III

Custom fields

Metaboxes personalizados

Añadiendo editor TinyMCE

Custom Post Types

¿Qué es un Custom Post Type?

Creando el Custom Post Type

Creando el contenido para el CPT

Habilitando la rest api de WordPress para nuestro CPT

Taxonomías en WordPress

¿Qué son las taxonomías?

Creando una taxonomía

Funciones para obtener los términos de una taxonomía I

Funciones para obtener los términos de una taxonomía II

Creando nuestro plugin con arquitectura MVC

Modularizando el código para nuestro plugin I

Modularizando el código para nuestro plugin II

Modularizando el código para nuestro plugin III

Gestión y creación de usuarios desde el administrador

Creando usuarios en WordPress I

Creando usuarios en WordPress II

Obteniendo la información de un usuario

Actualizando y eliminando la información de un usuario

Agregando un campo a los metadatos de usuarios

Guardando los datos de usuarios en el metacampo

Creando un nuevo archivo para organizar el código I

Creando un nuevo archivo para organizar el código II

Creando un nuevo archivo para organizar el código III

Manipulando los roles

Manipulando el rol de un usuario

Manipulando las capacidades de un rol

Comprobando las capacidades de usuario

Manipulando la http api de WordPress y el uso de los transitorios

Funciones para el uso de las peticiones HTTP (Parte I)

Funciones para el uso de las peticiones HTTP (Parte II)

Funciones para el uso de la caché I

Funciones para el uso de la caché II

Peticiones ajax de WordPress y encolamiento de archivos js y css

Creando sistema de encolamiento de archivos js y css I

Creando sistema de encolamiento de archivos js y css II

Método Ajax WordPress I

Método Ajax WordPress II

Método Ajax WordPress III

Método Ajax WordPress IV

Crear widgets

Crear widgets I

Crear widgets II

Tareas automáticas con wp_cron en WordPress

Tareas cron con WP_Cron I

Tareas cron con WP_Cron II

Tareas cron con WP_Cron III

Tareas cron con WP_Cron IV

Internacionalización de idiomas

¿Qué es la internacionalización?

Funciones para la internacionalización de idiomas

Traducción de cadenas de texto en archivos js

Generando los archivos POT

Cargando el TextDomain a nuestro plugin

Interactuando con la base de datos de WordPress

Consultas a la base de datos de WordPress I

Consultas a la base de datos de WordPress II

Consultas predefinidas I (funciones)

Consultas predefinidas II (funciones)

Consultas predefinidas III (funciones)

Consultas generales o específicas

Preparando consultas contra inyección sql

Mostrando errores en la consulta

Gestor multimedia

Gestor multimedia I

Gestor multimedia II Evento select

Gestor multimedia III imprimiendo la imagen

Gestor multimedia IV guardando las imágenes

Gestor multimedia (Método insert)

Gestor multimedia (Método ready)

PARTE II: GESTOR DE POPUPS

Crear un plugin para un modal

Organizando los archivos para el plugin I

Organizando los archivos para el plugin II

Creando el menú de opciones

Encolando los archivos css y js I

Encolando los archivos css y js II

Encolando los archivos css y js III

Creando el menú de opciones I

Creando el menú de opciones II

Creando el menú edit

Creando el modal y editando el js para abrirlo I

Creando el modal y editando el js para abrirlo II

Creando el ajax para guardar los datos del modal I

Creando el ajax para guardar los datos del modal II

Creando el ajax para guardar los datos del modal III

Probando la función para crear nuestros popup

Configurando la página de edición I

Configurando la página de edición II

Configurando la página de edición III

Configurando la página de edición IV

Activando el marco multimedia de WordPress

Creando la función para limpiar la url de la imagen

Obteniendo la ruta final de la imagen de nuestro marco multimedia

Preparando el método Ajax para guardar los datos del popup

Función php para recibir los datos del ajax

Recuperando los datos para nuestra página popup edit I

Recuperando los datos para nuestra página popup edit II

Ajustando el estado del botón switch para la llamada a la acción

Configurando los input radio

Creando la previsualización del popup

Estilos css para el modal

Creando el método Ajax para eliminar un popup

Creando el código php para la eliminación de los popup

Creando la carpeta public para mostrar el popup

Creando el shortcode para el popup

Editando el css y el js para mostrar el popup

PARTE III: GESTIÓN DE USUARIOS

Desarrollando el plugin para gestionar usuarios

Presentación del plugin

Instalando nuestro plugin, configurando la activación y desactivación

Creando el menú

Creando las páginas de visualización

Creando la estructura de la página del menú

Estructura del guardado de tablas con ajax (parte I)

Estructura del guardado de tablas con ajax (parte II) instalando sass

Estructura del guardado de tablas con ajax (parte III)

Configurando el lado del servidor para recibir los datos

Mostrando datos de las tablas

Estructurando la página para la manipulación de usuarios I

Estructurando la página para la manipulación de usuarios II

Agregando el gestor multimedia de WordPress

Limpiando la ruta de la imagen

Creando las funciones para validar los campos

Validando el campo email

Preparando el método ajax

Construyendo el objeto para todos los métodos del CRUD

Manipulando el archivo crud json

Creando el método de lectura json

Mostrando los usuarios insertados con jQuery I

Creando el método para actualizar los usuarios

Mostrando los usuarios insertados con jQuery II

Configurando el ajax para actualizar el usuario

Añadiendo una animación de color al actualizar un usuario

Creando el método de eliminar usuario

Eliminando el usuario de nuestra tabla I

Eliminando el usuario de nuestra tabla II

Creando el shortcode para mostrar el resultado final I

Creando el shortcode para mostrar el resultado final II

Creando el shortcode para mostrar el resultado final III

Parte I

FUNCIONES Y MÉTODOS

Introducción

Lo que aprenderá en este libro

Este libro está enfocado a todos aquellos que tengan algún conocimiento básico de los lenguajes de la web, como PHP, JavaScript, HTML, CSS, MySQL, y para los que hayan interactuado un poco con WordPress, por ejemplo, al realizar creación de blogs, sitios web, etc.

Si es de los que siempre han querido ir un poco más allá, intentando crear una funcionalidad en WordPress para que le realice algo en específico, pero se le hace difícil, porque no encuentra casi material que le pueda guiar, entonces este libro es para usted.

He desarrollado un itinerario que va desde lo más básico hasta lo más avanzado, para que pueda comprender cómo funciona en realidad WordPress y logre convertir sus ideas en poderosos plugins.

Una vez termine, habrá aprendido a:

• Manipular la base de datos de WordPress.

• Crear una estructura de archivos para sus plugins.

• Realizar consultas sql a la base de datos de WordPress.

• Utilizar múltiples funciones de WordPress para sus plugins.

• Manipular datos y roles de usuarios en WordPress.

• Crear sus propios ganchos de acción personalizados.

• Crear sus propios widgets, etc.

Instalando el servidor local wampserver

Ahora empezaremos preparando la base de nuestro WordPress, que no consiste más que en montar nuestro servidor local, el cual nos permitirá arrancar nuestro WordPress. Para ello, vamos a visualizar un vídeo que he preparado en YouTube, así que vamos a copiar en nuestro navegador el enlace que les dejo debajo de la imagen.

https://vimeo.com/574360614

Instalando la plantilla para nuestro WordPress

Para desarrollar cada uno de los ejercicios propuestos en este libro, he creado una plantilla “Restaurante” y he preparado un vídeo en el que explico cómo descargarla e instalarla. Dejaré el enlace debajo de la imagen.

https://vimeo.com/574360453

Recuerda: accede a www.marcombo.info para obtener gratis las credenciales.

Funciones y condicionales básicos de un plugin

¿Qué es un plugin?

Los plugins o complementos son paquetes de código que amplían la funcionalidad principal de WordPress. Los plugins de WordPress están formados por código PHP y otros activos como imágenes, CSS y JavaScript.

Al crear su propio complemento, está ampliando WordPress, es decir, creando funcionalidades adicionales además de lo que WordPress ya ofrece. Por ejemplo, podría escribir un complemento que muestre enlaces a las diez publicaciones más recientes en su sitio.

O, utilizando los tipos de publicaciones personalizadas de WordPress, puede escribir un complemento que cree un sistema de tiques de soporte con todas las funciones con notificaciones por correo electrónico, estados de tiques personalizados y un portal orientado al cliente. ¡Las posibilidades son infinitas!

La mayoría de los plugins o complementos de WordPress están compuestos por muchos archivos, pero un plugin realmente solo necesita un archivo principal con un DocBlock formateado específicamente en el encabezado.

Un DocBlock es un fragmento de código PHP comentado dentro de nuestro archivo php.

Requisitos de cabecera, título y descripción del plugin

El archivo PHP principal del plugin debe incluir un comentario de encabezado que le dice a WordPress que un archivo es un complemento, y proporciona información sobre este.

Como mínimo, un comentario de encabezado debe contener el nombre del complemento:

Campos de encabezado disponibles

Plugin Name: (obligatorio) el nombre de su complemento, que se mostrará en la lista de complementos en el administrador de WordPress.

Plugin URI: la página de inicio del complemento, que debe ser una url única, preferiblemente en su propio sitio web. Esto debe ser exclusivo de su complemento. No puede usar una url de WordPress.org aquí.

Description: una breve descripción del complemento, como se muestra en la sección Complementos en el Administrador de WordPress. Mantenga esta descripción a menos de 140 caracteres.

Version: el número de versión actual del complemento, como 1.0 o 1.0.3.

Requires at least: la versión más baja de WordPress en la que funciónará el complemento.

Requires PHP: la versión mínima requerida de PHP.

Author: el nombre del autor del complemento. Se pueden enumerar varios autores utilizando comas.

Author URI: el sitio web o el perfil del autor en otro sitio web, como WordPress.org.

License: el nombre corto (slug) de la licencia del complemento (por ejemplo, GPLv2). Puede encontrar más información sobre licencias en las pautas de WordPress.org.

License URI: un enlace al texto completo de la licencia (p. Ej. Https://www.gnu.org/licenses/gpl-2.0.html).

Text Domain: el dominio de texto gettext del complemento. Puede encontrar más información en la sección Dominio de texto de la página Cómo internacionalizar su complemento.

Domain Path: la ruta del dominio le permite a WordPress saber dónde encontrar las traducciones. Puede encontrar más información en la sección Ruta del dominio de la página Cómo internacionalizar su complemento.

Network: si el complemento solo se puede activar en toda la red. Solo se puede establecer en verdadero y se debe omitir cuando no sea necesario.

Ganchos de activación y desactivación

Creamos nuestro plugin de prueba, al que llamaremos pruebas. Vamos a nuestra carpeta wp-content -> plugins -> y aquí dentro de plugins crearemos una carpeta o directorio res_pruebas. Le pondremos un prefijo (res_), de restaurante.

Podemos ver resaltado res_pruebas, dentro crearemos un archivo PHP y lo nombraremos res-pruebas.php.

Vamos a nuestro editor Visual Studio Code y escribimos la cabecera.

Ahora escribiremos las funciones:

Es muy común que en el desactivador se utilice una función para limpiar enlaces permanentes, la función es:

flush_rewrite_rules

Elimine las reglas de reescritura y luego vuelva a crear las reglas de reescritura.

Parámetros

•$hard

(bool) (Opcional) Ya sea para actualizar .htaccess (hard flush) o simplemente actualizar rewrite_rules transient (soft flush). El valor predeterminado es verdadero (duro). Valor predeterminado: verdadero.

Esta función es útil cuando se usa con tipos de publicaciones personalizadas, ya que permite el vaciado automático de las reglas de reescritura de WordPress (por lo general, debe hacerse manualmente para los nuevos tipos de publicaciones personalizadas). Sin embargo, esta es una operación costosa, por lo que solo debe usarse cuando sea necesario.

Al desactivar el plugin, se ejecutará esa función y, al activarlo, llamará al archivo activador.php. Si activamos el plugin, nos dará un error, pues no tenemos este archivo.

Vamos a nuestro panel de administrador de WordPress, vamos a plugins y buscamos el plugin pruebas.

Activaremos el plugin y veremos el error.

Ahora, para comprobar que nuestro plugin funciona, vamos a nuestro archivo res-pruebas.php y comentamos la línea donde requerimos el archivo activador.php. Al desinstalar y volver a instalar, veremos que no aparece ningún error.

Ahora crearemos el archivo activador.php y escribiremos lo siguiente:

Con este código estaremos creando una tabla en nuestra base de datos a la que llamaremos mitabla. Esta tabla se creará en el mismo instante en que hagamos clic en Activar nuestro plugin.

Métodos de desinstalación

Los métodos de desinstalación de plugins en WordPress se ejecutan cuando hacemos clic en la opción de borrar un plugin en WordPress.

El primer método requiere que en nuestro archivo principal del plugin escribamos una función.

Con esta función podemos borrar tablas, configuraciones y otras opciones.

El segundo método requiere crear un archivo en la raíz de nuestro plugin, este archivo debe llamarse uninstall.php. Creamos el archivo y escribimos el siguiente código:

Este primer código es de seguridad y dice que, si no está definida esa constante, no siga ejecutando el código que vamos a escribir más abajo.

Ahora vamos a crear una consulta sql para eliminar la tabla que hemos creado anteriormente.

Después de escribir este código, guardamos los cambios.

Ahora vamos a comprobar que esto funciona y, para ello, vamos primero a crear una copia de nuestro plugin res_pruebas comprimiéndolo en un archivo .zip con winrar.

Después de crear el archivo res_pruebas.zip, volvemos a nuestro panel de administración, recargamos la página y desinstalamos el plugin res_pruebas. Ahora hacemos clic en Borrar.

Veremos que nos saldrá una ventana de confirmación y hacemos clic en Aceptar. Ahora, al volver a nuestra base de datos y recargar, podemos ver que la tabla atr_mitabla ha desaparecido.

Mejores prácticas para definir nuestras funciones o variables

Para que no se creen conflictos entre nuestras funciones, clases y variables de WordPress, debemos definirlas de la siguiente manera:

Comprobando que una variable no exista:

Comprobando que una función no exista:

Comprobando que una clase no exista:

Comprobando que una constante no está definida:

Mostrar información de nuestro plugin según el rol que tenga la persona, is_admin();. Determina si la solicitud actual es para una página de interfaz administrativa. Para ver más acerca de esta función, podemos visitar la web oficial de WordPress developers.

https://developer.wordpress.org/reference/functions/is_admin/

Comprobación de las capacidades de usuario

Las capacidades de usuario son las funciones que se pueden realizar dependiendo del rol que tenga la persona dentro de la web. Los roles que puede desempeñar una persona dentro de un proyecto web son:

• Super Admin

• Administrator

• Editor

• Author

• Contributor

• Subscriber

A continuación, mostraremos como ejemplo algunas de las funciones que se pueden realizar con el rol de Super Admin:

•create_sites

•delete_sites

•manage_network

•manage_sites

•manage_network_users

•manage_network_plugins

•manage_network_themes

•manage_network_options

•upload_plugins

•upload_themes

Son muchas más las funciones. Acto seguido, pondremos una tabla con las funciones y los roles que pueden desempeñar dichas funciones.

Para conceder el permiso a un usuario según su rol o mostrarle según qué funciones, podemos utilizar la siguiente función:

current_user_can( string $capability, mixed $args )

También podemos escribir un condicional para ejecutar alguna acción, por ejemplo:

Ahora crearemos un ejemplo, añadiremos una función donde aquel usuario con permisos para editar paginas podrá ver la modificación que añadiremos al head de nuestro WordPress:

Esta función nos puede dar un error Undefined function wp_get_current_user(). Este error se debe a que, durante el proceso de carga, WordPress carga primero todos los archivos y plugins, por último comprueba las capacidades de usuario, por eso nos marca el error de que no está definido.

Para solventar este error, debemos crear una función con el gancho de acción ‘plugins_loaded’; así quedaría el código.

Si vamos a nuestro frontend y comprobamos desde la consola nuestro head, veremos los cambios realizados.

Métodos de validación de datos

Existen varios métodos de validación de datos en WordPress. Entre los más utilizados podemos encontrar los siguientes:

• is_email()

• term_exists()

• username_exists()

• validate_file()

Pondremos un ejemplo de cómo validar un email:

Al aplicar este código de validación, obviamente me devolverá que es correcto, pues el mail cumple con los requisitos, que son:

• Nombre de usuario

• Servidor

• Sin olvidar el punto(.) y la arroba (@)

Si quitásemos el punto y dejáramos: prueba@pruebaeu, me devolvería Email incorrecto. Vamos al frontend en la página de inicio y nos fijamos en la parte superior, y veremos el mensaje Email incorrecto:

Otras funciones para la validación de datos pueden ser funciones de php como:

• isset() - empty()

• mb_strlen() - strlen()

• preg_match, strpos()

• count()

• in_array()

Pondremos un ejemplo de cómo utilizar in_array();

Esto me devolverá true, pues manzana está dentro del array.

Métodos de desinfección para la entrada de datos

Los métodos de sanitización de WordPress nos ayudan a eliminar caracteres extraños o maliciosos en nuestro envío y recepción de datos.

Para ello, utilizaremos las funciones de sanitización de WordPress, que son las siguientes:

• sanitize_email()

• sanitize_file_name()

• sanitize_html_class()

• sanitize_key()

• sanitize_meta()

• sanitize_mime_type()

• sanitize_option()

• sanitize_sql_orderby()

• sanitize_text_field()

• sanitize_title()

• sanitize_title_for_query()

• sanitize_title_with_dashes()

• sanitize_user()

• esc_url_raw()

• wp_filter_post_kses()

• wp_filter_nohtml_kses()

sanitize_email( $email )

Elimina todos los caracteres que no están permitidos en un correo electrónico.

sanitize_file_name( $filename )

Desinfecta un nombre de archivo, reemplazando espacios en blanco con guiones.

Descripción

Elimina caracteres especiales, que son ilegales en los nombres de archivo en ciertos sistemas operativos, y caracteres especiales, que requieren un escape especial para manipular en la línea de comando. Reemplaza espacios y guiones consecutivos con un solo guion. Recorta el período, el guion, y el subrayado, desde el principio y el final del nombre de archivo. No se garantiza que esta función devolverá un nombre de archivo que se puede cargar.

Desinfecta un nombre de clase HTML para garantizar que solo contenga caracteres válidos.

sanitize_key( $key )

Desinfecta una clave de cadena.

Descripción

Las claves se usan como identificadores internos. Se permiten caracteres alfanuméricos en minúscula, guiones y guiones bajos.

Desinfecta el metavalor.

Parámetros

•$meta_key

( cadena ) (Obligatorio) Clave de metadatos.

•$meta_value

( mixto ) (Requerido) Valor de metadatos para desinfectar.

•$object_type

( cadena ) (Obligatorio) El tipo de metadatos del objeto es para. Acepta ‘publicación’, ‘comentario’, ‘término’, ‘usuario’ o cualquier otro tipo de objeto con una metatabla asociada.

•$object_subtype

( cadena ) (Opcional) El subtipo del tipo de objeto. Valor por defecto: ‘’

sanitize_mime_type( $mime_type )

Desinfecta un tipo mimo.

sanitize_option( $option, $value )

Desinfecta varios valores de opciones según la naturaleza de la opción.

Descripción

Esto es básicamente una declaración de cambio que pasará $value a través de una serie de funciones dependiendo de la $option.

Parámetros

•$option

• ( cadena ) (Obligatorio) El nombre de la opción.

•$value

• ( cadena ) (Obligatorio) El valor no desinfectado.

sanitize_sql_orderby ( $orderby )

Asegura que una cadena sea una cláusula válida de ‘ordenar por’ de SQL.

sanitize_text_field ( $str )

Desinfecta una cadena de entrada del usuario o de la base de datos.

sanitize_title( $title )

Desinfecta un título o devuelve un título alternativo.

sanitize_title_for_query( $title )

Desinfecta un título con el contexto de ‘consulta’.

sanitize_title_with_dashes( $title )

Desinfecta un título, reemplazando espacios en blanco y algunos otros caracteres con guiones.

Descripción

Limita la salida a caracteres alfanuméricos, guion bajo (_) y guion (-). El espacio en blanco se convierte en un guion.

sanitize_user()

Desinfecta un nombre de usuario, eliminando caracteres inseguros.

esc_url_raw( $url )

Realiza esc_url () para el uso de la base de datos.

wp_filter_post_kses( $data )

Desinfecta el contenido de las etiquetas HTML permitidas para el contenido de la publicación.

Descripción

El contenido de la publicación se refiere al contenido de la página del tipo ‘publicación’ y no a los $_POSTdatos de los formularios. Esta función espera datos recortados.

wp_filter_nohtml_kses()

Elimina todo el HTML de una cadena de texto.

Ejemplos

Ejemplo 1

A continuación, pondremos un ejemplo de cómo funciona el método sanitize_text_field()

Estamos inyectando código sql dentro del mensaje. Lo que hace la función de sanitización es eliminar este código. Si vamos a nuestro frontend y observamos en la consola, veremos que lo elimina.

Ejemplo 2

Ahora vamos a realizar un ejemplo con el método sanitize_email(), el cual podemos utilizar por ejemplo cuando recibimos en un formulario el mail de algún usuario.

Para ello, vamos a nuestro archivo principal de nuestro plugin res-pruebas. php y escribimos el siguiente código:

Observemos que estamos introduciendo un email con espacios y caracteres que no se pueden admitir en un correo normal, ahora lo pasamos por el método de sanitización y revisamos nuestro frontend.

Vemos cómo me devuelve solo los caracteres admitidos.

Nonces I

Generalidades

El término «nonce» es la abreviación en inglés de «number used once», o número usado una vez. En WordPress los nonces son cadenas de texto que parecen ser cadenas aleatorias, pero en realidad no lo son, pues son generadas a través de funciones hash.

Una función criptográfica hash (usualmente conocida como “hash”) es un algoritmo matemático que transforma cualquier bloque arbitrario de datos en una nueva serie de caracteres con una longitud fija. Independientemente de la longitud de los datos de entrada, el valor hash de salida tendrá siempre la misma longitud.

Nonces en WordPress

Si vemos el código de los enlaces o código de los formularios de WordPress, podemos detectar alguna de estas cadenas de seguridad.

Nonces en URL

Por ejemplo, cuando queremos eliminar una entrada, veremos una url como se muestra en la siguiente imagen:

_wpnonce es el parámetro por defecto que usa WordPress para el nonce en la url.

Nonces en formularios

Por ejemplo, al crear una nueva entrada, aparece el formulario con los diferentes campos para llenar, pero también aparecen campos ocultos. Lo podemos ver con el Inspector de Código, tal como se muestra en la siguiente imagen:

Vemos que el nombre del input es _wpnonce es el nombre por defecto que usa WordPress para el nonce.

Proteger a los usuarios de ellos mismos

Imagínese que un usuario tiene permisos de administrador y está logueado en su WordPress, él no tiene pensado borrar ninguna entrada. Sin embargo, ¿qué sucede si le envío por correo un enlace con la url para eliminar una entrada? Si el usuario pulsa mi enlace, lo estaré forzando a realizar el borrado de alguna entrada.

Este tipo de ataque es parte de los ataques conocidos como CSRF (Cross Site Request Forgery).

Si el usuario ejecuta alguna acción forzada sin tener un nonce válido, WordPress mostrará la siguiente pantalla por defecto y sin opción a nada.

Creando Nonces en el desarrollo de plugins

Por todo lo anteriormente expuesto, cuando desarrollamos plugins, hay que tener presente el uso de nonces. A continuación, veremos algunos escenarios más comunes:

Nonces en URL

Para agregar un nonce en la url, usamos la función wp_nonce_url(), por ejemplo:

En el código anterior:

• Nuestro nonce se generará a partir del texto «ejemplo-nonce».

• Tendrá como nombre «nonce» (en lugar del nombre por defecto _wpnonce).

Nonces en formulario

En este caso usaremos la función wp_nonce_field(), que creará el campo oculto con el valor del nonce.

En el código anterior:

• Nuestro nonce se generará a partir del texto «ejemplo-nonce».

• tendrá como nombre de campo «nonce» (en lugar del nombre por defecto _wpnonce).

Nonces usando ajax

Para usar nonces con ajax, tenemos que crear el nonce y pasarlo al archivo javascript a través de la función wp_localize_script(). Para la creación del nonce usaremos wp_create_nonce().

Comprobando validez de Nonces en el desarrollo de plugins

Para personalizar el mensaje que se muestra cuando hay un error de nonce, puede usar la función wp_verify_nonce(). El código sería similar al siguiente:

Este código funcionará en todos los casos, para nonces en url, formulario y ajax.

IMPORTANTE:

Los nonces cambian cada 12 horas y es válido por 24 horas (es decir, el nonce actual tiene un período de expiración de 24 horas, pero ese código generado se repetirá solo por 12 horas, y luego cambiará por otro, siendo válidos los 2 en su período de tiempo).

Ejemplos

Ejemplo 1

En este ejemplo veremos cómo insertar un nonce en una url. Para ello, vamos a configurar primero nuestros enlaces y vamos a nuestro panel de administración de WordPress, y en ajustes->enlaces permanentes vamos a clicar la opción nombre de la entrada y hacemos clic en guardar cambios.

Ahora vamos al archivo functions.php de nuestra plantilla restaurante, la ruta es:

C:\wamp64\www\_curso02\wp-content\themes\atr_theme

Aquí encontraremos el archivo functions.php y dentro de este archivo crearemos una variable donde guardaremos la ruta de algún post de nuestra web restaurante. A continuación, con la función wp_nonce_url() pasaremos el nonce de seguridad.

El código seria así:

Observemos qué estamos haciendo en echo para ver la ruta y el nonce que generamos.

Nonces II

Ejemplo 2

En este ejemplo crearemos un nonce para un input de un formulario, crearemos una opción de menú en nuestro panel de administrador y un formulario con un botón de eliminar. En este formulario pasaremos el nonce que hemos creado y lo verificaremos.

Creamos un menú en el panel de administración:

Después creamos la función donde pasaremos un nonce por medio de un formulario:

En el código que acabamos de escribir, validaremos el nonce que hemos creado, y pasamos por el formulario a través del campo input con el name “nonce”. Validaremos si el valor $_POST[‘nonce’] existe y no está vacío:

También utilizaremos una function de WordPress wp_verify_nonce(), para comprobar que el nonce que creamos y pasamos por post sea el mismo:

El resultado de todo este código es que, en nuestro panel de administración, al hacer clic en el botón eliminar, veremos un mensaje tal que hemos verificado correctamente el nonce:

Menús y submenús de administración de WordPress

Creación de menús en la administración

Crear un menú en WordPress es bastante sencillo. Existen varias formas de hacerlo: lo puedes poner en un plugin, lo puedes poner en un tema, y luego lo puedes hacer con clases o con funciones sueltas.

¿Para qué vale tener un menú de administración en WordPress? Si quieres poder personalizar o tener tus propias páginas de configuración para vuestro plugin o vuestro tema, esta es la mejor solución.

Crear un menú en WordPress

Para esto usaremos la función add_menu_page() que nos provee la api de WordPress.

Agregar una página de menú de nivel superior.

Descripción

Esta función tiene una capacidad que se utilizará para determinar si una página se incluye o no en el menú.

La función que está conectada para manejar la salida de la página debe verificar que el usuario también tenga la capacidad requerida.

Parámetros

•$page_title

( cadena ) (obligatorio) El texto que se mostrará en las etiquetas de título de la página cuando se seleccione el menú.

•$menu_title

( cadena ) (obligatorio) El texto que se utilizará para el menú.

•$capability

( cadena ) (Requerido) La capacidad requerida para que en este menú se muestre al usuario.

•$menu_slug

( cadena ) (Obligatorio) El nombre del slug para referirse a este menú. Debe ser único para esta página de menú y solo debe incluir caracteres alfanuméricos en minúscula, guiones y guiones bajos para que sean compatibles con sanitize_key ().

•$function

( invocable ) (Opcional) La función que se llamará para generar el contenido de esta página. Valor por defecto: ‘’

•$icon_url

( cadena ) (Opcional) La url del icono que se utilizará para este menú. Pase un SVG codificado en base64 usando un URI de datos, que se coloreará para que coincida con el esquema de color. Esto debería comenzar con ‘data: image / svg + xml; base64,’. Pase el nombre de una clase auxiliar de Dashicons para usar un icono de fuente, por ejemplo, ‘dashicons-chart-pie’. Pase ‘none’ para dejar div.wp-menu-image vacío para que se pueda agregar un icono a través de CSS. Valor por defecto: ‘’

•$position

( int ) (Opcional) Debe aparecer la posición en el orden de menú de este elemento. Valor predeterminado: nulo

Ejemplo

Crearemos un menú como ejemplo en nuestro plugin pruebas. Lo primero que crearemos es un archivo img en la raíz de nuestro plugin y dentro pondremos un archivo de tipo imagen de 20 px x 20 px que es lo que requiere el estándar de WordPress para los iconos personalizados de nuestros menús.

Después en nuestro archivo principal res-pruebas.php escribiremos el siguiente código para crear el menú:

Creando la función callback del menú

Ahora crearemos la función de llamada o función callback del menú, que es donde pondremos nuestro html. Esta función proviene de la función de creación de la página del menú.

Eliminar menús

Para eliminar algún menú del panel de administración, debemos utilizar la función remove_menu_page(), dentro de la misma función donde se creó el menú.

Eliminaremos el menú RES Prueba Nonce que hemos hecho en ejemplos anteriores.

Si vamos a nuestro panel de administrador, veremos cómo desaparece el menú.

Creación de submenús

Los submenús son páginas de opciones adicionales que van dentro del menú que hemos creado. Para crear un submenú del menú RES Opciones de Página, debemos tener en cuenta el slug que es res_options_page y escribimos lo siguiente:

Ahora crearemos la función de llamada o función callback, donde pondré mi html.

Funcion add_submenu_page()

Agregar una página de submenú.

Descripción

Esta función tiene una capacidad que se utilizará para determinar si una página se incluye o no en el menú.

La función que está conectada para manejar la salida de la página debe verificar que el usuario también tenga la capacidad requerida.

Parámetros

•$parent_slug (cadena ) (Obligatorio)

El nombre del slug para el menú principal (o el nombre de archivo de una página de administración estándar de WordPress).

•$page_title

(cadena ) (obligatorio) El texto que se mostrará en las etiquetas de título de la página cuando se seleccione el menú.

•$menu_title

(cadena ) (obligatorio) El texto que se utilizará para el menú.

•$capability

(cadena ) (Requerido) La capacidad requerida para que este menú se muestre al usuario.

•$menu_slug

(cadena ) (Obligatorio) El nombre del slug para referirse a este menú. Debe ser único para este menú y solo debe incluir caracteres alfanuméricos en minúscula, guiones y guiones bajos para que sean compatibles con sanitize_key ().

•$function

( invocable ) (Opcional) La función que se llamará para generar el contenido de esta página. Valor por defecto: ‘’

•$position

( int ) (Opcional) Debe aparecer la posición en el orden de menú de este elemento. Valor predeterminado: nulo.

Como podemos ver en la imagen, tenemos el menú principal y el submenú. Ganchos Hooks

¿Qué son los hooks o ganchos en WordPress y para qué sirven?

WordPress, a diferencia de otros gestores de contenido, utiliza una arquitectura basada en eventos y procedimientos. Si quieres desarrollar tanto temas como plugins en este CMS, es esencial que aprendas a utilizar el sistema de hooks o ganchos.

Los ganchos o hooks en WordPress 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 “enganchado”.

De esta manera, podrás modificar el funcionamiento del código de WordPress sin ni siquiera tocarlo. Sin embargo, tienes que ser consciente de que los hooks no se ejecutan aleatoriamente, sino que siguen un orden.

En WordPress existen dos tipos de hooks: acciones (actions hooks) y filtros (filters hooks). Aunque se utilizan de la misma manera, el valor que devuelve cada uno es diferente.

Ganchos de acción o Action hooks I

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, realice la acción que quiera además de las que ya se van a ejecutar por defecto. En resumen, los action hooks añaden código adicional a su WordPress.

Propiedades

•$tag (requerido):

El nombre de la acción a la que se va a enganchar la función que añada, o sea, que aquí pondré el nombre del do_action().

•$function_to_add (requerido):

El nombre de la función que creó para utilizar con este gancho de acción.

•$priority (opcional):