Documentación

La documentación incluye el widget 1.2.0, los complementos de CMS 1.1.0 y la versión de API 1.2.0. Última actualización: julio de 2026.

Inicio rápido

CallFlow es un widget de devolución de llamada gratuito con cola de llamadas automática. Un visitante de su sitio web deja un número de teléfono y la solicitud se envía inmediatamente a la aplicación CallFlow de su teléfono. La puesta en marcha tarda unos minutos y consta de tres pasos:

1. Crear una cuenta - en la aplicación CallFlow para Android o posterior panel web. La cuenta es gratuita.
2. Agregar una página - En la sección 'Paquetes y páginas', agregue la dirección de su sitio web y copie la clave corta que comienza con CF-. To publiczny klucz strony (PUBLIC_SITE_KEY) — pozwala wyłącznie wysyłać nowe zgłoszenia, nie daje dostępu do Twojego konta.
3. Pega el script : coloque el siguiente código inmediatamente antes de la etiqueta </body> swojej strony i podmień klucz oraz adres polityki prywatności.

<script

  src="https://callflowdesk.com/widget/widget.js"

  data-site-key="CF-TWOJ-KLUCZ"

  data-variant="floating"

  data-privacy-url="https://twoja-strona.pl/polityka-prywatnosci/">

</script>

Ya es suficiente. Aparecerá un botón flotante en el sitio web y cada informe activará una notificación automática en la aplicación.

widget HTML/JS

El widget CallFlow 1.2.0 es un script de producción para páginas HTML normales. No requiere un marco ni bibliotecas externas. El formulario se ejecuta en un Shadow DOM aislado (no interfiere con el CSS de su sitio) y solo puede enviar nuevas solicitudes a través de la API pública CallFlow.

Instalación básica (widget flotante)

Pegar script antes </body> — dokładnie tak jak w Inicio rápido. Variante predeterminada floating wyświetla pływający przycisk w rogu ekranu, który otwiera formularz.

Variante incrustada en el contenido

Si desea colocar el formulario en un lugar específico de la página (por ejemplo, en la subpágina de contacto), agregue un contenedor vacío e indíquelo con el atributo data-target:

<div id="callback"></div>

<script

  src="https://callflowdesk.com/widget/widget.js"

  data-site-key="CF-TWOJ-KLUCZ"

  data-target="#callback"

  data-variant="box">

</script>

Variantes disponibles

• floating — pływający przycisk otwierający formularz (domyślny);
• box — pełny formularz w miejscu osadzenia;
• compact — mniejszy formularz do stopki lub sidebara;
• sticky — pasek przy dolnej krawędzi ekranu;
• ecommerce — pływający formularz przeznaczony dla karty produktu.

Puedes ver todas las variantes en vivo en el sitio web Demostración del widget.

Tabla de atributos de configuración completa

Las configuraciones de política de privacidad y urgencia también se recuperan de CallFlow. El usuario del sitio web no puede habilitar una función que haya sido deshabilitada por el propietario de la cuenta.

Seguridad y privacidad

• no lee los datos de la cuenta ni la lista de tickets;
• solo le permite crear un ticket;
• la transmisión se realiza a través de HTTPS;
• el formulario contiene un honeypot y requiere consentimiento explícito para contactar; formulario
• el widget no guarda cookies y no utiliza almacenamiento local;
• está normalizado y revalidado por API;
• tiene un tiempo de espera de 15 segundos y una clave de idempotencia para proteger contra duplicados.

Personalización de apariencia

A partir de la versión 1.2.0, el widget hereda la fuente del sitio web de forma predeterminada (inherit, awaryjnie system-ui), a wygląd można dopasować na dwóch poziomach: Fácil (atributos simples) i Avanzado (CSS de espectro completo). Los atributos de personalización se pueden colocar en la etiqueta. <script> o en el objetivo especificado por data-target (atrybut na elemencie docelowym ma pierwszeństwo). Bez tych atrybutów widget wygląda tak jak dotychczas.

