Mostrar marcas con índice alfabético en Prestashop 1.7

En una tienda online en la que hay varias marcas es muy útil tener una página a modo de directorio para que el usuario pueda ir directamente a la marca que está buscando, Prestashop crea está página por defecto, pero si le has echado un vistazo es posible que hayas pensado: “Sería más útil si tuviera un filtro alfabético para poder buscar por su inicial”. ¡En esta entrada te contamos como hacerlo!

Lá página de marcas por defecto es así:

Esta solución la ha proporcionado el usuario “Nemo” en la comunidad de Prestashop. Y ha sido traducido por Victor Ródenas. A nosotros nos ha servido de mucha ayuda y queremos compartirlo con vosotros!

Esto nos permite mostrar la página con el listado de marcas por orden alfabético, muy práctico a nivel de usuario y necesario para una tienda online con muchas marcas. El resultado sería este:

Nos vamos al fichero -> (es el archivo que contiene cómo se visualiza el listado de fabricantes en Prestashop 1.7)

Cambiamos su contenido por el siguiente:

{extends file=$layout} {block name='content'}

{block name='brand_header'}

{l s='Brands' d='Shop.Theme.Catalog'}

{/block} {block name='brand_miniature'}
{$current_letter = '#'} {foreach from=$brands item=brand} {$first_letter = {if $current_letter != $first_letter} {if !$first_letter|in_array:['0','1','2','3','4','5','6','7','8','9']} {$current_letter = $first_letter|upper}
{/if}
{$current_letter|upper}
{/block}
{/block}

Luego nos vamos a nuestro archivo que se encuentra en themes > (Nombre de nuestro tema classic) > assets > css >

Y pegamos este código al final del archivo:

/* Estilo Listado Fabricantes Traducción del tutorial al Español por Tutorial original en: */ .all-brands .letter-select li { float:left; } .all-brands .letter-select a { padding: 11px; font-weight: bold; font-size: 14px; display:block; } .all-brands .box-letter .box-title { width: 100%; display:block; background: #ccc; font-weight: bold; height: 40px; line-height: 40px; padding-left: 10px } .all-brands .box-letter .letter-content { line-height: 32px; padding-left: 10px } .all-brands .box-letter p { margin-bottom: 0; float: left; width: 25%; } .brands-by-letter {clear:both;}

¡Ya está listo! Nos vamos a la página de marcas y podemos ver el resultado.

Así es la página de cada marca.

Probado en Prestashop 1.7.5.1

Cómo mostrar las marcas de excelencia

En el juego, pulsa «ESC». Ve a la sección Ajustes > General y desplázate hacia abajo. Marca la casilla Mostrar marcas de excelencia Haz clic en Guardar.

¿Cómo funcionan?

Las marcas de excelencia se entregan a los mejores jugadores, por el daño causado y cambian en función de las naciones. Encontrarás más información AQUÍ.

Tres Grifería

Uso de cookies

Utilizamos cookies propias y de terceros para mejorar nuestros servicios mediante la personalización de su acceso a nuestra página, y el análisis anónimo de sus hábitos de navegación. Puedes aceptar todas las cookies pulsando el botón “Aceptar'' o configurarlas. Puedes obtener más información pulsando AQUI.

< Volver

Utilizamos cookies propias y de terceros para mejorar nuestros servicios mediante la personalización de su acceso a nuestra página, y el análisis anónimo de sus hábitos de navegación.

A continuación seleccione el tipo de cookie que desea aceptar y pulse el botón ''Guardar configuración'' para continuar:

Cookies técnicas o de configuración (obligatorias): Son las que utiliza la página web para permitir la gestión y operativa de la web. Sin estas cookies, no es posible el funcionamiento.

Sí No - Cookies de análisis o medición: Permiten el seguimiento y análisis del comportamiento del usuario. La información recogida se utiliza para la medición con el fin de introducir mejoras en función del análisis de los datos de uso que hace el usuario del servicio.

Sí No - Cookies de publicidad comportamental: Almacenan información del comportamiento del usuario obtenida a través de la observación continuada de los habitos de navegación, y permite desarrollar un perfil específico para mostrar publicidad en función del mismo.

Guardar configuración

Fernando Ruiz, Author

Post a Comment