Cómo agregar el botón de “Compartir en WhatsApp” a tu sitio móvil

Recientemente, WhatsApp ha liberado la funcionalidad para que podamos agregar un botón de “Compartir” en nuestro sitio y linkee automáticamente nuestro contenido hacia los contactos del famoso mensajero propiedad de Facebook.

La efectividad de este botón se explica por sí sola, y en este breve tutorial te mostraré cómo agregar el botón de “Compartir en WhatsApp” a tu propio sitio:

share on whatsapp button

 

 

 

 

Aquí podemos ver un ejemplo del botón de “Compartir en WhatsApp”.

 

Cómo agregar el botón en cualquier sitio: Método HTML:

 

Simplemente, debemos copiar y personalizar el siguiente código:

 

<a href=”whatsapp://send” data-text=”Cómo crear el botón de Compartir en WhatsApp en tu sitio:” data-href=”” class=”wa_btn wa_btn_s” style=”display:none”>Compartir</a>

 

La parte más importante es el href que linkea a “whatsapp://send”. Luego, data-text define el texto con el que saldrá el link. En este caso, es “Cómo crear el botón de Compartir en WhatsApp en tu sitio:”. El siguiente parámetro, data-href, hace referencia a qué link será el que se comparta. Si dejamos el campo en blanco, automáticamente se comparte como link la URL que estamos visitando. Por último, class y style lo deberemos personalizar nosotros para darle estilo al botón.

 

Cómo agregar el botón de “Compartir eh WhatsApp”: Método dinámico en WordPress

<a href=”whatsapp://send?text=<?php the_title(); ?> – <?php urlencode(the_permalink()); ?>” data-action=”share/whatsapp/share” >Compartir en WhatsApp</a>

De esta manera, el texto a compartir es automáticamente el título del post, el link es el permalink asignado y el texto del botón es “Compartir en WhatsApp”. Atención! A este método, debemos agregarle diseño a gusto mediante style y class.

Eso es todo

7 pensamientos sobre “Cómo agregar el botón de “Compartir en WhatsApp” a tu sitio móvil

  1. Mercado

    No puedo conseguir insertar el boton de WhatsApp en Mis Blogspot; Mucho te Agradecere si me lo explicas paso a paso.

    P:D: Mi blog lo tengo solo para web, Para movil lo tengo Cancelado o Inavilitado, se ve mejor en web, la plantilla para celulares es la que inavilite; cual seria tu opinion?

    Saludos.

  2. carlos ramirez

    pregunta es posible que yo al compartir la pagina por whatsapp le puedo yo personalizar el color del link que se vera reflejado en whatsapp

  3. Profesor Yeow

    Es muy buena opción, adicionalmente se puede combinar con un jscript para que valide si esta en una versión móvil (o con un CSS responsive) y solo sea visible alli.

    Lo que no logro hacer, es definir que mande el mensaje a un numero en particular predefinido.

Deja un comentario

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