La tarjeta promocional en el chat

La tarjeta promocional permite mostrar su propia oferta en la ventana del chat, normalmente su plan de pago. Consta de una imagen, un título, un texto breve, un botón grande y un enlace de texto debajo. Aparece en la parte superior de la conversación, en la página de inicio del chat o en ambos lugares.

La tarjeta no es un mensaje: no aparece en el historial de conversación que ve su equipo y los visitantes no pueden cerrarla. El botón y el enlace de texto abren su destino en una pestaña nueva.

Configuración

Encontrará la tarjeta promocional en su cuenta, en Proyecto → Aspecto → Tarjeta promocional. La vista previa del chat en esa página muestra la tarjeta mientras escribe.

• Título: obligatorio, hasta 80 caracteres.
• Texto inferior: opcional, hasta 200 caracteres.
• Imagen: opcional, una dirección que empiece por https://. Sin imagen, la tarjeta solo contiene texto.
• Texto del botón: obligatorio, hasta 40 caracteres, por ejemplo, «Probar 30 días gratis».
• Enlace del botón: obligatorio, la página a la que lleva el botón.
• Enlace de texto: opcional, hasta 60 caracteres, por ejemplo, «Ver todos los planes». Si añade un enlace de texto, también es obligatorio indicar un destino del enlace. El widget añade por sí mismo la flecha al final.
• Color propio para el botón y el acento: si no marca la casilla, la tarjeta utiliza el color de su marca. El texto del botón se muestra claro u oscuro automáticamente para mantener la legibilidad.
• Dónde aparece la tarjeta: «En la parte superior de la conversación» y/o «En la página de inicio». Para esta última opción, la página de inicio debe estar activada.
• Quién la ve: todos los visitantes o solo visitantes sin identificar (véase más abajo).

Utilice direcciones que empiecen por https:// para el enlace del botón y el destino del enlace. El widget solo muestra el botón y el enlace de texto si su destino es https.

La tarjeta solo se puede activar cuando está completa: con título, texto del botón, enlace del botón y al menos una ubicación. Si falta algo, se guarda como borrador y su cuenta indica qué dato falta.

Los textos se aplican en el idioma predeterminado del proyecto. Tras guardar, los visitantes tardan hasta un minuto en ver el cambio.

Ocultar la tarjeta a clientes de pago

Los clientes que ya pagan no necesitan publicidad de su plan de pago. reactive.chat no conoce los planes de sus usuarios; su sitio sí. Hay tres formas de gestionarlo.

1. Destinatarios: «Solo visitantes sin identificar». Si su sitio ya identifica a los usuarios mediante ReactiveChat('identify', …) (con userId o email), estos dejan de ver la tarjeta. Es suficiente si solo sus clientes de pago tienen acceso con una cuenta.

2. Una línea en el script de su página, en cuanto sepa que el usuario paga:

ReactiveChat('promo', false);

Si esta línea puede ejecutarse antes de que se haya cargado el código de inserción, añada esto delante:

window.ReactiveChat = window.ReactiveChat || function () { (window.ReactiveChat.q = window.ReactiveChat.q || []).push(arguments); };

3. Un atributo en el código de inserción, si su servidor ya entrega una versión distinta de la página a los clientes de pago:

<script src="https://cdn.reactive.chat/loader.js"
        data-rc-site-key="SITE_KEY"
        data-rc-promo="false"
        async></script>

Ambos mecanismos de desactivación solo se aplican a la página en la que se encuentran y solo durante esa visita a la página. ReactiveChat('promo', true) vuelve a mostrar la tarjeta tal como está configurada en su cuenta.

Ajustar la tarjeta por página

En lugar de true o false, puede pasar un objeto. Sus campos sustituyen los ajustes de la cuenta en esta página; los que omita se toman de su cuenta.

ReactiveChat('promo', {
  titel: 'Annual plan: 2 months free',
  knopf: 'Switch now',
  ziel: 'https://www.your-domain.com/pricing?annual=1'
});

Los nombres de campo son los mismos que en la cuenta (están en alemán):

• titel: título (hasta 80 caracteres),
• text: texto inferior (hasta 200 caracteres),
• bild: dirección de imagen que empiece por https://,
• knopf y ziel: texto del botón (hasta 40 caracteres) y enlace del botón,
• link_text y link_ziel: enlace de texto (hasta 60 caracteres) y su destino,
• farbe: color propio en formato #rrggbb,
• orte: una lista de "gespraech" (en la conversación) y "start" (página de inicio); si ni el objeto ni su cuenta lo establecen, se aplica ["gespraech"],
• zielgruppe: "alle" (todos) o "anonym" (solo visitantes sin identificar).

También puede indicar textos por idioma, por ejemplo, titel: { en: 'Annual plan', de: 'Jahrestarif' }. Los textos más largos se acortan.

Un objeto muestra la tarjeta en esta página aunque esté desactivada en su cuenta. En ese caso, proporcione todo usted mismo: al menos titel y, para un botón, también knopf y ziel.

Impresiones y clics

En su cuenta, debajo de la tarjeta promocional, la sección Rendimiento muestra las impresiones, los clics en el botón y en el enlace de texto, y la tasa de clics: totales de los últimos 7 y 30 días y desglose por día. Por visitante y día se cuenta, como máximo, una impresión por ubicación y un clic por destino. La vista previa en su cuenta no cuenta, ni tampoco una tarjeta mostrada solo mediante ReactiveChat('promo', {...}) mientras esté desactivada en la cuenta.

Eventos para sus propios análisis

Además, dos eventos en el script de su página informan de lo que ocurre con la tarjeta, por ejemplo, para transmitirlos a su propia herramienta de análisis.

ReactiveChat('on', 'promo:shown', function (e) {
  // e.ort: "gespraech" (conversation) or "start" (start page)
});

ReactiveChat('on', 'promo:click', function (e) {
  // e.ziel: "knopf" (button) or "link" (text link), e.ort: "gespraech" or "start"
});

promo:shown se activa una vez por ubicación y visita a la página, y solo cuando la ventana del chat está abierta con la tarjeta dentro. Nadie ha visto una tarjeta dentro de un chat cerrado. promo:click se activa con cada clic en el botón o en el enlace de texto.

Si la tarjeta no aparece

• ¿Está activada? Una tarjeta incompleta permanece como borrador.
• Hasta un minuto transcurre después de guardar antes de que los visitantes vean el cambio.
• Ubicación «página de inicio»: ¿está activada la página de inicio del chat?
• Destinatarios «sin identificar»: si su sitio identifica al visitante mediante ReactiveChat('identify', …), este no ve la tarjeta.
• ¿Desactivada en esta página? Busque data-rc-promo="false" en el código de inserción y ReactiveChat('promo', false) en sus scripts.
• Falta el botón o el enlace de texto: el destino no empieza por https://.

Cómo abrir el chat desde un enlace o botón de su propio sitio se describe en Abrir el chat desde un enlace o botón propio. Los fundamentos de la inserción se explican en Insertar el widget.

Más información en la documentación

En detalle: La pantalla de inicio del chat. Todos los capítulos están en la Documentación.