Es una traducción del artículo de Vekia de la Comunidad de Prestashop donde nos comenta la posibilidad de mostrar los bloques de página principal referentes a Productos Destacados, Nuevos Productos, Promociones, etc.. de la misma forma que se visualiza en Prestashop 1.6.
En Prestashop 1.7 (al menos en la versión 1.7.0.3) los bloques de Nuevos, Populares, etc.. no se visualizan en formato de pestañas.
Vekia, nos propone las siguientes modificaciones, para conseguir que se vean en el mismo formato que lo veíamos en Prestashop 1.6
Paso 1 – Crear Hooks
Nos proporciona su módulo, creador de «Hooks», que podemos descargarlo gratuitamente desde aquí: Descargar Módulo
Con este módulo vamos a crear dos «hooks»:
displayHomeTab y displayHomeTabContent
Paso 2 – Editar Fichero TPL
Editamos el fichero:
/themes/classic/templates/index.tpl
En el que Vekia nos propone cambiar el siguiente contenido:
[sourcecode language=»text»]
{extends file=’page.tpl’}
{block name=’page_content_container’}
{block name=’page_content’}
{$HOOK_HOME nofilter}
{/block}
{/block}
[/sourcecode]
Por el siguiente:
[sourcecode language=»php»]
{extends file=’page.tpl’}
{block name=’page_content_container’}
{block name=’page_content’}
{$HOOK_HOME nofilter}
{assign var=’HOOK_HOME_TAB_CONTENT’ value=Hook::exec(‘displayHomeTabContent’)}
{assign var=’HOOK_HOME_TAB’ value=Hook::exec(‘displayHomeTab’)}
{if isset($HOOK_HOME_TAB_CONTENT) && $HOOK_HOME_TAB_CONTENT|trim}
{/if}
{/if}
{/block}
{/block}
[/sourcecode]
En realidad, si nos estamos «fijando» hemos sustituido todo el contenido del fichero…
Antes:
Ahora:
Paso 3 – Editar JS Y CSS
Modificamos el fichero:
themes/classic/assets/js/custom.js
Y añadimos al final del fichero esto:
[sourcecode language=»text»]
$(document).ready(function(){
$(‘#home-page-tabs li:first, #index .tab-content .tab-pane:first’).addClass(‘active in’);
});
[/sourcecode]
Por defecto, no aparece «ninguna» pestaña activa, con este código lo que hacemos es que aparezca «activa«.
El último paso es ir al fichero:
/themes/classic/assets/css/theme.css
y al final añadir el siguiente código:
[sourcecode language=»css»]
#index .tabs {padding:0px}
#index #home-page-tabs {margin:0px 10px; padding:10px 0px 0px 0px;}
[/sourcecode]
Cómo parece que por defecto los módulos en cuestión en Prestashop 1.7 (1.7.0.3), no vienen preparados para adaptarse al formato de «pestaña», Vekia nos proporciona desde su web, poder descargarlos:
Módulos Productos Destacados / Populares (Formato Pestañas) -> Descargar
Módulo Mejores Ventas (Formato Pestañas) -> Descargar
Guía basada en Prestashop 1.7.0.3
La guía original actualizada (que posiblemente se actualice en referente a errores), la tenéis aquí: Guía Original
