Etiqueta Wordpress

WordPress es una de las plataformas de administración de contenido más populares y flexibles, lo que permite a los desarrolladores crear plantillas personalizadas para sitios web. Crear una plantilla en WordPress implica comprender la estructura de archivos del tema, conocer las variables predefinidas que WordPress utiliza, y aprovechar las funciones de plantilla que están disponibles para manejar contenido dinámico. Este artículo explora en profundidad las variables y funciones clave que se usan al desarrollar plantillas de WordPress, y proporciona una descripción general de la estructura de archivos esencial para crear un tema funcional.

Estructura de Archivos en un Tema de WordPress

El desarrollo de una plantilla de WordPress empieza por organizar adecuadamente los archivos dentro de la carpeta de tu tema. Un tema de WordPress básico incluye varios archivos PHP, junto con hojas de estilo CSS, imágenes y archivos JavaScript opcionales. Aquí está la estructura mínima que un tema de WordPress debe tener:

• style.css: Archivo de estilo principal que contiene el encabezado del tema y las reglas de CSS.
• index.php: Archivo principal de la plantilla que controla cómo se muestran las páginas.
• functions.php: Archivo que permite agregar funcionalidades personalizadas y registrar soportes adicionales para el tema.
• header.php: Contiene el encabezado de la página (logo, menú, etc.).
• footer.php: Contiene el pie de página.
• sidebar.php: Contiene el contenido de la barra lateral (widgets, menús adicionales, etc.).
• single.php: Plantilla para mostrar publicaciones individuales.
• page.php: Plantilla para mostrar páginas estáticas.
• archive.php: Plantilla para mostrar listados de publicaciones, como archivos de categorías o etiquetas.
• 404.php: Plantilla que se muestra cuando no se encuentra una página.

Así mismo, podemos encontrar otros archivos destribuidos de la siguiente manera a partir de la carpeta raiz del tema wordpress:

mi-tema/ <- Carpeta principal del tema
│
├── style.css <- Archivo de estilos principal
├── index.php <- Archivo principal de la plantilla
├── functions.php <- Funciones personalizadas del tema
├── header.php <- Encabezado de la página (header)
├── footer.php <- Pie de página (footer)
├── sidebar.php <- Barra lateral (sidebar)
├── single.php <- Plantilla para publicaciones individuales
├── page.php <- Plantilla para páginas estáticas
├── archive.php <- Plantilla para archivos (categorías, etiquetas, fechas)
├── 404.php <- Plantilla para errores 404
│
├── assets/ <- Carpeta de recursos del tema (imágenes, scripts, etc.)
│ ├── css/ <- Archivos CSS adicionales
│ ├── js/ <- Archivos JavaScript
│ └── images/ <- Imágenes y recursos multimedia
│
├── template-parts/ <- Fragmentos reutilizables de plantillas
│ ├── content.php <- Plantilla de contenido (sección de publicaciones)
│ └── content-single.php <- Plantilla para una publicación individual
│
└── languages/ <- Archivos de traducción (si el tema es multilingüe)
└── mi-tema.pot <- Archivo base para traducciones

Otros archivos opcionales incluyen plantillas adicionales para publicaciones, páginas de inicio personalizadas, plantillas de búsqueda (search.php), plantillas de categorías (category.php), entre otros.

Variables Globales de WordPress

WordPress ofrece varias variables globales que pueden ser utilizadas dentro de los archivos de tu plantilla para acceder a información sobre publicaciones, páginas, usuarios, categorías y mucho más.

Algunas de las más importantes son:

• $post: Esta variable global contiene la información de la publicación o página que está siendo procesada. Incluye propiedades como ID, post_title, post_content, post_author, etc.

global $post;
echo $post->post_title;

• $wp_query: Contiene el resultado de la consulta principal de WordPress. Es una instancia de la clase WP_Query y contiene información como el tipo de contenido solicitado, la paginación, y los resultados de la consulta.

global $wp_query;
echo 'Número de publicaciones encontradas: ' . $wp_query->found_posts;

• $wpdb: Es la variable global de la base de datos, que permite ejecutar consultas personalizadas en la base de datos de WordPress usando la API de WordPress para bases de datos.

global $wpdb;
$results = $wpdb->get_results("SELECT * FROM $wpdb->posts WHERE post_status = 'publish'");

• $current_user: Contiene información sobre el usuario que ha iniciado sesión, si es que existe uno.

global $current_user;
echo 'Usuario actual: ' . $current_user->display_name;

Funciones de Plantilla de WordPress

