Compartir contenido en Whatsapp usando jQuery 2 (Solo Móviles)

jQuery Tutoriales | | Comunidad: Crear un Post, Eventos Devs, Foro

Demo Github

En esta oportunidad les quiero mostrar como compartir un enlace por Whatsapp mediante uno de los mejores frameworks de javascript (jQuery).

NOTA: Para ver la demo, necesitas abrirla desde tu dispositivo móvil que cuente con la aplicación Whatsapp instalada.

estilos.css

Creamos los estilos CSS para nuestro contenido:

Listo con eso le damos los estilos a nuestro botón compartir Whatsapp ydemás contenidos.

Ahora necesitamos un botón html para poder compartir contenido:

Y también agregamos nuestra la función jquery para Compartir en diferentes dispositivos móviles:

Como verán estoy usando la función encodeURIComponent() la cual codifica un componente URI. Esta función codifica caracteres especiales. Por ejemplo, codifica los siguientes caracteres:, /? : @ & = + $ #
Listo ya hemos terminado !

NOTA: Repito de nuevo que  para ver la demo, necesitas abrirla desde tu Celular que cuente con la aplicación Whatsapp instalada.

Puedes ver la DEMO .

Puedes descargar el código alojado en nuestro repositorio Github

Sigueme en Twitter: @pepoflex
Espero les sirva de mucho este tutorial.

Newsletter

Suscríbete a Nuestro Boletín de Novedades:

(Luego de la suscripción no te va salir ningun mensaje. Solo revisa tu bandeja de Correo para confirmar tu suscripción)
* indicates required
Subscribirse
Notificar a
guest
3 Comments
antiguos
nuevos más votado
Inline Feedbacks
View all comments
trackback
Importa Código de GitHub a Visual Studio 2015 | Blog Collective Cloud Peru
5 años atrás

[…] Listo, nos aparecerá un mensaje indicando que nuestro repositorio se clono correctamente. Para este ejemplo yo clone los archivos del Tutorial: Compartir contenido en Whatsapp con jQuery. […]

trackback
Porque debes hacer pruebas de tu página web en dispositivos móviles | Buenas Prácticas de Diseño Web
3 años atrás

[…] por ejemplo el usuario decide compartirlo en WhatsApp y en nuestra web no tenemos el icono para compartir contenido en WhatsApp, este va ver nuestra web muy anticuada, poco dinámica y muy limitada para interactuar con las […]

trackback
Tu Página web en dispositivos móviles: por qué hacer pruebas
3 años atrás

[…] por ejemplo el usuario decide compartirlo en WhatsApp y en nuestra web no tenemos el icono para compartir contenido en WhatsApp, este va ver nuestra web muy anticuada, poco dinámica y muy limitada para interactuar con las […]