Esta semana me asignaron la tarea de integrar Tawk.to, un live chat (Gratis) para conectar con posibles clientes en tiempo real.
La comunidad de Gatsby es muy grande y al buscar en su lista de plugins encontré gatsby-plugin-tawk pero desafortunadamente en la actualidad no funciona.
Así que buscando encontré una forma de agregarlo bastante simple.
Lo primero que debemos hacer es ir tawk.to y crear tu widget.
Luego ir a gatsby-browser.js y utilizar una de sus APIs onInitialClientRender. Si no tienes este archivo puedes crearlo en tu directorio base.
Agregamos el siguiente código:
export const onInitialClientRender = () => {}
y dentro del mismo agregamos nuestro código del widget que nos suministra tawk.to de la siguiente forma, eliminando el tag script y los comments.
export const onInitialClientRender = () => {
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/{TU-KEY}/{TU-ID}';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
}
gatsby develop
y listo!
Con eso te debería de funcionar correctamente.
Top comments (0)