WP desde cero (1): introducción

Primera entrada de un tutorial para hacer un tema de WordPress desde cero, en responsive design, HTML5 y microdatos.

Roy Lichtenstein

archivado en: WordPress / 24 noviembre, 2012 / taller:

WordPress es el gestor de contenidos que ha experimentado más avances últimamente. Cada vez es más flexible, sólido y escalable, sin que eso haya supuesto merma alguna en su principal virtud, la facilidad con que se maneja el panel de administración.

En este blog ya había publicado varias entradas relacionadas con WordPress, como la explicación de la API de shortcodes, los formatos de entrada o cómo programar un widget, pero aún no había tratado lo más básico, que es cómo diseñar un tema desde cero, que será el objeto de estudio de esta serie.

A lo largo de las siguientes entradas haremos un tema blanco, es decir, casi sin estilos, en HTML5, con algunos detalles de responsive design y aplicando microdatos en lugar de los habituales microformatos de WordPress.

Para desarrollar este tema necesitaremos:

  1. Un editor de código, como Notepad++.
  2. Un servidor para ir haciendo las pruebas. Si no tenemos ninguno, se puede instalar en local el servidor XAMPP.
  3. Conocimientos elementales de HTML y CSS.
  4. Bajar e instalar la última versión de WordPress.

Dos advertencias antes de empezar:

1. Si editáis el código con Notepad, acordaos de codificarlo todo en UTF sin boom.

[singlepic id=19 w=466 h=336 float=center]

2. En config.php, mientras dura el desarrollo del tema, es mejor cambiar el valor por defecto de WP_DEBUG.

  • define('WP_DEBUG', false);

y dejarlo en true.

  • define('WP_DEBUG', true);

Archivos fundamentales

En esencia, WordPress trabaja de la siguiente manera:

  1. Mediante un interfaz denominada Escritorio, también conocida como back-end, se graba la información en una base de datos.
  2. Cuando alguien se conecta a una web, WordPress extrae esa información de la base de datos, y la muestra al usuario en el front-end, la parte de adelante, de una forma u otra según el tema que esté definido. Es lo que se denomina en argot «pintar» los datos.

Para mostrar la información que ha extraído de la base de datos, WordPress usa un sistema de plantillas (templates) jerárquico, en el cual va buscando la plantilla que corresponde a cada parte de la web y, en caso de no encontrarla, pasa a buscar la inmediatamente superior. Por ejemplo, si un blog tiene la categoría «historia» definida y alguien intenta acceder a www.miblog.com/historia, primero buscará una plantilla llamada taxonomy-historia.php; si no la encuentra, buscará taxonomy.php; si tampoco existe esa, cogerá archive.php y si esta no está, usará la plantilla index.php.

En esta ilustración de wordpress.org se entiende bien el proceso:

[singlepic id=23 w=600 h=596 float=center]

Por lo tanto, para hacer un tema de WordPress, bastaría con los siguientes archivos:

  • index.php
  • style.css (las hojas de estilo)
  • functions.php (donde van las funciones)

Aunque hay muchos más, claro. Además de los tres anteriores, los más importantes son:

  • single.php: la plantilla para las entradas individuales
  • page.php: para mostrar las páginas
  • archive.php: genérica para los listados de todos los ítem que pertenecen a determinada categoría, taxonomía, tag, etcétera.
  • search.php: buscador
  • 404.php: página de error.

Ya profundizaremos en todas ellas en las próximas entradas. De momento vamos a dejarlo aquí, que luego me quedan unas toxo-entradas infumables  😆

Abrazos++;

ver todas las entradas de esta serie 

|| Tags:

valoración de los lectores sobre WP desde cero (1): introducción

  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • 4.5 sobre 5 (20 votos)

¿Te ha parecido útil o interesante esta entrada?
dormido, valoración 1 nadapensativo, valoración 2 un poco sonrisa, valoración 3 a medias guiño, valoración 4 bastante aplauso, valoración 5 mucho

Tú opinión es muy importante, gracias por compartirla!

Una respuesta a “WP desde cero (1): introducción