Jak dodać czat na stronę www: darmowy live chat krok po kroku

Czat na stronie www to najszybszy kanał kontaktu, jaki możesz dać odwiedzającym: pytanie zadaje się w trakcie oglądania oferty, bez szukania numeru telefonu i bez czekania na odpowiedź mailową. Dla firmy to z kolei najtańszy sposób na złapanie osoby, która już jest na stronie, ale jeszcze się waha. W tym poradniku pokazujemy, jakie masz opcje, i prowadzimy krok po kroku przez instalację darmowego czatu Sugestera, bez pomocy programisty.

Po co czat na stronie

• Pytania w momencie decyzji. Klient pyta o dostępność, czas wysyłki albo cenę wdrożenia dokładnie wtedy, gdy porównuje ofertę. Mail przyszedłby jutro, a telefon odłożony na później często nie następuje.
• Jedna rozmowa, wielu klientów. Operator obsługuje kilka rozmów naraz, czego nie da się zrobić przez telefon.
• Historia w jednym miejscu. Jeśli czat jest częścią CRM-u, zapis rozmowy ląduje na karcie klienta obok maili i telefonów.
• Kontakt poza godzinami pracy. Wiadomość zostawiona w nocy trafia do skrzynki jako zgłoszenie, a klient dostaje informację, kiedy odpiszecie.

Jak dodać czat na stronę: trzy drogi

Poniżej opisujemy trzecią drogę na przykładzie Sugestera. Czat jest w planie bezpłatnym (1 widget, 3 operatorów, bez limitu czasu), a w planach płatnych dostajesz więcej widgetów i limitów rozmów. Pełny opis modułu: Sugester Live chat.

Krok 1. Utwórz czat i wygeneruj skrypt

Skrypt widgetu powstaje po utworzeniu czatu na koncie w Sugesterze:

1. Zaloguj się na swoje konto.
2. Wejdź w Ustawienia i sprawdź w sekcji modułów, czy moduł Czat jest aktywny. Jeśli zakładka Czaty jest widoczna w górnym menu, ten punkt możesz pominąć.
3. Wejdź w Ustawienia, potem Konfiguracja czatu, i kliknij + Czat.
4. Uzupełnij pole Nazwa. To nazwa robocza, widoczna tylko w panelu, odwiedzający jej nie zobaczą.
5. W polu Kto może odpisywać na czaty zaznacz osoby, które będą odpowiadać. Kto nie jest zaznaczony, nie widzi rozmów. W planie bezpłatnym czat obsługują maksymalnie 3 osoby.
6. Kliknij Zapisz. Pod formularzem pojawi się skrypt do wklejenia na stronę.

Nie masz jeszcze konta? Poproś o dostęp do Sugestera i zacznij od planu bezpłatnego.

Krok 2. Wklej skrypt na stronę

Skopiuj wygenerowany skrypt i wklej go do kodu HTML strony, najlepiej tuż przed zamykającym znacznikiem </body>. Jeśli strona ma wspólny szablon (stopkę), wystarczy jedno miejsce, żeby czat pojawił się na wszystkich podstronach. Po odświeżeniu strony, zwykle w ciągu minuty, okienko czatu jest widoczne.

Gotowe instrukcje dla popularnych platform sklepowych i CMS-ów: Shoper, Shopify, IdoSell, WordPress i WooCommerce. Jeśli korzystasz z Google Tag Managera, skrypt możesz dodać jako tag typu Custom HTML, bez dotykania kodu strony.

Krok 3. Dopasuj wygląd widgetu

Domyślny wygląd działa od razu, ale czat w kolorach Twojej marki budzi większe zaufanie. Wszystkie ustawienia są w Ustawienia, Konfiguracja czatu, przycisk Edytuj przy danym czacie.

Kolor, czcionka i rozmiar okienka

W polu Kolor wybierzesz jeden z sześciu gotowych kolorów (biały, szary, czarny, niebieski, zielony, czerwony). Dowolny inny kolor, większą czcionkę (domyślnie 13 px) albo większe okno ustawisz własnym CSS w polu Dostosowanie wyglądu (w sekcji Więcej opcji). Gotowe fragmenty kodu do skopiowania: zmiana koloru okienka i przycisku, zmiana wielkości czcionki, powiększenie okienka. W tym samym miejscu wyłączysz napis „powered by Sugester". W polu Położenie wybierasz prawy albo lewy dolny róg strony.

Rodzaj czatu i avatary

Pole Rodzaj ma cztery warianty: tradycyjny, z avatarami, angażujący i obrazkowy. Wariant z avatarami pokazuje zdjęcia operatorów, więc odwiedzający pisze do konkretnej osoby. Żeby zdjęcie się wyświetliło, musi być najpierw dodane w profilu użytkownika na koncie (pole Zdjęcie).

Przyciągacz uwagi

W polu Przyciągacz uwagi wgrywasz grafikę, która pojawia się nad zakładką czatu: ikonę, maskotkę, hasło promocji. Dobrze dobrana zwiększa liczbę rozpoczętych rozmów. Szczegóły: Przyciągacz uwagi w zakładce czatu.

