Activar botón añadir carrito en Prestashop 1.7

Activar botón añadir carrito en Prestashop 1.7

Si has actualizado recientemente o has realizado una nueva instalación de Prestashop 1.7, te habrás dado cuenta que el botón de añadir al carrito en los listados de productos del tema que trae por defecto, ya no esta visible. Pero no te preocupes, aquí te voy a enseñar como volver a tenerlo con muy pocas lineas de código.

Yo soy de los que piensa que quitar el botón de “Añadir al Carrito”, “Añadir a la Cesta”, “Comprar Ahora” o como quieras llamarlo, es un gran error, no solo a nivel de usabilidad, si no también a nivel de conversiones. Con esta acción estamos alejando a nuestro usuario del proceso de compra, le añadimos un clic más a todo el proceso y seguro que habrás oído por ahí en miles de sitios que contra menos clics tenga este proceso, más probabilidades tendrás de terminar realizando la venta.

Así que, vamos al lió!! Voy a explicarte como volver a activar el botón de comprar en Prestashop 1.7.

Paso a paso botón “Añadir al carrito” en Prestashop 1.7

1. Tocando el archivo tpl

Lo primero que tendremos que hacer, es buscar el archivo product.tpl abriendo nuestro ftp y entrar en la carpeta del tema activo, en este caso “themes > classic > templates > catalog > _partials > miniatures”. Al editarlo, esto es lo que nos encontramos.

 

Aproximadamente en la linea 61, tendremos que agregar el siguiente código que hará que nuestro botón vuelva aparecer a falta de hacer los ajustes en nuestra hoja de estilos..

<form action="{$urls.pages.cart}" method="post" id="add-to-cart-or-refresh">
    <input type="hidden" name="token" value="{$static_token}">
    <input type="hidden" name="id_product" value="{$product.id}" id="product_page_product_id">
    <input type="hidden" name="id_customization" value="{$product.id_customization}" id="product_customization_id">


    <button class="btn btn-primary add-to-cart" data-button-action="add-to-cart" type="submit" {if !$product.add_to_cart_url || $product.quantity_wanted>$product.quantity}disabled{/if}>
      <i class="material-icons shopping-cart">&#xE547;</i>
      {l s='Add to cart' d='Shop.Theme.Actions'}
    </button>
</form>

2. Tocando el css

El siguiente paso, sera dejar bonito y todo cuadrado en la caja de nuestro producto ya que hasta ahora se puede ver algo descuadrado. Para ello vamos a irnos a nuestra hoja de estilos en la ruta “themes > classic >assets > css” y allí editaremos el archivo theme.css

Si no has modificado el tema anteriormente, en la linea 6146, tenemos la regla que establece los estilos de las cajas de los productos. La propiedad que tenemos que tocar es  “height: 318px;” y aumentar su altura hasta “368 px” y así poder encuadrar nuestro botón correctamente.

La siguiente y ultima regla a modificar se encuentra en la linea 6207 y pertenece a la descripción del producto. De la misma forma que en el paso anterior aumentamos el valor de la propiedad height de “70 px”  a “115 px”.

Con estos sencillos pasos, ya tenemos activos de nuevo nuestros botones de añadir al carrito y nuestra tienda online lista para aumentar sus ventas.

¿Que te ha parecido este pequeño truco para Prestashop 1.7?

Déjame un comentario con tu opinión y comentarios, seguro que me ayudaran a mejorar. ¡Nos vemos!

¿TE HA GUSTADO ESTE ARTÍCULO?0 votos, promedio: 0,00 de 50 votos, promedio: 0,00 de 50 votos, promedio: 0,00 de 50 votos, promedio: 0,00 de 50 votos, promedio: 0,00 de 5 (0 votos, promedio: 0,00 de 5, valorado)

 

Arrancamos motores

Arrancamos motores

Llevo ya mucho tiempo queriendo montar mi propio blog donde poder compartir el conocimiento que he ido adquiriendo durante los muchos años que llevo dedicado al mundo del marketing online y el emprendimiento. Es hora de devolver a la comunidad lo que esta me ha aportado en este tiempo y añadir mi granito de arena y ayudar a todos aquellos que empiezan igual que me ayudaron a mi cuando empece.

Quiero plantear este blog como una guía aportando artículos y tutoriales desde lo mas básico hasta aspectos mas técnicos y avanzados dentro de 4 grandes categorías (marketing online, analítica web, usabilidad y emprendimiento).

Marketing Online

El marketing online siempre lo defino como todas aquellas formas, técnicas o canales por los que conseguimos atraer a los usuarios de internet y generar un trafico de visitas hacia tu web o negocio online. En esta sección escribiré sobre todas las formas que uso para atraer trafico a mis paginas web o a las paginas de mis clientes como el posicionamiento orgánico en buscadores o SEO, posicionamiento de pago o PPC donde escribiré principalmente sobre Adwords y redes sociales.

Analitica Web

La analítica web es fundamental para conocer que es lo que ocurre en nuestra pagina y así poder tomar decisiones para la optimización y depuración de errores, y como consecuencia conseguir nuestros objetivos. Para mi la analítica web es una parte fundamental dentro de cualquier negocio online y hay una frase muy celebre que suelo usar en los cursos que imparto que lo demuestra y dice así:

Lo que no se define no se puede medir. Lo que no se mide, no se puede mejorar. Lo que no se mejora, se degrada siempre.

William Thomson.

Usabilidad

La usabilidad es para mi, otro de los pilares fundamentales de cualquier negocio online o pagina web, también me leerás que muchas veces la llamo “persuabilidad” pues creo que es un nombre mas acertado, pues lo que perseguimos es persuadir al usuario para que termine haciendo lo que nosotros hemos establecido como objetivo mediante la usabilidad y el diseño de nuestra web.. En la categoría de usabilidad, tratare como diseñar una web correctamente atendiendo a factores como el publico al que va dirigida, los objetivos que se pretenden alcanzar con ella y como conseguirlos mediante la psicología del diseño, las formas y los colores.

Emprendimiento

Y como no, el emprendimiento, algo que llevo en la sangre desde pequeño y que creo que compartimos en gran medida la mayoría de los que nos dedicamos a esto, el poner en marcha nuevos proyectos, nuevas ideas ilusionantes y que no siempre terminan como uno quisiera por una mala planificación inicial, un enfoque mal planteado o un estudio de mercado nulo. Así que compartiré las técnicas y pasos que sigo a la hora de abordar cualquier nuevo proyecto por pequeño que sea.

Así que arrancamos motores y me dejo de tanto escribiré, trataré y me pongo manos a la obra para transformar estas intenciones en hechos que espero te sean útiles y de interés y que me aportes el mayor feedback posible para ir moldeando este blog a tus intereses.