Checklist para crear un tema de Wordpress y no morir en el intento

Preparando clases se me ha ocurrido escribir un "check-list", un listado de los pasos de decisiones que debemos tomar antes de crear un tema en Wordpress a partir de una propuesta de diseño y navegación del proyecto. La creación de temas para Wordpress es tan compleja como queramos por eso es importante tomar los pasos menos costosos antes de ir por los más complejos. La guia puede ser perfectamente aplicable a otros CMS como Drupal, aunque no en los detalles. Básicamente tenemos 3 maneras de crear un tema
  • Crear un tema child de cualquier otro ya existente que se adapte a nuestro diseño y modificar (sólo) el css
  • Crear un tema child de un tema "framework", como puede ser Toolbox, y modificar el css
  • Crear un tema desde cero. No derivar el tema de ningún otro y crear todas las plantillas desde cero (expertos)
Nuestro diseño define una serie de pantallas con un layout y contenidos determinadoPrimero es necesario tener clara la estructura de contenidos (tipos de contenido, etiquetas, categorias)Por tanto el checklist seria, partiendo de nuestro diseño- Existe algún tema disponible con el mismo layout que mi diseño?
  • si -> crear un tema "child" y personalizar el css como queramos. FIN
  • no -> pasar al siguiente punto
- ¿Existe algún framework que se pueda adaptar a la estructura de mi diseño?Un framework es un tema que sólo tiene "layout" pero no tiene "presentación", está "en blanco". Cada uno define regiones dinámicas diferentes (para arrastrar widgets) y además algunos permiten configurar opciones de la presentación directamente desde el panel de WPPosibles frameworks:    Toolbox, Thematic, otros frameworks: http://www.1stwebdesigner.com/wordpress/wordpress-theme-frameworks-and-…
  • si -> crear un tema "child" y personalizar el css. FIN
  • no -> pasar al siguiente punto
- ¿Es posible conseguir el layout creando algunas plantillas especiales?.Una plantilla especial nos permite: añadir contenidos que no teniamos y necesitamos, añadir divs o elementos de html que nos permitan modificar el aspecto mediante cssPara tener una plantilla especial crear un archivo con cualquier nombre y añadir un comentario dentro del php:<?php/*Template Name: Mi plantilla*/?>.. resto de códigodentro de la plantilla podemos poner lo que queramos a parte del "Loop"
  • si -> crear las plantillas especiales que queramos. FIN
  • no -> pasar al siguiente punto
- ¿Es posible conseguir el layout de pantallas que queremos modificando algunas plantillas de la jerarquia?http://codex.wordpress.org/Template_Hierarchy, por ejemplo; Category templates en el Codex http://codex.wordpress.org/Category_TemplatesLas plantillas de la jerarquia se utilizan automáticamente si existen
  • si -> crear las plantillas necesarias.FIN
  • no -> pasar al siguiente punto
Cuidado. Si existen en la plantilla “madre” deberemos copiar primero esa plantilla a nuestro “sub-tema”- ¿Podemos añadir funciones especiales en functions.php, o código especial dentro de alguna plantilla para solucionarlo? O incluso algún plugin?Algunas llamadas a la "api" de wordpress nos permiten añadir funcionalidades como zonas activas, activación de funcionalidades deWP, funciones propias para lo que queramos (avanzado, aqui si que necesitamos php)
  • si -> personalizar el código de functions.php o de alguna de las plantillas
  • no -> pasar al siguiente punto
- Crear un tema desde cero. FIN

Plantilla típica de wordpress, el loop

de http://codex.wordpress.org/The_LoopCualquier plantilla debe (o puede) utilizar el loopEl loop muestra los contenidos que corresponden a la pantalla actualUn loop muy simple seria el siguiente<!-- Start the Loop. --><?phpwhile ( have_posts() ) : the_post(); ?><!-- Display the Title as a link to the Post's permalink. --><h2><a href="<?php the_permalink() ?>" ><?php the_title();?></a></h2><!-- Display the Post's Content in a div box. --><div class="entry"><?php the_content(); ?></div><?php endwhile;  ?>Pero podemos ir añadiendo más cosas, un loop más completo:<?php get_header(); ?><!-- Start the Loop. --><?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?><!-- The following tests if the current post is in category 3. --><!-- If it is, the div box is given the CSS class "post-cat-three". --><!-- Otherwise, the div box will be given the CSS class "post". --> <?php if ( in_category('3') ) { ?>  <div class="post-cat-three"><?php } else { ?>  <div class="post"><?php } ?><!-- Display the Title as a link to the Post's permalink. --><h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title();?></a></h2> <!-- Display the date (November 16th, 2009 format) and a link to other posts by this posts author. --><small><?php the_time('F jS, Y') ?> by <?php the_author_posts_link() ?></small><!-- Display the Post's Content in a div box. --><div class="entry"> <?php the_content(); ?></div><!-- Display a comma separated list of the Post's Categories. --><p class="postmetadata">Posted in <?php the_category(', '); ?></p></div> <!-- closes the first div box --><!-- Stop The Loop (but note the "else:" - see next line). --><?php endwhile; else: ?><!-- The very first "if" tested to see if there were any Posts to --><!-- display.  This "else" part tells what do if there weren't any. --><p>Sorry, no posts matched your criteria.</p><!-- REALLY stop The Loop. --><?php endif; ?><?php get_sidebar(); ?><?php get_footer(); ?>Si queremos excluir del loop algunas categorias añadir antes del loop<?php query_posts($query_string . '&cat=-3,-8'); ?>

Requisitos para ser un buen "themer"

  • Saber algo de php (no mucho), lo necesario para poder utilizar las variables y funciones de WP
  • Saber html. En las plantillas propias deberemos añadir el html que creamos conveniente
  • Saber mucho CSS. Es la herramienta principal que usaremos para modificar el aspecto de nuestra plantilla.

Problemas típicos y su solución

La plantilla personalizada no funciona. Verificar que el contenido realmente está usando esa plantilla, por ejemplo añadiendo un mensaje de texto dentro.<strong>plantilla blah</strong>. Si no aparece este mensaje en el navegador es porqué WP no está usando la plantilla que suponemos.Tener en cuenta la jerarquia de plantillas (sino es una plantilla personalizada con "template name")Error de php. Observar que archivo y que linea especifica el mensaje de error. Puede ser porqué los delimitadores de php no están bien cerrados, por ejemplo abrir <?php sin cerrarlo  con ?> dará un error. O que existe una condición if sin cerrar. O que hay una función que no está definida. etc.Error 500. Muy a menudo se debe a errores en el servidor causados por el .htaccess (archivo que se encarga de reescribir las urls "limpias" entre otras cosas (complejo)