Documentație

Documentația include widget-ul 1.2.0, pluginuri CMS 1.1.0 și versiunea API 1.2.0. Ultima actualizare: iulie 2026.

Pornire rapidă

CallFlow este un widget gratuit de apel invers cu coadă automată de apeluri. Un vizitator al site-ului dvs. lasă un număr de telefon, iar solicitarea ajunge imediat la aplicația CallFlow de pe telefon. Pornirea durează câteva minute și constă în trei pași:

1. Creați un cont - în aplicația CallFlow pentru Android sau o versiune ulterioară panou web. Contul este gratuit.
2. Adăugați o pagină - În secțiunea „Pachete și pagini”, adăugați adresa site-ului dvs. web și copiați cheia scurtă începând cu CF-. To publiczny klucz strony (PUBLIC_SITE_KEY) — pozwala wyłącznie wysyłać nowe zgłoszenia, nie daje dostępu do Twojego konta.
3. Lipiți scriptul - Plasați următorul cod imediat înaintea etichetei </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>

Este suficient. Un buton plutitor va apărea pe site și fiecare raport va declanșa o notificare push în aplicație.

widget HTML/JS

Widgetul CallFlow 1.2.0 este un script de producție pentru pagini HTML obișnuite. Nu necesită un cadru sau biblioteci externe. Formularul rulează într-un Shadow DOM izolat - nu interferează cu CSS-ul site-ului dvs. - și poate trimite cereri noi doar prin intermediul API-ului public CallFlow.

Instalare de bază (widget flotant)

Lipiți scriptul înainte </body> — dokładnie tak jak w Pornire rapidă. Varianta implicită floating wyświetla pływający przycisk w rogu ekranu, który otwiera formularz.

Varianta încorporată în conținut

Dacă doriți să plasați formularul într-un anumit loc din pagină (de exemplu, pe subpagina de contact), adăugați un container gol și indicați-l cu atributul 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>

Variante disponibile

• 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.

Puteți urmări toate variantele în direct pe site Widget demonstrativ.

Tabel complet de atribute de configurare

Setările de urgență și de politică de confidențialitate sunt preluate suplimentar din CallFlow. Utilizatorul site-ului web nu poate activa o funcție care a fost dezactivată de proprietarul contului.

Securitate și confidențialitate

• nu citește datele contului sau lista de bilete;
• cheia site-ului vă permite doar să creați un bilet;
• are loc prin HTTPS;
• formularul conține un honeypot și necesită consimțământul explicit pentru a contacta;
• widgetul nu salvează cookie-uri și nu utilizează stocarea locală;
• este normalizat și revalidat de API;
• are un timeout de 15 secunde și o cheie de idempotenta pentru a proteja împotriva duplicatelor.

Personalizarea aspectului

Din versiunea 1.2.0, widgetul moștenește fontul de pe site în mod implicit (inherit, awaryjnie system-ui), a wygląd można dopasować na dwóch poziomach: Ușor (atribute simple) i Avansat (CSS cu spectru complet). Atributele de personalizare pot fi plasate pe etichetă <script> sau pe ținta specificată de data-target (atrybut na elemencie docelowym ma pierwszeństwo). Bez tych atrybutów widget wygląda tak jak dotychczas.

Nivel ușor - culori, dimensiuni, font

Fiecare atribut este opțional și se mapează la o variabilă CSS setată pe elementul gazdă widget (.callflow-widget-host):

Exemplu de potrivire a widgetului cu partea întunecată cu accente aurii:

<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>

Aceleași variabile pătrund în Shadow DOM prin moștenirea CSS, așa că în loc de atribute puteți utiliza CSS pur pagină (foaie sau <style>):

#moj-kontener {

  --callflow-accent: #b8860b;

  --callflow-radius: 4px;

  --callflow-max-width: 460px;

}

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

Nivel avansat - spectru complet de CSS

::part() - Elementele importante ale formularului au atribute 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 brut injectat în Shadow DOM după stilurile de bază (câștigă în cascadă, afectează selectoarele interne de widget):

<div id="callback"

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

data-css-href - Adresa foii externe încărcate în Shadow DOM. Din motive de securitate, sunt acceptate doar adrese 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>

Ordinea stilului Shadow DOM: stiluri de bază → foaie z data-css-href → data-custom-css. Personalizacja jest w pełni opcjonalna i wstecznie kompatybilna — istniejące osadzenia działają bez zmian.

evenimente JavaScript

