Karta promocyjna w czacie

Karta promocyjna pozwala pokazać w oknie czatu Twoją własną ofertę – najczęściej płatny plan. Składa się z obrazu, nagłówka, krótkiego tekstu, dużego przycisku i linku tekstowego pod nim. Pojawia się na górze rozmowy, na stronie startowej czatu albo w obu tych miejscach.

Karta nie jest wiadomością: nie trafia do historii rozmowy, którą widzi Twój zespół, a odwiedzający nie mogą jej zamknąć. Przycisk i link tekstowy otwierają swój cel w nowej karcie przeglądarki.

Konfiguracja

Kartę promocyjną znajdziesz w koncie w sekcji Projekt → Wygląd → Karta promocyjna. Podgląd czatu na tej stronie pokazuje kartę na bieżąco, w trakcie wpisywania.

• Nagłówek – wymagany, maksymalnie 80 znaków.
• Tekst pod spodem – opcjonalny, maksymalnie 200 znaków.
• Obraz – opcjonalny, adres zaczynający się od https://. Bez obrazu karta zawiera sam tekst.
• Tekst przycisku – wymagany, maksymalnie 40 znaków, np. „Wypróbuj 30 dni za darmo”.
• Cel przycisku – wymagany, strona, na którą prowadzi przycisk.
• Link tekstowy – opcjonalny, maksymalnie 60 znaków, np. „Zobacz wszystkie plany”. Jeśli go dodasz, wymagany jest też cel linku. Strzałkę na końcu widget dodaje sam.
• Własny kolor przycisku i akcentu – bez zaznaczenia karta używa koloru Twojej marki. Napis na przycisku automatycznie staje się jasny albo ciemny, żeby był czytelny.
• Gdzie pojawia się karta – „W rozmowie, na górze” i/lub „Na stronie startowej”. W drugim przypadku strona startowa czatu musi być włączona.
• Komu jest pokazywana – wszystkim odwiedzającym albo tylko niezidentyfikowanym (zob. niżej).

Jako cel przycisku i linku podawaj adresy zaczynające się od https://. Widget pokazuje przycisk i link tekstowy tylko z celem https.

Kartę można włączyć tylko wtedy, gdy jest kompletna: ma nagłówek, tekst przycisku, cel przycisku i co najmniej jedno miejsce. Jeśli czegoś brakuje, zostaje zapisana jako szkic, a konto wskazuje brakujące pole.

Teksty obowiązują w domyślnym języku projektu. Po zapisaniu zmiana dociera do odwiedzających w ciągu najwyżej minuty.

Ukrywanie karty przed płacącymi klientami

Kto już płaci, nie potrzebuje reklamy płatnego planu. reactive.chat nie zna planów Twoich użytkowników – Twoja strona tak. Masz do wyboru trzy sposoby.

1. Odbiorcy: „Tylko niezidentyfikowanym odwiedzającym”. Jeśli Twoja strona i tak zgłasza zalogowanych użytkowników przez ReactiveChat('identify', …) (z userId lub email), ci użytkownicy przestają widzieć kartę. To wystarczy, jeśli konto logowania mają u Ciebie tylko płacący klienci.

2. Jedna linijka w skrypcie strony, gdy tylko wiesz, że użytkownik płaci:

ReactiveChat('promo', false);

Jeśli ta linijka może się wykonać, zanim załaduje się fragment osadzenia, wstaw przed nią:

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

3. Atrybut we fragmencie osadzenia, jeśli Twój serwer i tak serwuje płacącym klientom inną wersję strony:

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

Oba wyłączniki działają tylko na stronie, na której się znajdują, i tylko podczas danego wyświetlenia. ReactiveChat('promo', true) przywraca kartę w postaci ustawionej w koncie.

Dopasowanie karty do konkretnej strony

Zamiast true lub false możesz przekazać obiekt. Jego pola zastępują na tej stronie ustawienia z konta; czego nie podasz, zostanie wzięte z konta.

ReactiveChat('promo', {
  titel: 'Plan roczny: 2 miesiące gratis',
  knopf: 'Zmień plan',
  ziel: 'https://www.twoja-domena.pl/cennik?rok=1'
});

Nazwy pól są takie same jak w koncie (pochodzą z niemieckiego):

• titel – nagłówek (maks. 80 znaków),
• text – tekst pod spodem (maks. 200 znaków),
• bild – adres obrazu zaczynający się od https://,
• knopf i ziel – tekst przycisku (maks. 40 znaków) i cel przycisku,
• link_text i link_ziel – link tekstowy (maks. 60 znaków) i jego cel,
• farbe – własny kolor w postaci #rrggbb,
• orte – lista z wartościami "gespraech" (w rozmowie) i "start" (strona startowa); jeśli nie ustawia jej ani obiekt, ani konto, obowiązuje ["gespraech"],
• zielgruppe – "alle" (wszyscy) albo "anonym" (tylko niezidentyfikowani).

Teksty możesz podać także osobno dla każdego języka, np. titel: { pl: 'Plan roczny', en: 'Annual plan' }. Dłuższe teksty są skracane.

Obiekt pokazuje kartę na tej stronie nawet wtedy, gdy w koncie jest wyłączona. Podaj wtedy wszystko sam: co najmniej titel, a dla przycisku także knopf i ziel.

Wyświetlenia i kliknięcia

W koncie, pod kartą promocyjną, sekcja Skuteczność pokazuje wyświetlenia, kliknięcia przycisku i linku tekstowego oraz współczynnik klikalności – łącznie za ostatnie 7 i 30 dni oraz w podziale na dni. Na jednego odwiedzającego dziennie liczy się najwyżej jedno wyświetlenie na miejsce i jedno kliknięcie na cel. Twój podgląd w koncie nie jest liczony – podobnie jak karta wyświetlana wyłącznie przez ReactiveChat('promo', {...}), gdy w koncie jest wyłączona.

Zdarzenia do własnych statystyk

Dodatkowo dwa zdarzenia w skrypcie Twojej strony informują o tym, co dzieje się z kartą – możesz je np. przekazać do własnego narzędzia analitycznego.

ReactiveChat('on', 'promo:shown', function (e) {
  // e.ort: "gespraech" (rozmowa) albo "start" (strona startowa)
});

ReactiveChat('on', 'promo:click', function (e) {
  // e.ziel: "knopf" (przycisk) albo "link" (link tekstowy), e.ort: "gespraech" albo "start"
});

promo:shown pojawia się raz na miejsce i wyświetlenie strony – i dopiero wtedy, gdy okno czatu jest otwarte, a karta w nim widoczna. Karty w zamkniętym czacie nikt nie zobaczył. promo:click pojawia się przy każdym kliknięciu przycisku lub linku tekstowego.

Gdy karta się nie pojawia

• Czy jest włączona? Niekompletna karta pozostaje szkicem.
• Do minuty mija od zapisania, zanim odwiedzający zobaczą zmianę.
• Miejsce „strona startowa”: czy strona startowa czatu jest włączona?
• Odbiorcy „niezidentyfikowani”: jeśli Twoja strona zgłasza odwiedzającego przez ReactiveChat('identify', …), nie zobaczy on karty.
• Wyłączona na tej stronie? Sprawdź, czy fragment osadzenia nie ma data-rc-promo="false", a Twoje skrypty nie wywołują ReactiveChat('promo', false).
• Brakuje przycisku lub linku tekstowego: cel nie zaczyna się od https://.

Jak otworzyć czat linkiem lub przyciskiem na własnej stronie, opisuje Otwieranie czatu własnym linkiem lub przyciskiem. Podstawy osadzania znajdziesz w Osadzenie widgetu.