Bueno, ahora que he diseñado el nuevo theme, me ha parecido indicado el dedicarle una pequeña sección aquí. Así pues, me pongo manos a la obra para relatar cómo se puede hacer un estilo personalizado en WordPress con unos conocimientos básicos de XHTML y CSS así como con unas nociones superficiales de PHP.

Como es habitual, lo primero una introducción. WordPress maneja los themes del modo siguiente: cuando se le pide mostrar una página, accede a la carpeta del theme en cuestión. Dependiendo de qué tipo de página sea, escogerá un archivo o otro. Por ejemplo, para una página general, escogerá el archivo “index.php”, para mostrar los archivos de un mes concreto, buscará en “date.php”, y así con cada esquema. Dentro de éste fichero WordPress encontrará los enlaces a otros ficheros importantes como son el “header.php” (cabecera de la web que será común a todas las páginas mostradas), “footer.php” (lo mismo pero para el pié de página) o “searchform.php” (el formulario de búsqueda). Una vez haya importado todos los ficheros, tendrá construido un documento PHP que, sustituyendo por los datos reales de la BBDD las etiquetas correspondientes y aplicando el CSS albergado en el archivo “style.css” dará lugar al documento XHTML final mostrado en pantalla.

En primer lugar debemos armarnos de material. Lo más importante, el Codex de Wordpress. Dentro de éste tenemos dos secciones de importancia capital: Template Files, donde podremos averiguar qué nombres poner a cada fichero PHP y el Template Tags, donde podremos consultar las etiquetas que serán sustituidas por los datos reales dentro de el PHP. Una vez tengamos estas páginas a mano, es hora de hacer lo que se hace para aprender un lenguaje de programación: leer código.

Acudimos a los estilos que vienen con la instalación de WordPress. Aunque no siguen la misma estructura exacta, son muy similares. Debemos estudiar bien cómo funciona el sistema. Básicamente y de forma orientativa (pues no es el objeto por ahora de esta página el introducir en los aspectos técnicos de WordPress), el sistema carga el Header, seguidamente entra en un “Loop”, es decir un bucle while a través del cual se van mostrando todos los posts correspondientes con el formato indicado. Y finaliza con el Footer, incluyendo si existe las barras laterales, etcétera.

Aunque es obvio cabe indicar que debemos comprovar que entre el Header, Index y Footer se abran y cierren todas las etiquetas básicas del XHTML de manera correcta. Es decir, si en el Header abrimos el body, deberemos cerrarlo en el Footer, así como la etiqueta html, etcétera. Debemos imaginar los archivos como un todo continuo y trabajar como si trabajáramos sobre un extenso HTML estático.

Leyendo un poco y con práctica no será difícil crear vuestros temas personalizados. En cualquier caso, por si puede resultar útil, podré aquí las fuentes de el Theme diseñado íntegramente por mí. Debido a la condición de “mío”, agradecería profundamente que en caso de modificación para su posterior uso se incluyera la referencia al autor original, osease mi persona. Por lo demás, el código es totalmente libre exceptuando el que se use con fines lucrativos, cosa que no deseo.

Encontrareis las fuentes en tar.gz y en .zip.

Espero como siempre que ésto sea de ayuda, para cualquier duda los comentarios. Si alguien precisa que amplíe o profundice una cuestión en concreto, no hay problema. Nada hay mejor que trabajar cuando sabes que alguien lo está esperando y deseando.

Themes que han pasado por adVerecundiam