Crear o modificar temas para WordPress es una tarea común para cualquier desarrollador web, por ello entender la estructura y la función de los archivos facilitará el trabajo con temas de WordPress.
WordPress Theme
Un Tema de WordPress (WordPress Theme) permite dar apariencia y agregar funcionalidades específicas a un sitio de WordPress, esta compuesto por: archivos CSS para modificar la apariencia, archivos Javascript para agregar interacciones y archivos PHP para generar el contenido usando métodos de WordPress.
Anatomía de un Tema
Los archivos de un tema se ubican en una carpeta, ubicada en wp-content/themes/, esta carpeta puede tener cualquier nombre que identifique nuestro tema.
Archivos base:
style.css | Contiene el nombre, la descripción y los estilos del tema. |
screenshot.png | Imagen de 1200×900 pixels con el diseño del tema. |
index.php | Template principal que contiene el listado de últimos artículos. |
functions.php | Archivo para configurar y agregar funcionalidades al tema. |
Archivos globales:
header.php | Contiene el encabezado y la navegación del tema. |
footer.php | Contiene el footer o la parte inferior del tema. |
sidebar.php | Contiene el contenido lateral o adicional del tema. |
comments.php | Contiene el formulario y la lista de comentarios. |
404.php | Pantalla de error cuando no existe el contenido solicitado. |
Archivos para lista de contenido:
category.php | Muestra el listado de artículos de una categoría. |
tag.php | Muestra el listado de artículos de una etiqueta |
taxonomy.php | Muestra el listado de artículos de una taxonomía. |
author.php | Lista de artículos de un mismo autor. |
date.php | Lista de artículos para un determinada fecha. |
archive.php | Lista de artículos de una categoría, etiqueta, autor, etc. |
search.php | Lista con los resultados de una búsqueda. |
Archivos para detalle de contenido:
single.php | Contiene el detalle de un artículo o un post-type. |
single-{post-type}.php | Contiene el detalle de un post-type. |
page.php | Template para el detalle de una página. |
image.php | Se usa para mostrar el contenido de una imagen. |
Estructura de ejemplo
Ahora que conocemos cuales son los archivos necesarios, podemos crear nuestro primer tema, para ellos necesitaremos los siguientes archivos:
- style.css: define el nombre, la descripción los estilos.
- screenshot.png: es la imagen del diseño del tema.
- functions.php: contiene los métodos propios del tema.
- header.php: contiene el header con el menú de navegación.
- footer.php: contiene el footer del tema.
- index.php: pantalla inicial con el listados de los últimos artículos.
- archive.php: contiene el listado de artículos por categoría.
- single.php: muestra el contenido completo del artículo.
- images/: carpeta para almacenar las imágenes.
- scripts/: carpeta para almacenar los archivos javascript.
- styles/: carpeta para almacenar los archivos css.
Todos estos archivos los ubicaremos en una carpeta nombrada a nuestro gusto (ejemplo: kodetop) y ubicada en la ruta /wp-content/themes/.
Recomendaciones
Con esta información en mente no es complicado crear un tema, pero es importante algunas recomendaciones.
- Se recomienda tener el diseño completo en HTML, CSS y Javascript con todas las interacciones y validaciones antes de integrarlo con WordPress.
- Todos los métodos, constantes y configuración se deben realizar en el archivo
functions.php, evitar agregar funciones en los archivos de template. - Se pueden organizar los archivos estáticos en carpetas, de esta forma se facilita el entendimiento y orden del proyecto.
- Se recomienda implementar un tema desde cero, esto para evitar tener archivos y métodos sin utilizar.
Comentarios