Integrar Chat Messenger y WhatsApp en Sitio Web

Documentación Plugin Chat

https://developers.facebook.com/docs/messenger-platform/discovery/customer-chat-plugin/?translation

Fontawesome (Iconos)

https://fontawesome.com/

HTML Chat WhatsApp

<a id="app-whatsapp" target="_blanck" href="https://api.whatsapp.com/send?phone=50200000&amp;text=Hola!&nbsp;me&nbsp;pueden&nbsp;apoyar?">
     <i class="fab fa-whatsapp"></i>
</a>

HTML Chat Messenger

<a id="app-messenger" target="_blanck" href="https://m.me/abelosh">
    <i class="fab fa-facebook-messenger"></i>
</a>

Estilos iconos WhatsApp y Messenger

#app-messenger, #app-whatsapp{
	position: fixed;
	right: 24px;
	bottom: 25px;
	width: 60px;
	z-index: 1000;
	display: none;
}
#app-whatsapp{
	bottom: 95px;
	display: block;
}
#app-messenger i, #app-whatsapp i{
	font-size: 63px;
}
#app-whatsapp i{
	color: #1ebea5;
}
#app-messenger i{
	color: #0084ff;	
}

Estilos Media Queries

@media screen and (max-width: 766px){
	#fb-root{
		display: none;
	}
	#app-messenger{
		display: block;
	}
}
Compartir Ahora

Comentarios

Los comentarios están cerrados.