En el dinámico mundo del desarrollo web, WordPress se ha consolidado como una de las plataformas más populares y versátiles. Con su facilidad de uso y amplia capacidad de personalización, ha permitido a millones de desarrolladores y diseñadores crear sitios web impresionantes, desde blogs personales hasta tiendas en línea complejas. Sin embargo, para maximizar el potencial de WordPress, es crucial comprender los principios básicos que sustentan su funcionamiento.
Dominar los fundamentos de WordPress no solo facilita la creación de sitios web más eficientes y seguros, sino que también potencia tu capacidad para resolver problemas y personalizar funcionalidades según las necesidades específicas de cada proyecto. Desde la estructura de archivos y la jerarquía de plantillas, hasta el uso de ganchos (hooks) y funciones personalizadas, tener un conocimiento sólido de estos conceptos te permitirá desarrollar sitios más robustos y escalables.
Carpetas y ficheros en WordPress
- Carpeta raíz (/):
- wp-admin: Contiene los archivos y scripts necesarios para el funcionamiento del área de administración de WordPress.
- wp-content: Es la carpeta donde se almacenan los archivos de temas, plugins, subidas de medios y archivos temporales.
- wp-includes: Contiene los archivos centrales de WordPress, como las bibliotecas y clases PHP necesarias para el funcionamiento del sistema.
- Carpeta de Contenido (/wp-content):
- themes: Aquí se almacenan los temas instalados en tu sitio web. Cada tema tiene su propia carpeta dentro de esta carpeta.
- plugins: Contiene los plugins instalados en tu sitio. Cada plugin tiene su propia carpeta dentro de esta carpeta.
- uploads: Es la ubicación predeterminada para subir y almacenar archivos multimedia, como imágenes y vídeos.
- languages: Contiene archivos de traducción si tu sitio está en un idioma distinto al inglés.
- upgrade: Almacena archivos temporales durante el proceso de actualización de WordPress.
- Carpeta del Tema Activo (/wp-content/themes/nombre-del-tema-activo):
- style.css: Archivo principal del tema que contiene la información de metadatos del tema, como el nombre, la descripción, la versión, el autor, etc.
- index.php: Archivo principal del tema que se utiliza como punto de entrada predeterminado.
- functions.php: Archivo donde puedes añadir funciones y personalizaciones para tu tema.
- template-parts: Carpeta opcional donde puedes organizar fragmentos de código reutilizables para tu tema.
- header.php: Archivo que contiene la estructura del encabezado del sitio.
- footer.php: Archivo que contiene la estructura del pie de página del sitio.
- single.php: Plantilla utilizada para mostrar entradas individuales de blog.
- page.php: Plantilla utilizada para mostrar páginas estáticas.
- archive.php: Plantilla utilizada para mostrar páginas de archivo, como categorías y etiquetas.
- 404.php: Plantilla utilizada para mostrar la página de error 404 (página no encontrada).
- … y otros archivos y carpetas dependiendo de la estructura y las características del tema.
- Carpeta de Plugins (/wp-content/plugins/nombre-del-plugin):
- plugin.php: Archivo principal del plugin que contiene la información de metadatos del plugin.
- index.php: Archivo principal del plugin utilizado como punto de entrada.
- … y otros archivos y carpetas dependiendo de la estructura y las características del plugin.
- Otras Carpetas y Archivos Importantes:
- wp-config.php: Archivo de configuración principal de WordPress donde se almacenan los detalles de la base de datos, las claves secretas y otras configuraciones importantes.
- .htaccess: Archivo de configuración utilizado por el servidor web para definir reglas de redirección y configuraciones de seguridad.
- wp-config-sample.php: Una plantilla de wp-config.php que se puede utilizar como referencia para configurar el archivo de configuración de WordPress.
Principales partes del desarrollo WordPress:
- Hooks y Actions (Ganchos y Acciones): WordPress utiliza un sistema de “hooks” (ganchos) que te permite interactuar con el núcleo de WordPress o con temas y plugins. Los “actions” (acciones) te permiten ejecutar funciones en puntos específicos durante el proceso de carga de una página, como antes o después de que se muestre el contenido. Esto te permite personalizar y ampliar WordPress de manera flexible.
- Template Tags (Etiquetas de Plantilla): WordPress proporciona una serie de etiquetas de plantilla que puedes utilizar en tus archivos de tema para mostrar dinámicamente contenido como el título de una entrada, la fecha de publicación, el autor, etc.
- WP_Query: Es una clase de WordPress que te permite realizar consultas personalizadas a la base de datos para recuperar contenido específico, como entradas, páginas o cualquier tipo de publicación personalizada.
- Custom Post Types (Tipos de Entradas Personalizadas): WordPress permite crear tipos de entrada personalizados además de las entradas y páginas predeterminadas. Esto te permite estructurar y gestionar diferentes tipos de contenido de manera más efectiva.
- Custom Fields (Campos Personalizados): WordPress permite añadir campos personalizados a las entradas, páginas y otros tipos de entrada personalizados. Estos campos pueden ser utilizados para añadir información adicional al contenido, como metadatos, imágenes destacadas, etc.
- Shortcodes (Códigos Cortos): Los códigos cortos son pequeños fragmentos de código que te permiten insertar contenido dinámico o funciones específicas en tus entradas, páginas o widgets simplemente utilizando un atajo.
- Transients API: Esta API te permite almacenar en caché datos temporales en la base de datos para mejorar el rendimiento de tu sitio al reducir el número de consultas a la base de datos.
- REST API: WordPress ofrece una API RESTful que te permite interactuar con tu sitio WordPress utilizando JSON para realizar operaciones como crear, leer, actualizar y eliminar contenido, así como realizar consultas personalizadas.
Hooks y Actions
Actions (Acciones):
- ¿Qué son? Las acciones son puntos específicos en el proceso de carga de una página de WordPress donde puedes ejecutar tu propio código. Estos puntos pueden ser antes, durante o después de la ejecución de ciertas partes del código principal de WordPress.
- ¿Cómo funcionan? Para ejecutar una acción, simplemente creas una función y la “enganchas” al punto de acción específico utilizando la función add_action(). Cuando WordPress llega a ese punto durante la carga de la página, ejecuta todas las funciones asociadas con esa acción.
- Ejemplo: Supongamos que quieres agregar un mensaje personalizado al final de cada entrada de blog. Puedes usar el hook the_content para enganchar tu función y mostrar el mensaje después del contenido de la entrada.
function agregar_mensaje_personalizado_al_final($content) { $mensaje = '<p>Mensaje personalizado al final de la entrada.</p>'; return $content . $mensaje; } add_action('the_content', 'agregar_mensaje_personalizado_al_final');
Filters (Filtros):
- ¿Qué son? Los filtros te permiten modificar o manipular datos antes de que se muestren en la página. Puedes usarlos para alterar texto, HTML, valores de atributos, etc.
- ¿Cómo funcionan? Al igual que con las acciones, creas una función que toma un valor como entrada, lo modifica según sea necesario y luego lo devuelve. Luego, utilizas add_filter() para “engancharte” al filtro deseado. WordPress pasa el valor a través de todas las funciones asociadas con ese filtro, permitiéndote modificarlo.
- Ejemplo: Supongamos que quieres modificar el título de todas las entradas de blog para que estén en mayúsculas. Puedes usar el filtro the_title para lograrlo.
function convertir_titulo_a_mayusculas($title) { return strtoupper($title); } add_filter('the_title', 'convertir_titulo_a_mayusculas');
Resumen:
- Actions: Te permiten ejecutar código en momentos específicos durante el ciclo de vida de una solicitud de página.
- Filters: Te permiten modificar datos antes de que se muestren en la página.
- Ambos tipos de hooks son poderosos y flexibles, permitiéndote personalizar y extender WordPress de manera significativa según tus necesidades.
Hay muchos hooks disponibles en WordPress, pero algunos de los más conocidos y utilizados son los siguientes:
Ejemplos de Acciones y Hooks
Acciones (Actions):
- init: Se ejecuta después de que WordPress haya terminado de cargar pero antes de enviar cualquier salida al navegador.
- wp_head: Se ejecuta en la sección <head> de la página justo antes de que se cierre la etiqueta </head>.
- wp_footer: Se ejecuta justo antes de cerrar la etiqueta </body>, al final del archivo footer.php.
- wp_enqueue_scripts: Se utiliza para añadir estilos y scripts en la sección <head> de la página.
- admin_enqueue_scripts: Similar a wp_enqueue_scripts, pero para el área de administración.
Filtros (Filters):
- the_content: Te permite modificar el contenido de la entrada antes de que se muestre en la página.
- the_title: Te permite modificar el título de la entrada antes de que se muestre en la página.
- excerpt_length: Te permite modificar la longitud del extracto (excerpt) de la entrada.
- the_excerpt: Te permite modificar el extracto de la entrada antes de que se muestre en la página.
- widget_title: Te permite modificar el título de los widgets antes de que se muestren en la página.
Template Tags
Las “Template Tags” (etiquetas de plantilla) en WordPress son funciones predefinidas que se utilizan en archivos de temas para mostrar contenido dinámico y realizar diversas tareas relacionadas con la presentación de datos. Estas funciones se utilizan para recuperar información específica de WordPress y mostrarla en la página web. Aquí hay una explicación más detallada:
Funciones de Obtención de Contenido:
- the_title(): Muestra el título del artículo o página actual.
- the_content(): Muestra el contenido del artículo o página actual.
- the_excerpt(): Muestra un extracto del contenido del artículo o página actual.
- the_permalink(): Muestra la URL permanente del artículo o página actual.
- the_post_thumbnail(): Muestra la imagen destacada del artículo actual.
- the_author(): Muestra el nombre del autor del artículo actual.
- the_category(): Muestra las categorías a las que pertenece el artículo actual.
Funciones de Bucle:
Estas funciones se utilizan dentro del bucle de WordPress (while (have_posts()) : the_post();) para mostrar contenido dinámico de la base de datos.
- the_post(): Configura los datos del artículo actual en el bucle.
- have_posts(): Verifica si hay más artículos disponibles en el bucle.
- rewind_posts(): Reinicia el bucle de WordPress para permitir otro ciclo de iteración.
- wp_reset_postdata(): Restablece los datos del artículo después de un bucle personalizado.
Otras Funciones Útiles:
- get_header(): Carga el archivo header.php del tema activo.
- get_footer(): Carga el archivo footer.php del tema activo.
- get_sidebar(): Carga el archivo sidebar.php del tema activo.
- body_class(): Agrega clases CSS al elemento body para personalizar el estilo de la página.
- wp_nav_menu(): Muestra un menú de navegación personalizado definido en el panel de admini g
- et_permalink(): Devuelve la URL permanente de la entrada actual.
- the_post_thumbnail(): Muestra la imagen destacada de la entrada actual.
- get_template_part(): Incluye un archivo de plantilla específico en el tema.
- wp_nav_menu(): Muestra un menú de navegación personalizado.
- query_posts(): Personaliza la consulta principal de WordPress.
- get_posts(): Recupera una matriz de publicaciones basada en parámetros específicos.
- stración de WordPress.
Personalización Avanzada:
- get_template_part(): Carga un fragmento de plantilla específico para reutilización y modularidad.
- dynamic_sidebar(): Muestra widgets en áreas de barra lateral definidas en el panel de administración de WordPress.
- add_theme_support(): Habilita características específicas del tema, como imágenes destacadas y menús personalizados.
- Mostrar el Título y Contenido de una Entrada:
Ejemplos de Template Tags
<?php if (have_posts()) : while (have_posts()) : the_post(); ?> <h2><?php the_title(); ?></h2> <div><?php the_content(); ?></div> <?php endwhile; endif; ?>
Este código recorre el bucle de WordPress y muestra el título y el contenido de cada entrada en tu sitio.
- Mostrar la Categoría y el Autor de una Entrada:
<?php if (have_posts()) : while (have_posts()) : the_post(); ?> <h2><?php the_title(); ?></h2> <div>Categoría: <?php the_category(', '); ?></div> <div>Autor: <?php the_author(); ?></div> <div><?php the_content(); ?></div> <?php endwhile; endif; ?>
Este código muestra el título, la categoría, el autor y el contenido de cada entrada.
WP Querys
La clase WP_Query en WordPress es una poderosa herramienta que te permite realizar consultas personalizadas a la base de datos para recuperar contenido específico, como entradas, páginas, publicaciones personalizadas, comentarios, etc. Te permite obtener contenido de WordPress de una manera muy flexible y controlada. Aquí tienes una explicación detallada de cómo funciona:
Crear una instancia de WP_Query:
Puedes crear una instancia de WP_Query pasando un array de parámetros que especifican los criterios de la consulta que deseas realizar. Aquí hay un ejemplo básico:
$args = array( 'post_type' => 'post', // Tipo de publicación a recuperar (por defecto es 'post') 'posts_per_page' => 10, // Número de publicaciones por página 'category_name' => 'noticias' // Categoría de la que recuperar las publicaciones ); $query = new WP_Query($args);
Ejecutar la Consulta:
Una vez que hayas configurado los parámetros de tu consulta, puedes ejecutarla utilizando el método query():
Iterar a través de los Resultados:
Puedes usar un bucle para iterar a través de los resultados de la consulta. Por ejemplo:
if ($query->have_posts()) { while ($query->have_posts()) { $query->the_post(); // Aquí puedes acceder a las propiedades de cada publicación the_title(); the_content(); } }
Restablecer el Post Data:
Es importante restablecer los datos del post después de utilizar WP_Query para evitar que interfiera con el resto del contenido de la página:
wp_reset_postdata();
Parámetros Comunes de WP_Query:
- post_type: Tipo de publicación a recuperar (por defecto es ‘post’).
- posts_per_page: Número de publicaciones por página.
- category_name: Nombre de la categoría de la que recuperar publicaciones.
- tag: Nombre de la etiqueta de la que recuperar publicaciones.
- author: ID del autor de la que recuperar publicaciones.
- orderby: Ordenar las publicaciones por cierto campo (fecha, título, etc.).
- order: Orden ascendente o descendente.
- meta_query: Consultar publicaciones basadas en metadatos personalizados.
Resumen:
WP_Query es una clase flexible y poderosa en WordPress que te permite realizar consultas personalizadas para recuperar contenido específico de la base de datos. Con una variedad de parámetros disponibles, puedes controlar fácilmente qué tipo de contenido deseas recuperar y cómo deseas que se ordene y presente. Esto es útil para crear páginas de archivo, bucles personalizados, listas de entradas relacionadas y mucho más.
Custom Post Types (Tipos de Entradas Personalizadas):
Los Custom Post Types te permiten definir nuevos tipos de contenido en WordPress además de las publicaciones y páginas estándar. Esto te da la flexibilidad de organizar y mostrar diferentes tipos de contenido de manera específica. Aquí hay una explicación paso a paso:
- Registrar un Custom Post Type:
Puedes registrar un Custom Post Type utilizando la función register_post_type(). Aquí hay un ejemplo básico:
function registrar_mi_post_type() { $args = array( 'public' => true, 'label' => 'Productos', 'supports' => array( 'title', 'editor', 'thumbnail', 'custom-fields' ), ); register_post_type( 'producto', $args ); } add_action( 'init', 'registrar_mi_post_type' );
Este código registra un nuevo Custom Post Type llamado “Producto” con soporte para título, editor de contenido, imagen destacada y campos personalizados.
- Mostrar los Custom Post Types:
Una vez registrado, los Custom Post Types se pueden administrar y mostrar en el panel de administración de WordPress de la misma manera que las publicaciones y páginas estándar.
- Personalizar la Presentación:
Puedes personalizar la forma en que se muestran los Custom Post Types utilizando plantillas de archivo y de entrada específicas para cada tipo.
Custom Fields (Campos Personalizados):
Los Custom Fields te permiten añadir información adicional y personalizada a tus entradas, páginas y otros tipos de contenido en WordPress. Esto es útil para almacenar metadatos específicos que no están cubiertos por los campos predeterminados de WordPress. Aquí está cómo funcionan:
- Añadir Campos Personalizados:
Puedes añadir campos personalizados utilizando la función add_meta_box() para mostrar campos adicionales en el editor de entradas o páginas. Por ejemplo:
function agregar_campos_personalizados() {
add_meta_box( ‘mi_meta_box’, // ID único del meta box ‘Información Adicional’, // Título del meta box ‘mostrar_campos_personalizados’, // Callback para renderizar el contenido del meta box ‘producto’, // Tipo de contenido al que se aplicará el meta box ‘normal’, // Contexto del meta box (normal, side, etc.) ‘default’ // Prioridad del meta box (high, low, etc.) ); } add_action( ‘add_meta_boxes’, ‘agregar_campos_personalizados’ ); function mostrar_campos_personalizados( $post ) { // Aquí puedes definir tus campos personalizados utilizando HTML o plugins de campos personalizados }
- Guardar y Mostrar los Datos:
Una vez que hayas añadido campos personalizados, puedes guardar los datos utilizando la función update_post_meta() y luego mostrarlos utilizando la función get_post_meta(). Por ejemplo:
$valor = get_post_meta( get_the_ID(), 'mi_campo_personalizado', true ); echo 'Mi Campo Personalizado: ' . $valor;
Esto mostrará el valor del campo personalizado llamado ‘mi_campo_personalizado’ para la entrada actual.
Jerarquía de Plantillas (Hierarchy Template):
La jerarquía de plantillas en WordPress es el sistema que WordPress utiliza para determinar qué plantilla se utilizará para mostrar diferentes tipos de contenido en tu sitio web. WordPress busca una serie de plantillas específicas en tu tema y utiliza la primera que encuentra según una prioridad predefinida.
Por ejemplo, si estás visualizando una entrada de blog, WordPress buscará las siguientes plantillas en orden de prioridad y utilizará la primera que encuentre:
- single-{post-type}-{slug}.php
- single-{post-type}.php
- single.php
- singular.php
- index.php
Si ninguna de estas plantillas está presente en tu tema, WordPress utilizará la plantilla predeterminada index.php.
Aquí hay una breve explicación de cada una de estas plantillas:
- single-{post-type}-{slug}.php: Esta plantilla se utilizará si estás visualizando una entrada individual de un tipo de publicación personalizada (custom post type) con un slug específico.
- single-{post-type}.php: Se utiliza para las entradas individuales de un tipo de publicación personalizada en general.
- single.php: Se utiliza para todas las entradas individuales de cualquier tipo de publicación.
- singular.php: Se utiliza para todas las entradas individuales de cualquier tipo de publicación si no hay una plantilla más específica disponible.
- index.php: Es la plantilla principal que se utiliza como último recurso si ninguna de las anteriores está presente en el tema.