Nivel fácil: colores, dimensiones, fuente

Cada atributo es opcional y se asigna a una variable CSS establecida en el elemento host del widget (.callflow-widget-host):

Ejemplo de cómo hacer coincidir el widget con el lado oscuro con detalles dorados:

<div id="callback"

  data-accent="#c8953f"

  data-accent-text="#0b0b09"

  data-bg="#11181d"

  data-text="#f4f4f1"

  data-muted="#a9b0b4"

  data-border-color="rgba(255,255,255,.14)"

  data-radius="0px"

  data-shadow="none"></div>

<script

  src="https://callflowdesk.com/widget/widget.js"

  data-site-key="CF-TWOJ-KLUCZ"

  data-target="#callback"

  data-variant="box">

</script>

Las mismas variables impregnan el Shadow DOM a través de la herencia CSS, por lo que en lugar de atributos puedes usar CSS de página pura (hoja o <style>):

#moj-kontener {

  --callflow-accent: #b8860b;

  --callflow-radius: 4px;

  --callflow-max-width: 460px;

}

Orden de precedencia: atributo data-* na elemencie docelowym → atrybut data-* na tagu <script> → zmienna CSS strony → starsze atrybuty data-*-color → wartości domyślne.

Nivel avanzado: espectro completo de CSS

::part() - Los elementos importantes del formulario tienen atributos part, więc strona może je stylować dowolnym CSS bez ograniczeń Shadow DOM. Dostępne nazwy części:

container, title, subtitle, form, field, label, phone-label, input, phone-input, urgent-field, urgent-checkbox, urgent-reason-label, urgent-reason-input, checkbox, checkbox-input, consent, consent-input, link, privacy-link, button, submit-button, status, close-button, floating-trigger, launch-button, sticky-bar, sticky-copy, action-button, config-error.

