Permite compartir productos por WhatsApp desde Prestashop

Añade un enlace WhatsApp a tu tienda Prestashop para compartir productos

Permitir a los usuarios compartir los productos de tu tienda online en Prestashop por Whatsapp añadiendo un simple enlace o botón de compartir puede hacer que los productos lleguen a nuevos usuarios y así aumentar las ventas. Para añadir el botón en cada ficha de producto solo tienes que hacer lo siguiente.

En la versión 1.6 de Prestashop:

Abre la plantilla product.tpl dentro de tu tema y busca sobre la línea 225, un código que diga:

{if isset($HOOK_EXTRA_RIGHT) && $HOOK_EXTRA_RIGHT}{$HOOK_EXTRA_RIGHT}{/if}
{if !$content_only}
<!-- usefull links-->
<ul id="usefull_link_block" class="clearfix no-print">
{if $HOOK_EXTRA_LEFT}{$HOOK_EXTRA_LEFT}{/if}

Cambialo por

{if isset($HOOK_EXTRA_RIGHT) && $HOOK_EXTRA_RIGHT}{$HOOK_EXTRA_RIGHT}{/if}
{if !$content_only}
<!-- usefull links-->
<ul id="usefull_link_block" class="clearfix no-print">
<li class="wapp"><a href="whatsapp://send?text={$product_link}"><i class="fa fa-whatsapp"></i>{l s='Share whatsapp'}</a></li>
{if $HOOK_EXTRA_LEFT}{$HOOK_EXTRA_LEFT}{/if}

Ahora añade en los estilos de tu sitio global.css, primero lo ocultamos para todas las vistas

#usefull_link_block .wapp{display:none}
#usefull_link_block .whatsapp{ font-size:14px; margin-bottom:0px; text-align:right; pointer-events: none;}
#usefull_link_block .whatsapp .fa-whatsapp{color:#42C54E;}

Y solo se muestra en dispositivos móviles

@media (max-width: 480px)
{
#usefull_link_block .wapp{display:block}
}

El icono de Whatsapp esta incluído con Font Awesome, si quieres que aparezca, incluye primero la fuente. Incluye esta línea en el head del html

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

Con esto se incluye un link en la ficha del producto del tema Prestashop o un nuevo botón para compartir el producto por whatsapp para que los usuarios puedan enviar el enlace a la ficha del producto de la tienda online, aumentando la popularidad y aumentando ventas en la tienda PS.

Descarga este artículo como un e-book

6 comentarios en “Permite compartir productos por WhatsApp desde Prestashop

  1. Hola. Muy interesante. Pero , ¿sigue funcionando? He intentado ponerlo en mi tienda y todo aparece bien, pero al pulsar el link no lleva a ninguna parte y da error.

  2. Si continua funcionando, debes abrir la tienda con tu móvil

  3. Hola,
    no entiendo bien lo de incluir primero la fuente, ¿podría explicar con mas detalle ese paso? quisiera que el icono se pueda ver,

    gracias.

  4. Gracias por el aporte
    estoy imtentando añdir un link para compartir por whatsApp un producto desde prestashop 1.6.11
    pero me gustaria poder añadir el link en la descripcion o otro apartado de texto desde el editor html
    He encontrado el codigo para abrir un chat conmigo, al pulsarlo el cliente abre mi cuenta de whatsApp y puede realizar consultas.
    ahora me gustaria hacer lo mismo para que el cliente pueda compartir el producto con sus contactos
    el codigo que utilizo para el chat es
    https://api.whatsapp.com/send?l=es&phone=(nº de telefono )
    qual seria el codigo para compartir un producto????
    gracias por tu ayuda
    saludos
    Quim

  5. Hola Jose Luis, he modificado el post para incluir la linea de código que se debe incluir en la etiqueta HEAD de la página web donde hayas incluido el enlace. En Prestashop por norma general puedes encontrar la plantilla header.tpl dentro de la carpeta themes/TUTEMA/header.tpl, alli veras la etiqueta header, incluye esta línea dentro.

  6. Quim, gracias a ti por leer el artículo. El artículo es para que los propios usuarios compartan los productos de la tienda PrestaShop con sus contactos y de esta forma difundir mejor los productos. Al realizar las modificaciones que propongo en el artículo aparece un enlace con el icono de WhatsApp en la ficha de producto, este enlace tiene la url del enlace whatsapp://send?text={$product_link}. PrestaShop remplaza {$product_link} por la URL del producto, cuando un usuario pulse sobre el enlace se abrirá su WhatsApp y podrá enviar la URL a sus contactos. Puedes utilizar esta construcción de url para crear cualquier enlace y compartir cualquier URL o otro texto que quieras enviar, simplemente cambia {$product_link} por lo que quieras enviar ¿Te referías a esto?

Deja un comentario

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

Top