Tema de inicio de Tonik WordPress

Cuando se trata de trabajar con complementos de WordPress, no es raro ver a personas que usan herramientas más modernas como Composer, administración de dependencias de front-end a través de herramientas como Node, etc.

De hecho, diría que el más popular es probablemente el proyecto Sage del equipo Roots. Es genial, pero recientemente algunos amigos y yo nos topamos con el tema de inicio de WordPress de Tonik, y tuve el placer de hablar con el líder del proyecto, Patryk.

Entonces, para aquellos de ustedes que estén interesados ​​en flujos de trabajo, herramientas y estrategias más modernos y en emplearlos dentro del contexto del desarrollo de temas, creo que vale la pena echarle un vistazo a Tonik.

No me tomó mucho tiempo obtener una instancia del tema en mi máquina local. Pero el punto de esto no se trata de mi experiencia con él, es por eso que creo que vale la pena echarle un vistazo.

Tema de inicio de Tonik WordPress

Antes de entrar en la instalación real del tema, pensé que valdría la pena resaltar lo que hace que valga la pena echarle un vistazo a Tonik.

Para aquellos que estén interesados ​​en utilizar tanto la línea de comandos como las técnicas de programación orientada a objetos, el tema ofrece lo siguiente:

• interfaz de línea de comandos, para iniciar fácilmente nuevos temas,
• plantillas mejoradas con soporte para pasar datos,
• paquete web para administrar, compilar y optimizar activos,
• orientado a construir con acciones y filtros

Primero, puede ver el proyecto en GitHub, pero antes de revisar y descargar todos los diversos componentes relacionados (como Gin ), es importante tener en cuenta cómo funciona el flujo de trabajo para este tema en particular.

Es decir, no es como si lo descargara, lo instalara y estuviera listo para comenzar. En cambio, el flujo de trabajo es un poco diferente.

Empezando

Por ejemplo, para comenzar con Tonik, esto es lo que debe hacer (tenga en cuenta que todo esto supone que tiene Composer y Node instalados).

Navegue a su directorio wp-content/themes e ingrese el siguiente comando:

$ composer create-project tonik/theme acme-theme

Por supuesto, no tienes que llamarlo "tema cumbre".

A partir de ahí, deberá clonar el repositorio del proyecto desde GitHub (es por eso que no lo instala de la forma habitual de instalar temas, pero más sobre esto en un minuto):

En este punto, hay algunas dependencias más que necesita resolver. Para hacer esto, navegue hasta el directorio del tema recién creado y luego use Composer para instalar dichas dependencias.

$ composer install

Y luego instale las dependencias de front-end:

$ npm install

En este punto, todo lo que queda es crear el tema fundamental y activarlo (a través de la línea de comandos, que es donde entra en juego WP-CLI ):

$ npm run dev

$ wp theme activate acme-theme

En este punto, está listo para comenzar a usar el tema dentro de WordPress.

“Parece un poco complicado…"

Dados todos los pasos anteriores, es probable que la pregunta natural sea "¿Por qué me molestaría en hacer todo esto cuando puedo construir un tema usando la metodología normal?"

Y esa es una buena pregunta. Pero si usted es alguien que busca crear soluciones para usted o para otros usando herramientas más modernas, entonces creo que usar herramientas como esta puede ser de gran ayuda para que eso sea posible.

Todo lo que ofrece

Caso en cuestión: un punto de dolor al desarrollar plantillas para otros es la falta de un verdadero motor de plantillas en WordPress (al menos en el momento de escribir este artículo).

Pero si echa un vistazo a la documentación solo para plantillas, verá algunas cosas, como marcadores de posición  y otras formas de tratar con ciertos elementos.

Y hay mucho más incorporado en él. Me encantaría decir que probé todos los aspectos de lo que ofrece, pero siento que solo he arañado la superficie. Por ejemplo, no tuve la oportunidad de jugar con ninguna de las características de HTTP.

Aún así, aquí hay un resumen rápido de lo que ofrece todo el tema:

• una estructura de directorio preconfigurada,
• plantillas,
• soporte de componentes,
• funciones auxiliares,
• apoyo de Ajax,
• acciones y filtros de temas,
• un contenedor de servicio,
• soporte para códigos cortos,
• carga automática,
• y mucho más.

Todo esto se puede revisar en la documentación.