Zaczepianie odwiedzających

Opcja Zaczepianie odwiedzających rozwija okienko po zadanym czasie i wyświetla własny tekst, na przykład „Masz pytanie o dostawę? Odpowiem od razu". Możesz wskazać, który operator ma zaczepiać. Opis: Zaczepianie odwiedzających.

Teksty w okienku

Odwiedzający chętniej pisze, gdy widzi, kto i w jakiej sprawie go zaprasza. W konfiguracji ustawisz: tytuł okienka, opis po rozwinięciu, placeholder w polu wiadomości (np. „Kliknij tu i wpisz wiadomość"), komunikat o niedostępności, informację zwrotną po zostawieniu wiadomości offline i treść zaczepki. Wersję językową interfejsu wybierasz spośród polskiego, angielskiego, hiszpańskiego i niemieckiego. Inspiracje: Jak stworzyć spersonalizowane treści w okienku czatu.

Krok 4. Ułatw pracę operatorom

• Tylko imię. Checkbox Wyświetlaj tylko imię operatora ukrywa nazwisko przed rozmówcą.
• Podgląd pisania. W polu Powiadomienie o pisaniu wybierz wariant pokazujący tekst wpisywany przez rozmówcę. Operator widzi pytanie, zanim klient kliknie Wyślij, i może szykować odpowiedź. Opis: Podgląd tekstu wpisywanego przez rozmówcę.
• Podgląd aktywności na stronie. Wariant „bardzo szczegółowy" pokazuje operatorowi, na jakiej podstronie jest rozmówca i co przegląda, więc odpowiedź może dotyczyć konkretnego produktu.
• Dział. Jeśli masz kilka zespołów, przypisz czat do działu, a rozmowy trafią do właściwych osób.

Krok 5. Ustaw godziny pracy czatu

W sekcji Godziny otwarcia (Więcej opcji) ustawisz osobne godziny dla każdego dnia tygodnia i jeden z trzech trybów: czat online tylko w godzinach otwarcia, online w godzinach otwarcia lub gdy operator jest zalogowany, albo online tylko wtedy, gdy spełnione są oba warunki. Poza godzinami odwiedzający widzi komunikat o niedostępności i może zostawić wiadomość, która trafi na adres z pola Email do powiadomień. Ten sam adres dostaje powiadomienie, gdy w godzinach pracy nikt nie odpisze w ciągu 5 minut. Opis: Godziny pracy czatu.

Krok 6. Przygotuj szablony odpowiedzi

Powitanie, pytanie o numer zamówienia, link do cennika: to wraca w każdej rozmowie. Szablon tworzy się z panelu operatora: w polu pisania kliknij wielokropek po prawej stronie i wybierz Dodaj nowy szablon. Podajesz nazwę, treść i widget, w którym szablon ma być dostępny (ważne, gdy masz więcej niż jeden czat). Lista szablonów jest potem pod tym samym wielokropkiem dla każdego operatora. Opis: Szablony odpowiedzi na czacie.

Krok 7. Dodaj inne kanały kontaktu do okienka

W oknie czatu możesz umieścić link do formularza kontaktowego, widoczny cały czas albo tylko w trybie offline. Zgłoszenia z formularza, maile i rozmowy z czatu lądują w tej samej skrzynce w Sugesterze, więc obsługujesz je z jednego miejsca. Jeśli chcesz, żeby rozmówca podał imię i e-mail przed rozpoczęciem rozmowy, włącz opcję opisaną we wpisie Wymuszanie podania danych przed wejściem na czat.

Krok 8. Połącz czat z CRM

Jeśli korzystasz z modułu CRM w Sugesterze, ten krok masz za sobą: rozmowa z czatu zapisuje się na karcie klienta obok maili, telefonów i zadań. W trakcie rozmowy operator jednym kliknięciem przechodzi do karty i widzi, kiedy klient ostatnio pisał i w jakiej sprawie. Opis: Zapisywanie rozmów z czatu na karcie klienta. Jeśli dopiero zaczynasz z CRM-em, przeczytaj przewodnik po systemach CRM.

Co sprawdzić po uruchomieniu

• Otwórz stronę na telefonie: okienko nie może zasłaniać przycisku „do koszyka" ani formularza.
• Napisz testową wiadomość w godzinach pracy i poza nimi, sprawdź, czy powiadomienie e-mail dociera.
• Po tygodniu zajrzyj do listy rozmów i sprawdź czas pierwszej odpowiedzi. Jeśli przekracza minutę, dodaj operatora albo zawęź godziny otwarcia.
• Jeśli masz Google Analytics, porównaj konwersję osób, które rozmawiały na czacie, z resztą odwiedzających. To najprostszy dowód, czy czat się opłaca.

Darmowy czat Sugestera ustawisz w kwadrans, a rozmowy od pierwszego dnia trafiają do tej samej skrzynki, co maile i zgłoszenia. Poproś o dostęp i dodaj czat na swoją stronę.