Configurar Tema por defecto Prestashop 1.6

La plantilla por defecto incluida en la versión 1.6 de Prestashop, ofrece muy buenas posibilidades a la hora de configurar el aspecto de nuestra tienda online. Incluye una configuración bastante intuitiva y potente y quizás lo más complicado es el saber donde debemos acceder para configurar cada uno de sus elementos porque una vez situado en dichas configuraciones, el resto resulta bastante fácil. 

Configurar paso a paso el aspecto de la página principal de PrestaShop 1.6

En la siguiente imagen podéis ver el nombre de los diferentes módulos y opciones existentes para la configuración del aspecto de la página principal de su tienda online. Estos nombres os servirá de ayuda para saber en donde acceder para personalizar vuestra tienda online con vuestros datos e imágenes. 

(haz clic sobre la imagen para ampliar)


La principal opción de configuración de esta plantilla se encuentra accesible desde el backoffice de Prestashop entrando en el menú preferencias – temas y una vez allí haremos clic sobre el botón “Configurador de temas”. Al resto de opciones accedemos desde el backoffice en el menú módulos – módulos y en el buscador buscamos el nombre del módulo indicado en la imagen anterior y hacemos clic en el botón configurar. 

  • Configurador de temas – display top banner: en esta opción podemos cambiar la imagen que se muestra en la parte superior de la tienda por ejemplo para destacar alguna oferta y añadirle un enlace a la ficha del producto. También podemos utilizar este banner para ofrecer algún mensaje comercial importante en formato gráfico.
  • Módulo Bloque de contactos: en la configuración de este módulo podemos incluir el teléfono de contacto que se muestra en la parte superior de la tienda online.
  • Preferencias – temas: en esta pantalla podemos incluir el logotipo de la tienda y también el logotipo en otros tamaños para la factura o dispositivos móviles.
  • Módulo menú horizontal superior: este menú es una de los principales formas que tiene el visitante para localizar lo que está buscando. Podemos añadir categorías, productos, marcas, páginas del CMS o enlaces como por ejemplo al blog.
  • Módulo diapositivas de imágenes para tu página web: el conocido carrusel de imágenes incluye dinamismo a la tienda con la posibilidad de mostrar imágenes representativas de nuestra tienda o el tipo de producto que ofrecemos.
  • Preferencias – temas- ganchos top: desde aquí podemos incluir banners que serán mostrados junto al carrusel de imágenes.
  • Módulo bloque de novedades: muestra en la pestaña “Nuevos” de la home los productos que se ha incluido recientemente en el catálogo. Los días durante los que un producto es considerado nuevo o novedad se establece desde el menú preferencias – productos.
  • Módulos productos destacados en la página de inicio: muestra en la pestaña “Populares” de la home todos los productos asociados a la categoría “Inicio” de nuestro catálogo. La cantidad de productos a mostrar se establece desde la configuración de este módulo.
  • Módulo bloque más vendidos: muestra en la pestaña “Los más vendidos” de la home aquellos productos que han sido más veces vendidos. La cantidad de productos a mostrar se establece desde la configuración de este módulo.
  • Preferencias – temas – ganchos home: aquí tenemos más banner que podemos utilizar para promocionar categorías de productos u ofertas de productos.
  • Configurador de temas – bloque Facebook: aquí indicamos la dirección de la fan page de nuestra marca o negocio y mostrará en la home la caja de Facebook con el botón “me gusta” y la caras de los fans.
  • Configurador de temas – Display de custom CMS: desde esta opción podremos utilizar el editor de Prestashop para mostrar información sobre nuestra tienda online, formas de pago o transporte.
  • Configurador de temas – mostrar enlaces a las redes sociales: aquí indicaremos la urls de las redes sociales en las que tenemos presencia.
  • Módulo bloque categorías: muestra en el pie de la tienda online las categorías del catálogo, desde su configuración podemos indicar el número de columnas del pie de la tienda que deseamos utilizar para mostrarlas.
  • Módulo bloque CMS: activaremos las páginas del CMS que nos interesa mostrar en el pie de la tienda.
  • Configurador de temas – display your contact information: utilizamos para incluir en el pie de la tienda los datos de contacto de nuestro negocio.

Apariencia de las columnas en las plantillas PrestaShop 1.6

Las plantillas Prestashop están diseñadas para 2 o 3 columnas normalmente. En el caso de esta plantilla podemos mostrar 3 columnas, izquierda, derecha y columna central. Como se muestra en la siguiente imagen, podemos activar o desactivar cualquiera de las 2 columnas laterales en las diferentes partes de nuestra tienda online. Para ello accedemos desde el backoffice en el menú a la opción preferencias – temas y hacemos clic sobre el botón “configuración avanzada” donde haremos clic sobre los iconos que nos interese.

Posiciones de los módulos en las plantillas PrestaShop 1.6

Otra de las características de las plantillas Prestashop es que podemos mostrar los diferentes módulos o funcionalidades de la tienda en diferentes sitios o hooks. Para ello accedemos desde el menú a módulos – posiciones de los módulos, localizamos el hook que nos interesa y sobre el botón modificar podemos elegir la opción desenganchar (como indica la siguiente imagen) para que dicho módulo deje de mostrarse en la posición elegida. Desde el número o con las flechas podemos mover el módulo para situarlo en el orden que más nos interese. Además podemos utilizar la opción “Insertar un hook” para posicionar un determinado módulo en un hook en el que no se mostraba.

Personalizar fuentes y color en PrestaShop 1.6

Unas de las opciones muy demandadas en las plantillas es la posibilidad de poder personalizar la fuente de letra y los colores utilizados, sobre todo para aquellas tiendas online que deben ser fieles a la imagen corporativa de la empresa. La plantilla default de Prestashop nos ofrece esta posibilidad y podemos elegir entre unas cuantas fuentes de letra y entre 8 combinaciones de colores. No son muchas las opciones entre la que elegir pero al menos es otra forma de personalizar el aspecto sin tener que entrar a modificar el código CSS correspondiente a la plantilla lo cual puede ser complejo para muchos usuarios. Para acceder a esta opción entremos en el menú a preferencias – temas y haremos clic sobre el configurador desde donde podemos ver el “display live configurator” que utilizaremos para realizar los cambios. 

También te podría gustar...

8 Respuestas

  1. Jose Miguel Aparicio dice:

    Excelente. Me has ayudado tu más que cualquier manual de prestashop. Volviéndome loco para variar el bloque de contactos y el scroll de imágenes. Gracias!!!

  2. Genial, la mejor explicacion que encontre en todo internet, muchisimas gracias me has ayudado una barbaridad, saludos.

  3. JOSE dice:

    Excelente tutorial

    Perdona que te moleste, pero modificando el bloque CMS personalizado de la plantilla default bootstrap, he eliminado sin querer los iconos de Envíos a domicilio, Atención al cliente y Pago seguro, serías tan amable de pasarme el código fuente de este apartado, para volverlos a poner.

    Muchas gracias.

  4. Greate article. Keep writing such kind of info on your page.

    Im really impressed by it.
    Hey there, You’ve performed an excellent job.
    I will certainly digg it and in my view suggest to my friends.

    I’m confident they will be benefited from this web site.

  5. Well I truly likrd reading it. This tip procured by you is very practical for good planning.

  1. 19 abril, 2016

    […] de minutos. Otra de las ventajas de Prestashop es la plantilla básica que viene por defecto (aquí tenéis un artículo para configurarla) que nos permite tener una tienda online funcional pre-instalada y sin necesidad de tener […]

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información. ACEPTAR

Aviso de cookies