Storefront

En principio, para tu tienda, puedes usar cualquier tema que encuentres en el repositorio, todos serán compatibles con WooCommerce. Aunque ya comenté de pasada que mi preferido es Storefront.

Storefront es un theme para WordPress que podemos encontrar gratuitamente en el repositorio. Podriamos decir que es el tema oficial de WooCommerce, aunque esto no quiere decir que no pueda ser usado fuera de tu tienda. Está desarrollado por el mismo equipo, por lo que se integra perfectamente con este y con sus plugins. Es super-ligero, versatil, minimalista, optimizado para trabajar con tu tienda, tiene el código muy limpio y muchas otras virtudes. 

Una vez instalado y activado, (si seguiste los pasos del post anterior ya debería de estar listo para usar) no presenta un aspecto muy atractivo,  (ver imagen 1) aunque vamos a aprender a personalizarlo.

Home de Storefront
Imagen 1

Cambiar el aspecto de Storefront

 Existen muchas plantillas, algunas gratis y otras de pago, para aumentar la personalización. Pero eso lo dejaremos para otro post, de momento, para explicarte como crear y configurar la tienda no será necesario. Lo ideal, y lo que yo aconsejo,  sería instalar Storefront como tema padre y a continuación crear un tema hijo.

Storefront dispone para los desarrolladores de una increíble cantidad de hoocks que te permiten cambiar prácticamente cualquier elemento de la plantilla, como por ejemplo que aparezca o no el carrito, la cantidad de productos mostrados, etc.. Pero, en principio no tocaremos nada de código, me voy a centrar en que conozcas la opciones del customizador y quizás instalemos alguna extensión, y si te interesa, mas adelante podemos centrarnos en tutoriales mas a fondo.

Creación de un Chid Theme para Storefront

Para crear el child theme sin tocar código usarás un  plugin. Existen muchísimos en el repositorio, puede usar cualquiera de ellos. Yo he escrito en el buscador «child theme» y voy a seleccionar el primero que sale (Child Theme Configurator),  (ver imagen 2) instalar y activar.

Captura que muestra la página de plugins.
Imagen 2

Las opciones de este plugin las encontramos en Herramientas/Child Theme. Prácticamente dejas todas las opciones que vienen por defecto asegurándote, en el caso de que tengas instalados mas themes, que esté seleccionado Storefront en el desplegable (Ver imagen 3). Pulsamos «Analyze».

Configuración de Child Theme Configurator
Imagen 3

Aquí tocaremos poca cosa. En el punto 4, en mi caso, dejaré el nombre que trae por defecto, pero puedes poner el que tu elijas, esta será una carpeta que se creará donde se instalará el child theme. 

En el 7 pulsamos sobre «Show/Hide Chil Theme Atributes». Se desplegará una serie de campos (Ver imagen 4). Rellena con tus datos, en principio basta con le pongas nombre al child theme. Pulsamos en «Create New Child Theme».

Captura de configuración de plugin Child Theme Configurator
Imagen 4

Ahora si vas a Apariencia/Temas veras un nuevo theme con el nombre que le hayas dado, Solo tienes que activarlo. A partir de este momento todos los cambios que hagas los estas haciendo en el tema hijo, de forma que no perderás estos cuando se actualice Storefront.

Puedes desactivar y borrar el plugin que hayas usado para crear el child theme, ya no hace falta para nada y así tendremos una instalación mas limpia.

Dejar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *