Tutorial de temas de WordPress para principiantes – Parte 3: Contenido dinámico
En esta lección del tutorial de temas de WordPress para principiantes, aprenderemos sobre los ganchos en WordPress y agregaremos algunos ganchos en nuestro tema que se requieren para que un tema funcione correctamente con WordPress y los complementos. También comenzaremos a acceder a contenido dinámico de WordPress en nuestro encabezado, como obtener automáticamente el título de la página actual.
Primero, debemos aprender un poco sobre los ganchos en WordPress. Los ganchos son una funcionalidad básica con la que debe familiarizarse. No soy fanático de mostrar un montón de código en el que necesitas copiar y pegar sin saber lo que realmente hace. Si está siguiendo este tutorial, quiere aprender esto correctamente, ¿verdad?
No te preocupes, seré breve por ahora. Aprenderemos más sobre esto más adelante en este tutorial.
Ganchos en WordPress
En breve; Como WordPress ejecuta todo el código para cargar y renderizar una página, hay ciertos "puntos de control", que llamamos ganchos. Estos puntos es donde WordPress permite a los desarrolladores modificar o agregar su propio código. WordPress ha definido un montón de "puntos de control" donde, cada uno con un nombre único. Si conoce el nombre, puede agregar su propio código en estos puntos de control. Y así decirle fácilmente a WordPress que ejecute su código cuando llegue a ese punto de control como parte de su proceso.
Hay dos tipos de anzuelos; acciones y filtros. Las acciones son puntos en el código donde puede agregar código personalizado, por ejemplo, generar algo o hacer algo para sus propios fines. Los filtros son puntos en el código donde puede modificar una determinada variable antes de que se use o se envíe. Son muy similares, pero los filtros se adjuntan a una variable específica y las acciones no.
Los complementos, los temas y el propio WordPress pueden "enganchar" su código add_action()para acciones y add_filter()filtros. Estas dos funciones le dicen a WordPress que ejecute el código enganchado siempre que la ejecución llegue a estos ganchos.
Para definir ganchos que usas do_action()para acciones y apply_filters()para filtros.
Para cualquiera que esté interesado en saber más, tengo otra publicación que detalla los ganchos en WordPress.
Un tema de WordPress debe incluir algunos ganchos (acciones) importantes y específicos. Estos enlaces permiten que WordPress, los complementos y nuestro propio tema se conecten y hagan cosas críticas. Veamos esos ganchos críticos que necesitamos agregar.
Los ganchos de encabezado y pie de página del tema
Todos los temas de WordPress deben tener dos ganchos en las plantillas. Se debe colocar una acción en el encabezado (dentro de la <head>etiqueta) y otra en el pie de página (justo antes de cerrar la </body>etiqueta). Estos dos ganchos son absolutamente necesarios para que WordPress, su tema y cualquier complemento puedan agregar sus scripts y códigos de estilos a su tema.
Los ganchos que necesitamos son wp_heady wp_footerpara el encabezado y el pie de página, respectivamente.
Normalmente, cuando queremos ejecutar un gancho, llamamos a do_action(<hook name>). Pero debido a que estos dos ganchos son tan críticos, WordPress los ha simplificado para nosotros poniéndolos en una llamada de función simple. Entonces, para estos dos ganchos, simplemente puede usar wp_head()y wp_footer(). En segundo plano, estos dos ejecutan el do_action().
Agreguemos estos dos ganchos (llamadas a funciones) a nuestras plantillas de encabezado y pie de página, y veamos qué sucede.
Presiona actualizar en tu interfaz. Si ha iniciado sesión, ahora debería ver aparecer la barra de administración de WordPress. Esto significa que WordPress ahora puede agregar con éxito sus scripts y estilos a su tema.
Puede verificar su fuente HTML y ver que su encabezado ahora contiene bastante código. Este es un código que no agregaste a tu tema. Como puede ver, el mismo WordPress está usando los ganchos que agregamos para hacer sus propias cosas.
Pasemos de los ganchos y comencemos a ver cómo podemos obtener contenido dinámicamente de WordPress y mostrarlo en nuestro encabezado.
Contenido dinámico en el encabezado
Digamos a WordPress que establezca dinámicamente el título del documento (para la <title>etiqueta). Para ello utilizaremos una función, (que por cierto tiene filtro), llamada wp_title(). Como aprendimos anteriormente, debido a que wp_title()es un filtro, usted, WordPress o los complementos pueden modificar la salida. Agregaremos un filtro a esto más adelante en este tutorial.
La función wp_title()toma varios argumentos que puede ajustar a su gusto, pero por ahora agregaré una cadena vacía para que solo muestre el título de cualquier página en la que estemos.
Cambie su <title>etiqueta header.phpa esto:
Los entusiastas de ustedes podrían haber notado que la página principal no generará un título. Este es el comportamiento estándar de WordPress que corregiremos más adelante en este tutorial (lo haremos con la ayuda del filtro). Si visita una sola publicación o página, debe obtener el título de la publicación.
WordPress tiene una función ingeniosa que genera dinámicamente un montón de clases para la <body>etiqueta dependiendo de la página en la que nos encontremos; llamado body_class. Actualice la <body>etiqueta en header.phpesto:
Actualice y eche un vistazo a todas las clases agregadas a la <body>etiqueta. Echa un vistazo a las diferentes páginas (portada, individual, categoría). Todas estas clases son muy útiles para diseñar y diferenciar diferentes partes similares. Lo más probable es que utilice algunos de estos en su CSS.
Para seguir las buenas prácticas de HTML, también debemos informar sobre el idioma del sitio en el HTML. Para ello utilizamos una función de WordPress para obtener el idioma desde Ajustes; atributos_idioma.
Y finalmente, me gustaría agregar algunas etiquetas meta que no son específicas de WordPress, pero siguen prácticas comunes de diseño web. Así es header.phpcomo se ve el archivo completo:
Para el siguiente paso de este tutorial, lo dejaremos header.phpy profundizaremos index.phppara aprender a obtener contenido más dinámico, como publicaciones.