Aprende a ser un desarrollador WordPress profesional paso a paso

En los últimos años WordPress se ha convertido en una de las mayores plataformas para crear proyectos web, evolucionando desde un CMS para crear tu blog, a soportar la creación de foros, páginas de e-commerce, etc. Esto es debido a que es una plataforma muy flexible, gratuita y con una gran comunidad que la mantiene y desarrollo innumerables plugins y temas. Sin embargo, el puesto de desarrollador WordPress profesional todavía es muy importante en proyectos donde el cliente quiere una personalización completa de su sitio. En esta guía, te mostraré las principales cosas que debes conocer para alcanzar ese nivel.

¿Qué es un desarrollador WordPress profesional?

Hay muchos desarrolladores que trabajan con WordPress, que no son profesionales, ya que se limitan a instalar el CMS, configurarlo con un buen puñado de plugins e instalar un tema (de pago o gratuito) del gusto del cliente. Algunos, además realizan una pequeña personalización con CSS de este tema, para mejorar su aspecto. Sin embargo, esto dista mucho de lo que se busca en un desarrollador WordPress profesional.

Además de la optimización de WordPress, que siempre es necesaria, un buen desarrollador tiene principalmente dos cometidos:

• Desarrollar módulos o plugins para conseguir aquella funcionalidad específica del cliente.
• Crear el mejor tema posible para cada cliente.

Como puedes ver, la principal diferencia entre los profesionales y los que no lo son, es que los primeros crean, mientras que los segundos instalan. Esto no quiere decir que un profesional no use plugins y todo lo tenga que desarrollar desde cero.

¿Qué formación es necesaria para convertirse en un profesional del desarrollo WordPress?

La formación siempre suele ser un tema espinoso, ya que cada autor considera algunas cosas más imprescindibles que otras. Aquí voy a intentar resumir cuáles son las principales y qué nivel debes alcanzar en cada una.

Lenguajes para desarrollar con WordPress

Analizando cómo está desarrollado WordPress, rápidamente empiezan a aparecer varios lenguajes que se deben conocer:

• En primer lugar, es necesario conocer PHP ya que es el lenguaje en el que está escrito WordPress y en el que se desarrollando todos sus módulos. El nivel de PHP necesario sería el conocimiento de la programación estructurada con PHP.
• El lenguaje SQL también va tener cierta importancia, para poder manejar y gestionar la base de datos (principalmente en el desarrollo de plugins).

Además de los lenguajes anteriores, que forman el back-end de WordPress, si se quieren desarrollar temas, serán necesarios conocer los lenguajes del front-end:

• El lenguaje HTML como base para la estructuración de la web, teniendo también presente las nuevas etiquetas de HTML5 como: main, aside, etc. Además, es importante añadir las propiedades necesarias para conseguir que los buscadores entiendan los denominados “datos estructurados“.
• La tecnología CSS, para dar estilo y conseguir una apariencia perfecta en el tema desarrollado.
• El lenguaje JavaScript, para añadir algunas características interactivas o efectos, en el tema desarrollado.

Tecnologías para desarrollar con WordPress

Aunque en la sección anterior se ha abordado los principales lenguajes necesarios para desarrollar con WordPress, estos no son suficientes si lo que se busca es alcanzar un grado de calidad elevado, y por tanto, convertirse en un autentico desarrollador WordPress profesional.

El primer paso para usar la mayoría de las siguientes tecnologías, va a ser instalar y aprender lo más básico de Node.js. Esto es debido a que gran parte de la automatización en el desarrollo, va a ser debida a distintos desarrollos realizados en JavaScript que corren bajo Node.

El segundo paso va a ser elegir un gestor de tareas, la necesidad del mismo radica en que se van a manejar algunas tecnologías, cuyos archivos tienen que ser procesados antes de poder ser utilizados. Aunque Grunt y Gulp han sido los más conocidos, últimamente la mayoría de los desarrolladores están migrando ambos a Webpack.

Una vez tenemos lo anterior, seguramente te interesará potenciar el código CSS con alguna extensión, como LESS o SASS (el más usado actualmente). Las principales ventajas de su uso son:

• La utilización de variables
• La reutilización del código
• El desarrollo modular
• El soporte para realizar cálculos

Sin embargo, tienen una pega, sus archivos deben ser preprocesados y convertidos a CSS puro, para que los navegadores los puedan entender.

Otra cuestión que se está volviendo cada vez más popular es utilizar algún framework de JavaScript para crear parte de la interfaz de usuario. Los más usados son Angular, React y Vue y, como en el caso anterior, también exigen el uso de algún preprocesador para poder ser utilizados.

El desarrollo de un tema para WordPress

Mientras que el desarrollo de plugins es un proceso muy estructurado, el desarrollo de un tema se puede afrontar desde distintas perspectivas:

• Creación de un tema hijo basado en un tema ya creado
• Realización del tema basado en un tema “plantilla”
• Programación del tema desde cero

En mi opinión, programar un tema desde cero es un proceso que está sujeto a cometer muchos errores. Por ello te recomiendo, para conseguir un acabado profesional desarrollar sobre un tema “plantilla”. El uso de temas ya creados presenta algunos problemas, en la mayoría de los casos, como páginas lentas, uso de muchos recursos o la necesidad de sobreescribir gran cantidad de los estilos.

Respecto a los temas “plantilla”, estos te ayudan a partir de un esqueleto realizado en HTML, donde ya incluyen multitud de propiedades y elementos de marcado de manera automática. Algunos de estos temas “plantilla” son:

• Underscores, un tema base desarrollado por Automattic (uno de los principales desarrolladores sobre WordPress).
• Sage, uno de los principales temas base, utilizado por ejemplo para realizar esta página web.

Recursos para desarrollar un tema para WordPress

A continuación te dejo algunos de los mejores recursos para mejorar tu desarrollo:

• Una vez que tienes tu instalación de WordPress, esta viene sin artículos y contenido con el que probar cómo se ve tu tema. Por lo que es muy útil utilizar el siguiente recurso para cargar un gran número de entradas. Esto te permitirá trabajar con una instalación muy similar a un blog real.
• El uso de WP-CLI te ayudará a instalar y configurar de una manera muy rápida una instancia de WordPress.
• El plugin Developer de Automattic te será de gran ayuda en el desarrollo.
• La siguiente guía te proporciona una chuleta con las principales partes de un tema.
• Comprime todas las imágenes bien usando un programa, o configurando de manera adecuada webpack.
• En producción utiliza siempre un único fichero que junte todos los CSS y los minifique. Haz lo mismo, en el caso de JavaScript.
• Utiliza la opción de recargar al cambiar un archivo, ya sea en tu gestor de tareas (webpack, gulp, grunt…) o mediante un módulo.

Espero que esta guía te ayude, y si crees que debería ampliarla con algún otro concepto, espero tu comentario.