- Configuración de multimarca (1ra parte): Legacy Zendesk Chat (autónomo)
- Configuración de multimarca (2da parte): Integración de Zendesk Chat con Support (fase 3)
- Configuración de multimarca (3ra parte): Mejores prácticas
Si está usando la integración de Chat con Support de la fase 3 de Chat, necesitará configurar varias marcas en Zendesk y usar el Web Widget (en lugar del widget de Chat).
Paso 1: Configurar varias marcas en una cuenta de Zendesk
Su cuenta de Zendesk tiene una marca de manera predeterminada, pero puede configurar y brindar soporte para varias marcas si está en el plan Support Enterprise.
Lea nuestra guía sobre la configuración de varias marcas en Zendesk.
Paso 2: Agregar el Web Widget a sus marcas en Zendesk
El Web Widget admite la función multimarca. Funciona así:
- Un cliente puede tener un Web Widget por marca
- Cada Web Widget consiste en:
- Un fragmento de código único (para ir al sitio web de la respectiva marca)
- Un conjunto de personalizaciones o configuraciones para ese widget
- Todos los Web Widget (de las diversas marcas) tienen una cuenta de Zendesk Chat en común. El nombre específico de una marca pasa como etiqueta a Chat y se muestra en la ventana de chat del agente (para dar contexto). Se ve así:
Paso 3: Desviar chats a un departamento usando el Web Widget
Una vez que tenga activado el Web Widget para cada una de sus marcas, necesita configurar su cuenta de Zendesk Chat para admitir todas las marcas.
Al igual que el widget de Zendesk Chat, después de crear los departamentos y de agregar agentes, necesita usar nuestra API de JavaScript para desviar automáticamente los chats entrantes del sitio web de cada una de sus marcas al departamento correspondiente.
Este es el script de la API que necesitará agregar a las páginas de su sitio web.
<script>
window.zEmbed||function(e,t){var n,o,d,i,s,a=[],r=document.createElement("iframe");window.zEmbed=function(){a.push(arguments)},window.zE=window.zE||window.zEmbed,r.src="javascript:false",r.title="",r.role="presentation",(r.frameElement||r).style.cssText="display: none",d=document.getElementsByTagName("script"),d=d[d.length-1],d.parentNode.insertBefore(r,d),i=r.contentWindow,s=i.document;try{o=s}catch(c){n=document.domain,r.src='javascript:var d=document.open();d.domain="'+n+'";void(0);',o=s}o.open()._l=function(){var o=this.createElement("script");n&&(this.domain=n),o.id="js-iframe-async",o.src=e,this.t=+new Date,this.zendeskHost=t,this.zEQueue=a,this.body.appendChild(o)},o.write('<body onload="document._l();">'),o.close()}("https://assets.zendesk.com/embeddable_framework/main.js","mysubdomain.zendesk.com");
zE(function() {
$zopim(function() {
$zopim.livechat.setOnConnected(function() {
var department_status = $zopim.livechat.departments.getDepartment('Obscura');
if (department_status.status == 'offline') {
// Configurar el estado de la cuenta como "desconectado"
$zopim.livechat.setStatus('offline');
// Ocultar el widget o similares
$zopim.livechat.hideAll();
} else {
// El departamento está conectado (al menos un agente de ese departamento está conectado)
// Agregar automáticamente una etiqueta
$zopim.livechat.addTags('Obscura');
// Ocultar la opción de la lista desplegable en el formulario previo al chat para seleccionar el departamento
$zopim.livechat.departments.filter('');
// Configurar el departamento automáticamente
$zopim.livechat.departments.setVisitorDepartment('Obscura');
}
});
});
});
</script>
La diferencia principal es que el Web Widget detecta automáticamente si el departamento correspondiente está desconectado y solo ofrece el formulario de contacto. El resto del script permanece casi igual.
Paso 4: Personalizar el Web Widget
Al igual que el widget de Zendesk Chat, es conveniente personalizar el Web Widget para adaptarlo a su marca.
Puede usar los mismos comandos de la API como se describen más arriba, pero necesitará agregar el siguiente fragmento de código:
$(document).ready(function() {
Esto inicia las API del Web Widget y de JavaScript, y hace sus cambios de personalización:
El resto del script de la API es similar al que usamos para personalizar el widget:
zE(function() {
// API de Zendesk Chat
$zopim(function() {
$zopim.livechat.theme.setColors({badge: ‘#FFFFFF‘, primary: ‘#000000‘});
$zopim.livechat.theme.reload(); // aplicar nueva configuración del tema
});
// Fin de la API de Zendesk Chat
});
});
Siguiente: Configuración de multimarca (3ra parte): Mejores prácticas
0 Comentarios
Inicie sesión para dejar un comentario.