.callflow-widget-host::part(submit-button) {

  background: linear-gradient(135deg, #e0b96f, #c8953f);

  text-transform: uppercase;

  letter-spacing: .06em;

}

.callflow-widget-host::part(title) {

  font-weight: 500;

}

data-custom-css - CSS sin formato inyectado en Shadow DOM después de los estilos base (gana en cascada, afecta a los selectores de widgets internos):

<div id="callback"

  data-custom-css=".cf-panel{border:0;padding:14px} .cf-submit{letter-spacing:.06em}"></div>

data-css-href - Dirección de la hoja externa cargada en Shadow DOM. Por motivos de seguridad sólo se aceptan direcciones https:// oraz ścieżki względne; http://, javascript: i inne schematy są odrzucane.

<script

  src="https://callflowdesk.com/widget/widget.js"

  data-site-key="CF-TWOJ-KLUCZ"

  data-css-href="https://twoja-strona.pl/assets/callflow-theme.css">

</script>

Orden de estilo Shadow DOM: estilos base → hoja z data-css-href → data-custom-css. Personalizacja jest w pełni opcjonalna i wstecznie kompatybilna — istniejące osadzenia działają bez zmian.

eventos de JavaScript

El widget emite eventos en el elemento host y los propaga al documento, por lo que puede, por ejemplo, enviar una conversión al sistema de análisis después de un informe exitoso:

document.addEventListener('callflow:submitted', (event) => {

  console.log(event.detail.receiptId);

});



document.addEventListener('callflow:error', (event) => {

  console.warn(event.detail.code);

});

Eventos disponibles:

• callflow:open — formularz został otwarty;
• callflow:close — formularz został zamknięty;
• callflow:submitted — zgłoszenie zostało przyjęte (w event.detail.receiptId znajdziesz identyfikator potwierdzenia);
• callflow:error — wysyłka się nie powiodła (w event.detail.code znajdziesz kod błędu).

Complemento de WordPress

El complemento CallFlow 1.1.0 agrega un widget a todo su sitio de WordPress sin editar la plantilla. Soporta variantes floating, box, sticky i compact oraz osadzanie formularza w treści przez shortcode.

Requisitos

• WordPress 6.0 o posterior;
• PHP 7.4 o posterior (probado en PHP 7.4 y 8.3);
• clave del sitio La clave del sitio CF-… utworzony w aplikacji CallFlow.

Instalación paso a paso

1. Descargue el complemento - archivo callflow-wordpress-1.1.0.zip znajdziesz w sekcji Descargar.
2. Instalar en el panel de WordPress - ir a Complementos → Agregar nuevo complemento → Cargar complemento al servidor, señale el archivo ZIP descargado, haga clic Instalary después de la instalación Habilitar.
3. Configurar - ir a Configuración → Flujo de llamadas y:
   • pega la clave en el cuadro PUBLIC_SITE_KEY (formato CF-XXXX-XXXX);
   • seleccionar Variante (predeterminado floating);
   • ingresa la dirección Política de privacidad de su sitio;
   • cheque Habilitar el widget globalmente y haga clic Guardar cambios.

Incrustar en contenido (código corto)

Para mostrar un formulario dentro de una publicación o página, use el código corto:

[callflow variant="box"]

El uso del código abreviado desactiva automáticamente el segundo widget global en esta subpágina; el formulario nunca se duplicará.

Problemas comunes

• La clave no se guarda - el complemento valida el formato: la clave debe comenzar con CF- i zawierać wyłącznie wielkie litery, cyfry i myślniki. Skopiuj go ponownie z aplikacji, bez spacji.
• El widget no aparece en la página - campo de verificación Habilitar el widget globalmente está marcado y la clave no está vacía. Si utiliza un complemento de caché (por ejemplo, LiteSpeed, WP Super Cache), borre el caché después de guardar la configuración.
• El widget aparece dos veces - también tienes activo el complemento CallFlow para WooCommerce; ver sección WooCommerce.

Complemento WooCommerce

CallFlow para WooCommerce 1.1.0 es un complemento diseñado para tiendas; utiliza la variante ecommerce z nagłówkiem zachęcającym do pytania o produkt. Wersja 1.1.0 jest publiczną betą przeznaczoną do testów na sklepie stagingowym.

Requisitos

• WordPress 6.0 o posterior, PHP 7.4 o posterior (probado en PHP 7.4 y 8.3);
• complemento activo WooCommerce (obligatorio; sin él, el widget no se mostrará);
• clave del sitio La clave del sitio CF-… z aplikacji CallFlow.

Instalación paso a paso

1. Descargue el complemento - archivo callflow-woocommerce-1.1.0.zip z sekcji Descargar.
2. Instalar — Complementos → Agregar nuevo complemento → Cargar complemento al servidor, seleccione ZIP, Instalar, Habilitar.
3. Configurar - ir a Configuración → CallFlow WooCommerce y:
   • pegar PUBLIC_SITE_KEY;
   • seleccionar Variante: ecommerce (domyślny), floating lub sticky;
   • establece el tuyo propio Encabezado (predeterminado "¿Tiene alguna pregunta sobre el producto?");
   • cheque Habilitar el widget de la tienda y guardar.

Funciona con el complemento básico CallFlow

Ambos complementos pueden estar activos al mismo tiempo. Cuando el widget WooCommerce está habilitado, automáticamente desactiva el widget global del complemento subyacente, por lo que el formulario nunca se mostrará dos veces. Si deja en blanco el campo clave en la configuración de WooCommerce, el complemento utilizará la clave del complemento básico CallFlow.

Problemas comunes

• El widget no aparece - asegúrese de que WooCommerce esté instalado y activo; el complemento muestra el widget solo cuando se está ejecutando WooCommerce.
• Dos widgets a la vez - actualiza ambos complementos a la versión 1.1.0; Las versiones anteriores no coordinaban la visibilidad. Alternativamente, desmarque "Habilitar widget globalmente" en el complemento subyacente.
• Esto es beta : pruebe el complemento primero en una copia provisional de la tienda antes de habilitarlo en producción.

Módulo PrestaShop 8

El módulo beta de CallFlow 1.1.0 incorpora un widget de producción en el pie de página de la tienda PrestaShop (gancho displayFooter). Obsługuje warianty ecommerce, floating i sticky.

Requisitos

• PrestaShop 8.0 o posterior;
• clave del sitio La clave del sitio CF-… z aplikacji CallFlow;
• instale primero la versión beta en la tienda provisional.

Instalación paso a paso

1. Descargar módulo - archivo callflow-prestashop8-1.1.0.zip z sekcji Descargar.
2. Instalar en el panel - ir a Módulos → Administrador de módulos → Cargar módulo y apunte al ZIP descargado. Encontrarás el módulo en la categoría "Publicidad y marketing".
3. Configurar - haga clic Configurar para el módulo CallFlow y:
   • pegar PUBLIC_SITE_KEY;
   • seleccionar Variante: Comercio electrónico (predeterminado), flotante o fijo;
   • establecido Encabezado del widget (predeterminado "¿Tiene alguna pregunta sobre este producto?"; ingrese la suya en polaco);
   • por favor especifique dirección de política de privacidad tienda;
   • establecer interruptor Habilitado a "Sí" y haga clic Guardar.

Problemas comunes

• Error "La clave CallFlow debe comenzar con CF-" - el módulo valida el formato de clave; cópialo de la aplicación sin espacios.
• El widget no aparece después de guardarlo - borrar caché de la tienda (Avanzado → Rendimiento → Borrar caché) y verifique que el interruptor Habilitado esté configurado en "Sí".
• El tema no invoca el pie de página - el widget está conectado al gancho displayFooter; jeśli Twój motyw go nie renderuje, podepnij moduł do innego hooka w Apariencia → Artículos.

Otras plataformas

Las siguientes integraciones son versiones beta técnicas de 1.1.0; instálelas primero en su entorno de prueba. Encontrarás todos los paquetes en la sección Descargar.

Drupal 10/11

Después de instalar el módulo, vaya a Configuración → Servicios de red → CallFlow, pegue la clave pública del sitio y seleccione una variante.

Joomla 4/5

Después de la instalación, habilite el complemento Sistema - Flujo de llamadas (v Sistema → Complementos), pegar PUBLIC_SITE_KEY, wybierz wariant i podaj adres polityki prywatności.

Magento 2/Adobe Comercio

Copiar módulo a app/code/CallFlow/Callback, uruchom bin/magento setup:upgrade i skonfiguruj go w Tiendas → Configuración → General → CallFlow. El módulo contiene una lista blanca de CSP para el script y la API. samael.pl, więc nie musisz ręcznie modyfikować polityki bezpieczeństwa treści.

e107 2.3

Después de la instalación, abra la configuración de CallFlow, pegue la clave CF-…, wybierz wariant i włącz widget.

Correa 4/5

El complemento proporciona configuración de pod público /api/callflow/config (endpoint nie ujawnia żadnych danych konta ani zgłoszeń). Ustaw zmienne środowiskowe CALLFLOW_SITE_KEY oraz opcjonalnie CALLFLOW_VARIANT, a we frontendzie użyj:

import {mountCallFlow} from 'strapi-plugin-callflow/client';

await mountCallFlow();

Shopify

El paquete incluye código fuente Extensión de aplicación temática (aplicación incrustada para un widget flotante y bloque de aplicación con un formulario incrustado en la sección): este no es un instalador de tienda. La implementación requiere la aplicación Shopify Partner y la tienda para desarrolladores:

shopify app dev

shopify app deploy

Después de la instalación, el vendedor activa CallFlow en Configuración del tema → Aplicación incrustada o agrega un bloque de formulario a una sección de tema.

API para desarrolladores

CallFlow proporciona la versión 1.2.0 de la API REST: el mismo contrato impulsa la aplicación móvil y los widgets públicos.

Conceptos básicos

• URL base: https://callflowdesk.com/api/v1
• Autenticación: encabezado El número Authorization: Bearer <access_token> (JWT). Token uzyskasz przez POST /auth/login, a odświeżysz przez POST /auth/refresh z refresh_token.
• Sin token solo funciona: /auth/register, /auth/login, /auth/refresh oraz /public/leads.
• Errores: formato de respuestas application/problem+json z polami type, title, status, code, detail, trace_id i (dla walidacji) errors.
• Paginación: listas devuelven next_cursor; kolejną stronę pobierzesz parametrem zapytania cursor.

Auth: registro y ciclo de vida de la sesión

Cuenta - Cuenta principal, Subcuentas y estadísticas

Fuentes: sitios web y paquetes de contactos

Clientes potenciales: solicitudes de devolución de llamada y sus estados

Horario - programación de llamadas

Dispositivos - dispositivos push

Público: puntos finales para widgets

Ejemplo: iniciar sesión

curl -X POST https://callflowdesk.com/api/v1/auth/login \

  -H "Content-Type: application/json" \

  -d '{"email":"jan@firma.pl","password":"TwojeBezpieczneHaslo"}'

Responder 200 zawiera access_token (przekazuj go w nagłówku Authorization: Bearer …), refresh_token, czas życia expires_in (w sekundach) oraz obiekt user. Przykład żądania uwierzytelnionego:

curl https://callflowdesk.com/api/v1/leads?status=new \

  -H "Authorization: Bearer ACCESS_TOKEN"

Ejemplo: enviar un cliente potencial públicamente

Punto final POST /public/leads nie wymaga tokenu — identyfikuje stronę po publicznym kluczu CF-…. Nagłówek Idempotency-Key jest requerido (16-128 caracteres, por ejemplo, UUID): volver a intentar la solicitud con la misma clave no creará una solicitud duplicada.

curl -X POST https://callflowdesk.com/api/v1/public/leads \

  -H "Content-Type: application/json" \

  -H "Idempotency-Key: 4b1f2c62-9e0a-4d7c-8f5e-6a3d2b1c0e9f" \

  -d '{

    "site_public_key": "CF-TWOJ-KLUCZ",

    "phone": "+48601234567",

    "consent": true,

    "language": "pl",

    "widget_variant": "box",

    "source_url": "https://twoja-strona.pl/kontakt",

    "urgent": false,

    "website": ""

  }'

Campos obligatorios: site_public_key, phone, consent (musi być true), language i widget_variant. Pole website to honeypot antyspamowy — musi pozostać puste. Odpowiedź 202 zawiera receipt_id, accepted, message_key oraz opcjonalnie queue_position i estimated_callback_at.

aplicación de Android

La aplicación CallFlow es el centro de comando para sus llamadas: todos los informes de los widgets van aquí, usted administra las páginas, las claves y el calendario de devolución de llamadas. La aplicación aparecerá pronto en Google Play; hasta entonces, encontrará el paquete de instalación en la sección Descargar.

Características clave

• Cola de llamadas : las nuevas solicitudes se envían automáticamente al proyecto apropiado y se ponen en cola de acuerdo con las horas de trabajo y el tiempo de conversación esperado; Los estados (nuevo, en progreso, manejado, perdido, spam) organizan el trabajo.
• Horario : calendario de devolución de llamada con programación automática de la siguiente cita disponible con un solo toque.
• Notificaciones push : cada nuevo informe activa inmediatamente una notificación; Usted administra la lista de dispositivos registrados en la configuración y puede revocar el acceso a un teléfono perdido.
• Subcuentas - como propietario de la cuenta (función principal), invita a colegas (función secundaria) por correo electrónico y les asigna páginas seleccionadas; solo ven las fuentes y los informes que se les han asignado.
• Exportación de datos : exportación completa de los datos de la cuenta (páginas, informes, cronograma, consentimientos) a un archivo JSON, de acuerdo con GDPR.
• Eliminación de cuenta - eliminación permanente de la cuenta con todos los datos directamente desde la aplicación (requiere confirmación de contraseña, y para cuentas de Google - la frase "BORRAR CUENTA"); detalles en la sección Elimina tu cuenta.

Solución de problemas

El widget no aparece en absoluto

La causa más común es una clave no válida. Verifique el atributo data-site-key: klucz musi zaczynać się od CF- i składać się wyłącznie z wielkich liter, cyfr i myślników (bez spacji na początku i końcu). Otwórz konsolę przeglądarki (F12) — widget zgłasza tam problemy z konfiguracją. Upewnij się też, że skrypt jest wklejony przed </body> i że adres src nie został zmieniony.

El widget muestra el mensaje "Configuración no válida"

La clave tiene el formato correcto pero no está activa. Esto sucede cuando se genera una nueva clave (la rotación invalida la anterior inmediatamente) o la página se archiva. Vaya a los detalles del sitio web en la solicitud y copie actual clave y reemplácela en su código o configuración de complemento.

El formulario funciona, pero las aplicaciones no llegan a la aplicación

Verifique el estado del sitio en la aplicación: solo los sitios activos aceptan envíos. Una página pausada o archivada no acepta nuevos clientes potenciales. También verifique que no esté viendo informes con un filtro de estado o en una subcuenta sin acceso a esta página.

El widget aparece dos veces en WordPress con WooCommerce

Tienes ambos plugins activos: el CallFlow base y CallFlow para WooCommerce. A partir de la versión 1.1.0, el complemento WooCommerce desactiva automáticamente el widget base global; actualice ambos a la versión 1.1.0. Si el problema persiste, desmarque "Habilitar widget globalmente" en Configuración → Flujo de llamadas. Recuerda también ese shortcode [callflow] sam wyłącza widget globalny na danej podstronie.

Una tienda con un CSP restrictivo bloquea el widget

Si su sitio envía un encabezado Content-Security-Policy, agregue un dominio https://samael.pl do dyrektyw script-src (skrypt widgetu) i connect-src (wysyłka zgłoszeń do API). W Magento 2 nie musisz nic robić — nasz moduł zawiera gotową whitelistę CSP.

El widget no envía informes en localhost

Esto es intencional: campo source_url zgłoszenia wymaga prawdziwej domeny z TLD (np. .pl, .com). Adresy typu localhost czy 127.0.0.1 nie przechodzą walidacji. Testuj widget na domenie stagingowej lub tymczasowej subdomenie — formularz i wygląd możesz oczywiście podejrzeć lokalnie.

¿Cómo cambiar los colores del widget sin editar el CSS de la página?

Utilice atributos de nivel Fácil directamente en la etiqueta <script> (lub kontenerze data-target): data-accent zmienia kolor przewodni, data-bg tło, data-text kolor tekstu, data-radius zaokrąglenia. Pełna lista w sekcji Personalizacióny conjuntos listos para usar en galería de demostración.

¿Dónde puedo encontrar la clave CF de mi sitio?

En la aplicación CallFlow, abra "Paquetes y páginas", seleccione página - clave CF-… jest w jej szczegółach razem z gotowym kodem instalacyjnym do skopiowania. Możesz też wysłać sobie instrukcję instalacji e-mailem prosto z aplikacji.

No recibo notificaciones push sobre nuevos informes

Verifique que la aplicación tenga permiso para notificaciones en la configuración de Android y que su dispositivo esté en la lista de dispositivos de la aplicación y no haya sido revocado. Desactive la optimización de la batería para CallFlow si el sistema pone la aplicación en suspensión en segundo plano.

Generé una nueva clave y el widget dejó de funcionar

La rotación de clave invalida inmediatamente la anterior; esta es una característica de seguridad. Después de generar una nueva clave, actualícela en todos los lugares donde esté incrustado el widget: en el código del sitio web y en la configuración de cada complemento CMS.