Este documento explica cómo crear un tema hijo en PrestaShop 1.7.X. Un tema hijo permite modificar un tema existente sin perder la capacidad de actualizar el tema original. Los pasos incluyen instalar PrestaShop y un tema, crear un directorio para el tema hijo con archivos de configuración copiados, y luego modificar plantillas y código específico del tema hijo sin afectar al tema padre. El documento también proporciona enlaces a recursos adicionales sobre temas hijos en PrestaShop
3. ¿Qué es un tema hijo?
Los temas hijos es una característica que la comunidad de PrestaShop llevaba
solicitando desde hace varias versiones.
Básicamente, es poder modificar un tema sin perder la posibilidad de actualizar el
mismo manteniendo los cambios que hemos hecho.
El que conozca WordPress conoce bien el funcionamiento y las posibilidades que
otorga esto en la personalización de los temas.
Actualmente, PS ofrece esta posibilidad a partir de la versión 1.7.0 y SOLAMENTE
para pequeños cambios.
OJO:
El “StarterTheme” no se aconseja para estos propósitos, está pensado para
modificarlo directamente.
@ipaelo
#PrestaShopMLG
4. Pasos necesarios
Instalar PrestaShop 1.7
Instalar el tema que queramos usar en la carpeta /themes
Crear un directorio para el tema hijo y añadir el subdirectorio /config
Copiar del tema padre los archivos theme.yml dentro de /config
y preview.png en el raiz del tema hijo.
Modificar el contenido de theme.yml con el siguiente contenido:
Ir al Backoffice -> Diseño -> Theme & Logo, veremos nuestro tema hijo. Lo
seleccionamos y ya podemos empezar a modificarlo
@ipaelo
#PrestaShopMLG
5. Modificaciones Tema Hijo
¿Qué podemos modificar en un tema hijo?
PrestaShop en su documentación siempre habla de extender la funcionalidad del
tema padre.
Realmente podemos modificar totalmente los templates que queramos del tema
o módulos. Ojo: No lo he probado todo, todo, todo,...
Para modificarlos debemos copiar exactamente el mismo path del archivo que
queramos cambiar o crear y crear el archivo con el mismo nombre.
Por ejemplo:
templates/catalog/product.tpl
@ipaelo
#PrestaShopMLG
6. Modificaciones Tema Hijo
Añadir la siguiente línea de código:
{extends file='parent:catalog/product.tpl'}
Si no añadimos nada, simplemente funcionará como el padre
@ipaelo
#PrestaShopMLG
7. Modificaciones Tema Hijo
En este caso ocultaremos las combinaciones, añadiendo:
{block name='product_variants'}
<div class="card card-block">
OCULTAMOS LAS COMBINACIONES
</div>
{/block}
@ipaelo
#PrestaShopMLG