Widgetul emite evenimente pe elementul gazdă și le propagă în document, astfel încât să puteți, de exemplu, trimite o conversie către sistemul de analiză după un raport de succes:

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

  console.log(event.detail.receiptId);

});



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

  console.warn(event.detail.code);

});

Evenimente disponibile:

• 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).

Plugin WordPress

Pluginul CallFlow 1.1.0 adaugă un widget întregului site WordPress fără a edita șablonul. Suporta variante floating, box, sticky i compact oraz osadzanie formularza w treści przez shortcode.

Cerințe

• WordPress 6.0 sau o versiune ulterioară;
• PHP 7.4 sau mai recent (testat pe PHP 7.4 și 8.3);
• cheia site-ului CF-… utworzony w aplikacji CallFlow.

Instalare pas cu pas

1. Descărcați pluginul - fișier callflow-wordpress-1.1.0.zip znajdziesz w sekcji Descărcați.
2. Instalați în tabloul de bord WordPress - accesați Pluginuri → Adăugați un plugin nou → Încărcați pluginul pe server, indicați spre fișierul ZIP descărcat, faceți clic Instalațiși după instalare Activați.
3. Configurați - accesați Setări → CallFlow și:
   • lipiți cheia în cutie PUBLIC_SITE_KEY (format CF-XXXX-XXXX);
   • selectați Varianta (implicit floating);
   • introduceți adresa Politica de confidențialitate al site-ului dvs.;
   • marcaj Activați widgetul la nivel global și faceți clic Salvați modificările.

Încorporarea în conținut (cod scurt)

Pentru a afișa un formular în interiorul unei postări sau pagini, utilizați codul scurt:

[callflow variant="box"]

Utilizarea codului scurt dezactivează automat al doilea widget global de pe această subpagină - formularul nu va fi niciodată duplicat.

Probleme frecvente

• Cheia nu se salvează - Pluginul validează formatul: cheia trebuie să înceapă cu CF- i zawierać wyłącznie wielkie litery, cyfry i myślniki. Skopiuj go ponownie z aplikacji, bez spacji.
• Widgetul nu apare pe pagină - câmp de verificare Activați widgetul la nivel global este bifat și cheia nu este goală. Dacă utilizați un plugin pentru cache (de exemplu, LiteSpeed, WP Super Cache), ștergeți memoria cache după salvarea setărilor.
• Widgetul apare de două ori - aveți și pluginul CallFlow pentru WooCommerce activ; vezi sectiunea WooCommerce.

Plugin WooCommerce

CallFlow pentru WooCommerce 1.1.0 este un plugin adaptat pentru magazine - folosește varianta 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.

Cerințe

• WordPress 6.0 sau mai recent, PHP 7.4 sau mai recent (testat pe PHP 7.4 și 8.3);
• plugin activ WooCommerce (obligatoriu - fără el widgetul nu va fi afișat);
• cheia site-ului CF-… z aplikacji CallFlow.

Instalare pas cu pas

1. Descărcați pluginul - fișier callflow-woocommerce-1.1.0.zip z sekcji Descărcați.
2. Instalați — Pluginuri → Adăugați un plugin nou → Încărcați pluginul pe server, selectați ZIP, Instalați, Activați.
3. Configurați - accesați Setări → CallFlow WooCommerce și:
   • lipire PUBLIC_SITE_KEY;
   • selectați Varianta: ecommerce (domyślny), floating lub sticky;
   • setați-vă pe cont propriu Antet formular (implicit „Ai o întrebare despre produs?”);
   • marcaj Activați widget-ul magazinului și salvați.

Funcționează cu pluginul de bază CallFlow

Ambele plugin-uri pot fi active în același timp. Când widget-ul WooCommerce este activat, acesta dezactivează automat widget-ul global al pluginului de bază, astfel încât formularul nu se va afișa niciodată de două ori. Dacă lăsați câmpul cheie din setările WooCommerce necompletat, pluginul va folosi cheia din pluginul CallFlow de bază.

Probleme frecvente

• Widgetul nu apare - asigurați-vă că WooCommerce este instalat și activ; pluginul afișează widget-ul numai atunci când WooCommerce rulează.
• Două widget-uri simultan - actualizați ambele pluginuri la versiunea 1.1.0; versiunile mai vechi nu coordonau vizibilitatea. Alternativ, debifați „Activați widgetul global” din pluginul de bază.
• Aceasta este beta - testați mai întâi pluginul pe o copie provizorie a magazinului înainte de a-l activa în producție.

Modulul PrestaShop 8

Modulul CallFlow 1.1.0 beta încorporează un widget de producție în subsolul magazinului PrestaShop (cârlig displayFooter). Obsługuje warianty ecommerce, floating i sticky.

Cerințe

• PrestaShop 8.0 sau o versiune ulterioară;
• cheia site-ului CF-… z aplikacji CallFlow;
• instalați mai întâi versiunea beta în magazinul de staging.

Instalare pas cu pas

1. Descărcați modulul - fișier callflow-prestashop8-1.1.0.zip z sekcji Descărcați.
2. Instalați pe panou - accesați Module → Module Manager → Load Module și indicați spre fișierul ZIP descărcat. Veți găsi modulul în categoria „Publicitate și marketing”.
3. Configurați - faceți clic Configurați pentru modulul CallFlow și:
   • lipire PUBLIC_SITE_KEY;
   • selectați Varianta: Comerț electronic (implicit), Floating sau Sticky;
   • setat Antetul widgetului (implicit „Aveți o întrebare despre acest produs?” - introduceți-vă propria în poloneză);
   • vă rugăm să specificați adresa politicii de confidențialitate magazin; Scriptul
   • setați comutatorul Activat la „Da” și faceți clic antet Salvați.

Probleme frecvente

• Eroare „Tasta CallFlow trebuie să înceapă cu CF-” - modulul validează formatul cheii; copiați-l din aplicație fără spații.
• Widgetul nu apare după salvare - goliți memoria cache a magazinului (Avansat → Performanță → Șterge memoria cache) și verificați dacă comutatorul Activat este setat pe „Da”.
• Tema nu invocă subsolul - widgetul este conectat la cârlig displayFooter; jeśli Twój motyw go nie renderuje, podepnij moduł do innego hooka w Aspect → Articole.

Alte platforme

Următoarele integrări sunt versiuni tehnice beta ale 1.1.0 - vă rugăm să le instalați mai întâi în mediul dumneavoastră de pregătire. Veți găsi toate pachetele în secțiune Descărcați.

Drupal 10/11

După instalarea modulului, accesați Configurare → Servicii de rețea → CallFlow, inserați cheia publică a site-ului și selectați o variantă.

Joomla 4/5

După instalare, activați pluginul Sistem - CallFlow (v Sistem → Pluginuri), lipire PUBLIC_SITE_KEY, wybierz wariant i podaj adres polityki prywatności.

Magento 2 / Adobe Commerce

Copiați modulul în app/code/CallFlow/Callback, uruchom bin/magento setup:upgrade i skonfiguruj go w Magazine → Configurare → General → CallFlow. Modulul conține o listă albă CSP pentru script și API samael.pl, więc nie musisz ręcznie modyfikować polityki bezpieczeństwa treści.

e107 2.3

După instalare, deschideți configurația CallFlow, lipiți cheia CF-…, wybierz wariant i włącz widget.

Strapi 4/5

Pluginul oferă configurație publică a podului /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

Pachetul include cod sursă Extensia aplicației tematice (încorporarea aplicației pentru un widget plutitor și bloc de aplicații cu un formular încorporat în secțiune) - acesta nu este un program de instalare a magazinului. Implementarea necesită aplicația Shopify Partner și magazinul pentru dezvoltatori:

shopify app dev

shopify app deploy

După instalare, vânzătorul activează CallFlow în Setări teme → Încorporare aplicație sau adaugă un bloc de formular la o secțiune tematică.

API pentru dezvoltatori

CallFlow oferă versiunea 1.2.0 a API-ului REST - același contract alimentează aplicația mobilă și widget-urile publice.

Elemente de bază

• Adresa URL de bază: https://callflowdesk.com/api/v1
• Autentificare: Numărul Authorization: Bearer <access_token> (JWT). Token uzyskasz przez POST /auth/login, a odświeżysz przez POST /auth/refresh z refresh_token.
• Nici un simbol funcționează numai: /auth/register, /auth/login, /auth/refresh oraz /public/leads.
• Erori: format răspunsuri application/problem+json z polami type, title, status, code, detail, trace_id i (dla walidacji) errors.
• Paginare: listează returnarea next_cursor; kolejną stronę pobierzesz parametrem zapytania cursor.

Auth - Înregistrare și ciclu de viață al sesiunii

Cont - Cont principal, Subconturi și statistici

Surse - Site-uri web și pachete de contact

Leads - solicitări de apel invers și stările acestora

Program - programarea apelurilor

Dispozitive - dispozitive push

Public - puncte finale pentru widget-uri

Exemplu: autentificare

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

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

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

Răspunde 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"