WordPress tiene una amplia gama de funciones integradas que permiten mostrar diferentes partes del contenido. Aquí se explican algunas de las funciones más comunes y útiles para crear una plantilla de tema.

get_header()

Esta función incluye el archivo header.php, que normalmente contiene el encabezado del sitio web, incluyendo el logo, el menú de navegación y otras etiquetas de apertura de HTML como <html>, <head>, y <body>.

<?php get_header(); ?>

get_footer()

Similar a get_header(), esta función incluye el archivo footer.php, que suele contener el pie de página y las etiquetas de cierre de HTML.

<?php get_footer(); ?>

get_sidebar()

Incorpora el archivo sidebar.php, que contiene la barra lateral del sitio, donde se suelen ubicar los widgets, menús adicionales, y otras funcionalidades.

<?php get_sidebar(); ?>

the_title()

Esta función muestra el título de la publicación o página actual en el bucle de WordPress.

<?php the_title(); ?>

the_content()

Muestra el contenido de la publicación o página actual dentro del bucle de WordPress. Esto incluye texto, imágenes y cualquier otro tipo de contenido que haya sido agregado desde el editor.

<?php the_content(); ?>

the_permalink()

Devuelve la URL permanente (permalink) de la publicación o página actual.

<a href="<?php the_permalink(); ?>">Leer más</a>

wp_nav_menu()

Genera un menú de navegación dinámico utilizando las configuraciones del panel de administración de WordPress.

<?php wp_nav_menu(array( 'theme_location' => 'primary', // Nombre de la ubicación del menú registrada en functions.php 'menu_class' => 'nav-menu', // Clase CSS para el menú )); ?>

the_post_thumbnail()

Muestra la imagen destacada de una publicación o página, si está configurada. Permite pasar diferentes tamaños como parámetros.

<?php the_post_thumbnail('medium'); ?>

get_template_part()

Permite incluir partes de la plantilla desde otros archivos, como bloques reutilizables. Es útil para mantener el código limpio y organizado.

<?php get_template_part('content', 'single'); ?>
//Incluiría content-single.php

is_page(), is_single(), is_archive(), is_home(), is_404()

Estas funciones condicionales determinan el tipo de página que se está mostrando. Por ejemplo, is_page() verifica si la página actual es una página estática.

if (is_page()) {
  // Código para páginas estáticas
}

Estructura del Loop de WordPress

El Loop (bucle) es la estructura clave en WordPress que se utiliza para iterar y mostrar las publicaciones que corresponden a la consulta principal. El Loop básico de WordPress se ve de la siguiente manera:

<?php if (have_posts()) : ?>
  <?php while (have_posts()) : the_post(); ?>
    <h2><?php the_title(); ?></h2>
    <div><?php the_content(); ?></div>
  <?php endwhile; ?>
<?php else : ?>
  <p>No hay publicaciones disponibles</p>
<?php endif; ?>

• have_posts(): Verifica si hay publicaciones disponibles en la consulta.
• the_post(): Configura la publicación actual en cada iteración del bucle.
• the_title(): Muestra el título de la publicación.
• the_content(): Muestra el contenido de la publicación.

Añadir Funcionalidad a través de functions.php

El archivo functions.php se utiliza para agregar funcionalidades personalizadas a tu tema. Algunas de las cosas más comunes que puedes hacer incluyen:

Registrar Menús de Navegación

Puedes registrar menús de navegación adicionales que se pueden utilizar en diferentes partes del tema.

function register_my_menus() {
  register_nav_menus(array(
    'primary' => 'Menú Principal',
    'footer'  => 'Menú del Pie de Página'
  ));
}
add_action('init', 'register_my_menus');

Soporte para Imágenes Destacadas

Habilitar el uso de imágenes destacadas en el tema.

add_theme_support('post-thumbnails');

Encolar Scripts y Estilos

Para incluir archivos CSS y JavaScript en tu tema.

function enqueue_styles_scripts() {
  wp_enqueue_style('main-style', get_stylesheet_uri()); // Incluye el CSS principal
  wp_enqueue_script('custom-script', get_template_directory_uri() . '/js/custom.js', array('jquery'), null, true);
}
add_action('wp_enqueue_scripts', 'enqueue_styles_scripts');

Conclusión

Crear una plantilla en WordPress implica entender la estructura de archivos, las variables globales, y las funciones predefinidas que WordPress ofrece. Con esta base, puedes desarrollar temas personalizados que se ajusten a las necesidades de cualquier sitio web. Las funciones de plantilla como the_title(), the_content(), y wp_nav_menu() facilitan la interacción con los datos y la creación de una experiencia dinámica, mientras que el archivo functions.php permite agregar características personalizadas.