Pregunta
¿Cómo se puede personalizar el widget de Zendesk Chat con la API de JavaScript?
Respuesta
Utilice la API de JavaScript para hacer cambios y personalizaciones en el Web Widget (clásico) que está localizado en un sitio o una página.
Si es principiante, lo primero que debe hacer es averiguar si usa el Web Widget (clásico) o el fragmento de código del Web Widget en su página. Ambos ofrecen funcionalidad de chat y pueden parecer iguales al visitante del sitio.
Conocer los distintos fragmentos de código
- El fragmento de código de Chat tiene este aspecto:
<!--Start of Zendesk Chat Script-->
<script type="text/javascript">
window.$zopim||(function(d,s){var z=$zopim=function(c){z._.push(c)},$=z.s=
d.createElement(s),e=d.getElementsByTagName(s)[0];z.set=function(o){z.set.
_.push(o)};z._=[];z.set._=[];$.async=!0;$.setAttribute("charset","utf-8");
$.src="https://v2.zopim.com/?ACCOUNT_KEY";z.t=+new Date;$.
type="text/javascript";e.parentNode.insertBefore($,e)})(document,"script");
</script>
<!--End of Zendesk Chat Script-->
El ACCOUNT_KEY
es el identificador único de su cuenta. Si comenzó con una cuenta exclusiva de Chat, este es el fragmento de código que tiene.
- El fragmento de código del Web Widget es así:
<script id="ze-snippet"
src="https://static.zdassets.com/ekr/snippet.js?key=ACCOUNT_KEY"> </script>
El ACCOUNT_KEY
es el identificador único, sin embargo, este es un formato diferente al de una clave de cuenta de Chat. Si comenzó a usar su cuenta de Chat desde su cuenta de Support, esto se aplica en su caso.
La única manera de saberlo con seguridad es abrir su cuenta y verificar la página del widget para ver cuál es el fragmento exacto del widget de su cuenta.
Adición de JavaScript personalizado
El problema más común al usar nuestra API de JavaScript es que los eventos no están configurados para ejecutarse en el orden correcto. JavaScript por lo general se ejecuta de forma asíncrona en una página, de manera que si no se tiene el cuidado adecuado es posible que el comando para, por ejemplo, cambiar el color del widget se ejecute antes de que exista el widget. Por esta razón, es imprescindible agregar las funciones correctas de “listo” para tener una personalización confiable.
-
Núcleo de Web Widget (clásico)
En este caso, el código personalizado debería ser algo así:
$zopim(function(){ // Custom code here });
Este fragmento espera a que la página termine de cargarse y, luego, a que el Web Widget (clásico) termine de cargarse, antes de agregar cualquier personalización.
-
Código de Web Widget
Utilice el script siguiente:
zE(function(){ $zopim(function(){ // Custom code here }); });
En este ejemplo, el código espera a que la página se cargue, luego, a que lo haga el Web Widget y, finalmente, a que el Web Widget cargue la funcionalidad de Chat. Una vez cargado el chat, es seguro agregar las personalizaciones que desee al Web Widget (clásico).
Si desea más información, consulte los siguientes artículos: