En este tutorial vamos a ver cómo podemos colocar 3 productos por fila en el bloque de productos destacados, en vez de 4, que son los que aparecen por defecto. En realidad lo que buscamos con esto es otorgar una determinada clase CSS al último producto de una fila. Con esto conseguimos controlar con más precisión el último elemento de la fila. Veámoslo:
Como podemos ver en la imagen anterior la última etiqueta <li> tiene asignada un nombre de clase distinto (last_item_of_line) a las otras etiquetas <li>. ¿Cómo conseguimos esto? Editando el archivo prestashop/themes/tu_plantilla/modules/homefeatured/homefeatured.tpl.
Veámoslo:
Como podemos ver en la imagen anterior la línea {assign var='nbItemsPerLine' value=4} es la clave. El valor 4 logra que la clase last_item_of_line sea otorgada al 4º elemento de la fila.
El funcionamiento puede resultar un poco confuso. El número que indiquemos logra que la clase en cuestión sea otorgada cada X número de elementos, es decir, si ponemos un 2 la clase será otorgada cada dos elementos. Veámoslo:
Por lo tanto, como podemos ver en la imagen anterior, cada dos elementos se otorga esta clase, es decir, a los elementos 2º, 4º, 6, 8º… se les asignaría la clase last_item_of_line.
Si colocáramos un 3 la clase sería asignada cada 3 elementos, si fuese un 2, cada 2 elementos, y así sucesivamente.
No hay comentarios: