Wordpress

Theme Alisios refactorizado, explicando el porqué del código

Alisios es un theme de WordPress -a partir de ahora WP- que realicé a lo largo de un mes como un proyecto personal para que sea como plantilla de futuras web.

Otra manera de llamo es theme premium, de esos que son tan personalizables y tan buenos que merece la pena pagar por ellos.

Para el diseño me basé en el theme Highwind, del cual me descargué el código y me ha servido de guía.

Ahora mismo el theme Alisios no esta disponible, ya que he querido hacer un proyecto a medio plazo con él.

El proyecto se basa en mostrar el proceso de la elaboración del theme en versiones, añadiendo funcionalidad poco a poco, a modo de enseñanza.

Para ello, me baso en commits de Github y cada versión se guarda en un branch.

Por ahora, ¿Qué tiene implementado el theme?

Poca cosa. Los templates básicos de WP, las librerías LESS, Bootstrap y Font-Awesome, los sidebars registrados y el multilenguaje habilitado.

En mis entradas anteriores, los títulos dicen claramente cómo escribir el código para habilitar esas funciones, y luego complemento sobré qué son esas funcionalidades. De tal modo que he obviado el porqué debería estar ahí esa funcionalidad.

¿Por qué usar los templates básicos de WP?

WP lee todos los themes del mismo modo, por lo tanto tiene una estructura básica que todo theme debe respetar, y eso son los templates header.php, index.php, footer.php, …

Con respecto al function.php nos tomamos la libertad de expandir su estructura para que sea más legible para el desarrolador. Esa es la razón por la que organizamos todo en la carpeta framework.

¿Por qué usar la librería LESS?

LESS solo tiene utilidad en el ámbito de desarrollo, ya que para cuando al theme se le vaya a dar un uso final, todo el código LESS se compilará a CSS.

Para un developer, usar LESS -o SASS- es una necesidad a la hora de trabajar con el diseño.

Por ello, incluir LESS nos da un gran apoyo a la hora de editar nuestro theme.

¿Por qué usar la librería Bootstrap?

Bootstrap ayuda muchísimo a los developers a la hora de diseñar nuestra interfaz web, ya que nos aporta unas estructuras HTML, LESS (CSS) y Javascript preestablecidas. Tan solo tenemos que mirar su documentación para darnos cuenta del trabajo que nos ahorra -sobretodo relacionado al responsive design.

Bootstrap tiene alternativa, como Pure o Kube; e incluso existen Bootstrap reeditados.

Al usar Bootstrap conseguiremos estructurar mejor nuestro código HTML.

¿Por qué usar la librería Font-Awesome?

Una página necesita imágenes. El 70% de las páginas se miran, no se leen.

Font-Awesome es una librería de iconos, pequeñas imágenes, que todo el mundo reconoce.

La gente ve el icono de Twitter y no necesita que la palabra ‘Twitter’ este escrita al lado. Ven un botón rojo con una papelera y entienden que ese botón sirve para eliminar algo.

Usando bien la librería Font-Awesome enriqueceremos visualmente nuestra web.

¿Por qué usar sidebars?

Un sidebar te permite colocar un widget en una zona del theme.

De este modo, cuando el contenido se muestra en el centro, lo normal es tener una barra lateral con información extra relacionada con tu página que sea útil para el lector.

A su vez, nos puede interesar poner información relevante al final de la página. En este caso he optado por poner 3 columnas, de tal modo que, dependiendo del uso que se quiera tener, se podrán visualizar 3, 2, 1 o ninguna columna en el pie de página.

¿Por qué tener un theme multilenguaje?

Nunca sabrás si tu cliente va a querer la página en inglés, en español, en alemán o en múltiples idiomas. Por lo tanto, cuantos más idiomas soporte tu theme mejor.

Por lo tanto, el código debe estar preparado para aceptar cualquier idioma.

Como mínimo, el theme Alisios soportará el inglés y el español, ya que son los dos idiomas que manejo.

¿Y que le falta al theme?

¡Ja! Más bien qué no le falta.

Actualmente puedes ver en GitHub la versión del theme Alisios v0.3.2.

A simple vista le falta el diseño bonito, el LESS. Pero entonces si solo le faltara eso no sería un theme premium 😉

No sé cuantas entradas escribiré sobre el desarrollo del theme Alisios, pero si sé que merecerá la pena.