Exemplu: trimiterea unui client potențial public

Punct final POST /public/leads nie wymaga tokenu — identyfikuje stronę po publicznym kluczu CF-…. Nagłówek Idempotency-Key jest este necesar (16-128 de caractere, de exemplu UUID): Reîncercarea cererii cu aceeași cheie nu va crea o cerere duplicată.

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": ""

  }'

Câmpuri obligatorii: 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.

Aplicație Android

Aplicația CallFlow este centrul de comandă pentru apelurile dvs.: aici merg toate rapoartele de la widget-uri, aici gestionați paginile, tastele și calendarul de apel invers. Aplicația va apărea în curând pe Google Play - până atunci, veți găsi pachetul de instalare în secțiune Descărcați.

Caracteristici cheie

• Coada de apeluri - cererile noi sunt trimise automat către proiectul corespunzător și puse la coadă în funcție de programul de lucru și timpul estimat de conversație; stările (nou, în curs, gestionat, ratat, spam) organizează munca.
• Program - calendar de apel invers cu programarea automată a următoarei întâlniri disponibile cu o singură atingere.
• Notificări push - fiecare raport nou declanșează imediat o notificare; Gestionați lista de dispozitive înregistrate în setări și puteți revoca accesul pentru un telefon pierdut.
• Subconturi - în calitate de proprietar de cont (rol principal), inviți colegii (rol secundar) prin e-mail și le alocați paginile selectate; ei văd doar sursele și rapoartele care le sunt alocate.
• Export de date - exportul complet al datelor contului (pagini, rapoarte, program, consimțământ) într-un fișier JSON, în conformitate cu GDPR.
• Ștergerea contului - ștergerea definitivă a contului cu toate datele direct din aplicație (necesită confirmarea parolei, iar pentru conturile Google - sintagma „ȘTERGERE CONTUL”); detalii in sectiune Ștergeți contul.

Depanare

Widgetul nu apare deloc

Cea mai frecventă cauză este o cheie nevalidă. Verificați atributul 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.

Widgetul afișează mesajul „Configurație nevalidă”.

Cheia este în formatul corect, dar nu este activă. Acest lucru se întâmplă atunci când o cheie nouă a fost generată (rotația o invalidează imediat pe cea veche) sau pagina a fost arhivată. Accesați detaliile site-ului din aplicație și copiați curent și înlocuiți-o în setările codului sau pluginului.

Formularul funcționează, dar aplicațiile nu ajung la aplicație

Verificați starea site-ului în aplicație: numai site-urile active acceptă aplicații. O pagină întreruptă sau arhivată nu acceptă clienți potențiali noi. De asemenea, verificați dacă nu vizualizați rapoarte cu un filtru de stare sau pe un subcont fără acces la această pagină.

Widgetul apare de două ori pe WordPress cu WooCommerce

Aveți ambele pluginuri active: CallFlow de bază și CallFlow pentru WooCommerce. Începând cu versiunea 1.1.0, pluginul WooCommerce dezactivează automat widgetul de bază global - actualizați ambele la 1.1.0. Dacă problema persistă, debifați „Activați widgetul global” în Setări → CallFlow. Amintiți-vă și acel shortcode [callflow] sam wyłącza widget globalny na danej podstronie.

Un magazin cu un CSP restrictiv blochează widgetul

Dacă site-ul dvs. trimite un antet Content-Security-Policy, adăugați un domeniu 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.

Widgetul nu trimite rapoarte pe localhost

Acesta este un câmp intenționat 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.

Cum se schimbă culorile widgetului fără a edita CSS-ul paginii?

Utilizați atributele de nivel Easy direct pe etichetă <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 Personalizare, și seturi gata făcute galerie demonstrativă.

Unde pot găsi cheia CF a site-ului meu?

În aplicația CallFlow, deschideți „Pachete și pagini”, selectați pagina - tasta 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.

Nu primesc notificări push despre rapoarte noi

Verificați dacă aplicația are permisiunea pentru notificări în setările Android și că dispozitivul dvs. se află în lista de dispozitive din aplicație și nu a fost revocat. Dezactivați optimizarea bateriei pentru CallFlow dacă sistemul pune aplicația în stare de repaus în fundal.

Am generat o cheie nouă și widget-ul a încetat să funcționeze

Rotirea cheii o invalidează imediat pe cea anterioară - aceasta este o caracteristică de securitate. După generarea unei noi chei, actualizați-o în toate locurile în care este încorporat widget-ul: în codul site-ului web și în setările fiecărui plugin CMS.