Aquí tenéis una manera sencilla de adaptar el botón para compartir mediante WhatsApp, utilizando un icono personalizado para integrarlo con vuestra hoja de estilos.
Pasos a seguir:
Finalmente los botones para compartir en redes sociales se ven de este modo:
Recordad que el botón para compartir mediante WhatsApp sólo es visible en iOS y Android. Si navegáis con un PC con Windows o cualquier otro sistema operativo el icono no se mostrará.
Pasos a seguir:
- Seguir la instalación tal y como se recomienda en la página WhatsApp Sharing Button Generator.
- Conseguir un icono para utilizar de botón hacia WhatsApp del mismo estilo que el resto de botones de nuestra web (En mi caso utilicé los botones de compartir en redes sociales de Simple Sharing Buttons Generator y el botón de WhatsApp lo creé con Photoshop).
- Modificar la línea de código del botón para sobrescribir los estilos por defecto:
- A la etiqueta class sólo dejar "wa_btn".
- A la etiqueta style añadir "border:none;background-color: transparent;background-image: none;".
- Entre la apertura y el cierre del enlace incluir nuestro icono. Es decir, justo antes de </a> añadir <img src="ruta hacia vuestro icono" alt="Whatsapp">
En mi caso, el código final del botón ha quedado así:
<a href="whatsapp://send" data-text="Te recomiendo participar en el foro El Club de los Gemelos" data-href="http://www.elclubdelosgemelos.com" class="wa_btn" style="width:32px;height:32px;border:none;background-color: transparent;background-image: none;display:none; "><img src="images/flat_web_icon_set/color/Whatsapp.png" alt="Whatsapp"></a>
Finalmente los botones para compartir en redes sociales se ven de este modo:
Recordad que el botón para compartir mediante WhatsApp sólo es visible en iOS y Android. Si navegáis con un PC con Windows o cualquier otro sistema operativo el icono no se mostrará.
Saludos! No me funciona en mi blogger! Mi correo es franklincorderop@gmail.com
ResponderEliminarHola Franklin,
ResponderEliminarLo vamos solucionando por email.
Atentamente,
pep
Muy buenas,
ResponderEliminarSeguramente será muy simple, preo me surge la duda: qué página de mi web debo editar concretamente?
Gracias de antemano.
Un saludo!
Hola Mariano Francisco,
EliminarPues lo primero es poner el botón siguiendo las instrucciones de "WhatsApp Sharing Button Generator". Luego, tal y como explico más arribar, buscar las líneas de código correspondientes y modificarlas.
Atentamente,
Josep