Códigos tutorial Chat WhatsApp Multi Agente OV DIVI

Código HTML para texto “en línea”:
<h6 style="font-size: 11px; margin-top:2px; color: #26c281;">en línea</h6>


Código HTML del icono de WA:
<i class="fa fa-whatsapp" style="font-size:25px; color: #fff"></i>


Link CDN librería FontAwesome:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">


Código HTML icono de cerrar WA:
<span class="fa fa-close" style="font-size: 18px; color: #D8F3E8;"></span>


Código jQuery para agregar la funcionalidad del chat WA:
<script>
jQuery(document).ready(function( $ ) {
$('#ov-icono-wa').click(function(){
$('.ov-chat-wa').toggleClass('mostrar-ov-chat-wa');
});
$('#cerrar-icono-wa').click(function(){
$('.ov-chat-wa').removeClass('mostrar-ov-chat-wa');
});
});
</script>


Código CSS para el chat WA:
.ov-chat-wa {
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.ov-chat-wa.mostrar-ov-chat-wa {
opacity: 1 !important;
visibility: visible !important;
}