PrestaShop: Personalización

Modificando los banners de la portada

¡Prueba gratis durante 10 días

nuestros 1203 cursos !

Prueba gratis Mostrar modalidades de suscripción
Ahora que conocemos las bases de configuración de hooks, bloques y módulos, vamos a cambiar los contenidos de la portada añadiendo nuestros propios banners y quitando los que nos sobran de la parte superior.

Transcripción

Va a ver ocasiones en las que ocurrirá que varios elementos distintos vienen configurados por un mismo módulo en diferentes 'hooks'. Para explicar esto, aquí tengo dos "banners" que van a estar configurados desde un módulo que aparece en este 'hook', pero que también aparece en este otro 'hook'. Y es que aquí tendré otros cinco "banners". Si me voy a Live Edit, pues me encuentro con que estos dos vienen configurados por el configurador de temas, que por cierto no está dibujando bien esa línea roja, pero realmente ese configurador de temas, aquí podemos verlo que realmente son esos dos "banners", bien, pues en la parte de abajo voy a tener otro configurador de temas, aquí me los dibuja bien, que tiene eso otros cinco "banners". Vamos a ver entonces cómo configurar estos "banners". Además también, para ver cómo podemos hacer que salgan "banners" personalizados dentro de nuestra "home". Para ello tendré que, lo primero de todo, encontrar dónde están esos "banners". Así que en Módulos y servicios, en Posiciones de los módulos filtro por "display", ahora voy a buscar dónde tengo guardados esos elementos. Se trata un poco de irse moviendo y buscar el configurador de temas aquí dentro. Aquí tenemos un configurador de temas en el "display home", aquí vemos que hay uno de ellos, y el otro que está también un poco más abajo. Aquí lo tenemos: configurador de temas dentro del "display left column". Voy a irme ahora entonces para modificarlos, porque para hacer modificaciones sobre un módulo en concreto, aquí en Modificar, simplemente sirve para hacer cambios, voy a irme a Módulos y servicios y voy a buscar aquí por configurador de temas. Veremos que solamente aparece uno: Configurador de temas. Pulso en Configurar y me voy a encontrar que dentro de él es que realmente tengo la opción de trabajar con diferentes 'hooks'. Tiene muchas opciones distintas, porque sirve para configurar básicamente las opciones más importantes dentro de lo que es nuestra "home". Pero un poco más abajo, dentro de ese Configurados de temas, tengo el gancho "home" que tiene esos cinco elementos. Y luego tengo el gancho "top", que es precisamente donde estaba colocado. El "top" es el de arriba y el "home" es el de abajo. Bien, pues yo quiero que en el ancho de arriba realmente no haya ninguno de estos elementos. Eso lo haré desde otra parte. Y luego también voy a hacer que en realidad, en vez de tener cinco "banners", tenga solamente tres. Para cambiar esto, lo que puedo es ir eliminando los que me sobran, pulsando el desplegable y eliminándolos. Voy a eliminar el siguiente. Y ahora los tres que hay los voy a modificar por mis propios "banners". Selecciono Modificar, dentro de Modificar pulso en Cargar su imagen, en Examinar, selecciono Banner 1, voy a cambiarle el tamaño. Estas imágenes tienen 550 x 400 píxeles, así que voy a aplicar precisamente eso, 550 x 400 píxeles. Aquí pondría la URL a la que quisiese que fuese, a la página en concreto donde estén los contenidos que me interesen. Puedo además también añadirle código HTML. No me interesa. Pulso en Guardar. Aquí tengo ese primer "banner", voy a modificar el segundo. Vemos que tengo varios 'hooks' donde quiero añadir cualquiera de esas imágenes. En la "home", en el "top", que serían los que aparecían en la parte de arriba que quería quitar, y también puedo añadirlo sobre el "footer". O cuando trabajo con columnas, sobre cualquiera de esas dos columnas. Bien, pues selecciono esta segunda imagen. Como decía, sustituyo también del tamaño por 550 x 400. Pondría una nueva URL. También es muy importante poner el título de imagen. Eso sirve para ayudar también, por cuestiones de accesibilidad, y también para la mejora de la búsqueda dentro de los motores de búsqueda. Voy a modificar esta tercera haciendo exactamente lo mismo: voy a seleccionar esa tercera poniéndole de nuevo los 550 x 400, pondría una nueva URL, por supuesto. Puedo hacer también que cuando se haga clic sobre esa imagen me la abra en una ventana diferente. Pulsaré en Guardar. Vamos a probar a ver qué tal queda. Aquí tengo efectivamente esos tres "banners", aquí los estamos viendo. Como decía, sobre estos "banners" además ahora podría añadir código HTML. Es un poquito más complicado porque hay que escribir código HTML y que ese código HTML sea coherente con una serie de estilos, pero esto ya estaría listo. Y mi siguiente paso, si yo sé seguro que nunca más voy a utilizar ganchos "top", entonces lo que debería de hacer es irme las Posiciones de los módulos, buscar dentro de esas Posiciones de los módulos el 'hook', el gancho, "top", y dentro de él eliminar —cuando lo encuentre... aquí está, "display top Column"— ese configurador de temas, con lo cual ya no saldría ninguno nunca más. O también tengo la opción de simplemente eliminarlos y al eliminar esos dos "banners", automáticamente también desaparecerá ese espacio dentro de la web, dentro de la "home". Así conseguiré que el "slider" —voy a recargar la página— quede justo colocado encima del "tab", sin que haya ningún "banner" colocado en el medio. Bien, pues ya hemos configurado los "banners" dentro de la portada.

PrestaShop: Personalización

Haz triunfar tu tienda Prestashop aprendiendo a crear ofertas, aplicar descuentos en los envíos, o a mejorar los motores de búsqueda para que todos vean tus productos.

2:13 horas (29 Videos)
Actualmente no hay comentarios.
 
Software:
Fecha de publicación:3/10/2016

Este curso video2brain está disponible como descarga y para ser visualizado online. ¡Pero no hace falta que decidas entre las dos opciones! Al comprar el curso, disfrutarás de ambas posibilidades.

La descarga te permite ver las lecciones sin estar conectado/a a internet y supone una navegación fácil y ágil entre capítulo y capítulo. Si vas a trabajar en diferentes ordenadores o si no quieres descargarte el curso completo, entra en la web con tus datos de acceso y disfruta directamente de tus vídeos online. Te deseamos que disfrutes de este curso y te resulte de mucha utilidad.

Estamos a tu disposición si tienes cualquier tipo de duda o pregunta.