Ako pridať live chat na web zadarmo: návod krok za krokom [2026]

Pridanie živého rozhovoru na vašu webovú stránku sa môže zdať ako technická úloha, ktorá si vyžaduje pomoc programátora. V praxi zvyčajne ide o vytvorenie účtu, konfiguráciu okna chatu a vloženie jedného kódu.

Nie je potrebné budovať si vlastný systém zasielania správ, konfigurovať server alebo vytvárať aplikáciu od začiatku. Pripravený widget funguje ako dodatočný prvok webovej stránky a umožňuje zákazníkovi začať konverzáciu bez inštalácie aplikácie alebo vytvorenia účtu.

V tejto príručke vám ukážeme, ako pridať bezplatný live chat Chataptor do:

• bežná HTML stránka,
• WordPress,
• WooCommerce,
• Shopify,
• Nakupujúci,
• PrestaShop,
• stránku pomocou Správcu značiek Google.

Celý proces môžete urobiť sami. Najdôležitejšie je skopírovať kód vygenerovaný pre konkrétnu stránku a umiestniť ho na správne miesto.

Ako pridať live chat na web: stručný postup

Základný proces je nasledujúci:

1. Vytvorte si účet v systéme Chataptor.
2. Prejdite na kartu Kanály.
3. Vyberte Widget stránky.
4. Pridajte názov a adresu svojej webovej stránky.
5. Otvorte kartu Inštalácia widgetu.
6. Nakonfigurujte vzhľad chatu.
7. Skopírujte kód vygenerovaný Chataptorom.
8. Prilepte ho na stránku pred záverečnú značku </body>.
9. Uložte zmeny a odošlite testovaciu správu.

Po správnej inštalácii začnú správy odoslané z widgetu chodiť na panel Chataptor. Môžete na ne odpovedať z prehliadača alebo mobilnej aplikácie.

Čo potrebujete, než začnete?

Na spustenie živého chatu potrebujete:

• adresa webovej stránky,
• účet Chataptor,
• možnosť upravovať stránku alebo jej nastavenia,
• prístup k panelu WordPress, obchodu alebo systému správy webových stránok.

Nepotrebujete poznať HTML alebo JavaScript. Vo väčšine populárnych systémov je možné kód vložiť do špeciálneho poľa pre ďalšie skripty.

Ak web spravuje agentúra alebo vývojár, jednoducho nahrajte vygenerovaný kód s informáciami:

Pridajte tento skript globálne na všetky podstránky, bezprostredne pred uzatváraciu značku </body>.

Krok 1. Vytvorte si bezplatný účet Chataptor

Prvým krokom je vytvoriť si bezplatný účet Chataptor.

V registračnom formulári uveďte:

• názov spoločnosti,
• vaše meno,
• emailová adresa,
• heslo.

Po odoslaní formulára skontrolujte svoju poštovú schránku a ak dostanete aktivačnú správu, potvrďte svoju registráciu.

Chataptor je momentálne k dispozícii zadarmo, bez obmedzenia konverzácií a bez platených funkcií. Zahŕňa nielen chatovací widget, ale aj mobilnú aplikáciu, šablóny odpovedí, spoločnú schránku a automatické preklady správ.

Krok 2. Prejdite na kartu „Kanály“.

Po prihlásení otvorte kartu Kanály.

Existujú zdroje, z ktorých môžu správy dostať Chataptor. Jedným z nich je Website Widget, čo je chatovacie okno, ktoré sa zobrazuje návštevníkom stránky.

Nemusíte hneď nastavovať WhatsApp, e-mail, Facebook alebo iné integrácie. Môžete začať iba so živým četom a neskôr pridať ďalšie kanály.

Vyberte Widget stránky.

Krok 3. Pridajte svoju webovú stránku

Po výbere widgetu prejdete na nastavenia stránky.

Pridajte novú stránku a vyplňte nasledovné:

• názov stránky,
• svoju webovú adresu.

Názov pomáha identifikovať zdroj panelového chatu. To sa hodí najmä vtedy, ak má firma viacero predajní, značiek, domén či jazykových verzií.

Príklady mien:

• Obchod Poľsko,
• Obchod Nemecko,
• Webová stránka spoločnosti,
• Maloobchodná predajňa,
• B2B panel.

Do poľa adresy zadajte úplnú adresu webovej stránky, na ktorej chcete zobraziť živý chat.

Po dokončení údajov uložte stránku.

Krok 4. Nakonfigurujte vzhľad widgetu

Po uložení stránky prejdite na kartu Inštalácia widgetu.

V závislosti od aktuálnej verzie panela môžete okrem iného nastaviť:

• názov okna rozhovoru,
• uvítacia správa,
• textové pole na zadávanie správ,
• hlavná farba,
• svetlý alebo tmavý motív,
• pozícia widgetu,
• spôsob otvárania okna,
• automatický preklad konverzácií.

Nemusíte upravovať všetky nastavenia naraz. Najprv môžete spustiť jednoduchú verziu, skontrolovať jej fungovanie a až potom zmeniť vzhľad.

Aký uvítací text mám nastaviť?

Uvítaciu správu píšte stručne a jasne uveďte, že zákazník môže položiť otázku.

Príklady:

Dobré ráno! Ako môžeme pomôcť?

Máte otázku ohľadom produktu alebo objednávky? Napíšte nám.

Potrebujete pomôcť s výberom produktu? sme tu.

Vyhnite sa dlhým textom popisujúcim celú spoločnosť. Zákazník otvorí chat, pretože chce rýchlo začať konverzáciu.

Akú farbu widgetu si mám vybrať?

Najlepšie je použiť farbu, ktorá zodpovedá vizuálnej identifikácii webovej stránky, ale zároveň je dostatočne kontrastná.

Tlačidlo by malo byť viditeľné, ale nie zakryté:

• mobilné menu,
• tlačidlo pridať produkt do košíka,
• informácie o súboroch cookie,
• ďalšie dôležité prvky stránky.

Po spustení widgetu skontrolujte jej vzhľad na počítači aj telefóne.

Krok 5. Skopírujte kód vygenerovaný Chataptorom

Po uložení konfigurácie vygeneruje Chataptor individuálny inštalačný kód.

Kód obsahuje ID, ktoré spája widget so správnym účtom a stránkou. Preto by ste nemali kopírovať kód, ktorý nájdete v inej príručke, na webovej lokalite alebo v účte tretej strany.

Vždy použite celý kód vygenerovaný na paneli Chataptor.

Fragment môže vyzerať podobne ako v nasledujúcom príklade:

<body>
  <!-- Obsah stránky -->

  <!-- Tutaj wklej pełny kod wygenerowany przez Chataptor -->
</body>

Nemeňte manuálne ID skriptov, kľúče ani adresy. Parametre vzhľadu je možné upravovať len vtedy, ak viete, na čo slúžia.

Krok 6. Vložte kód pred značku </body>

Kód widgetu by sa mal pridať bezprostredne pred záverečnú značku:

</body>

Príklad rozloženia súboru:

<!doctype html>
<html lang="pl">
  <head>
    <meta charset="utf-8" />
    <title>Môj web</title>
  </head>
  <body>
    <h1>Vitajte na našom webe</h1>

    <!-- Kod widgetu Chataptor wklej w tym miejscu -->
  </body>
</html>

Umiestnením kódu do globálnej päty alebo hlavnej šablóny sa chat zobrazí na všetkých podstránkach.

Ak chcete, aby bola dostupná len na konkrétnom mieste, napríklad v obchode, ale nie na blogu, spôsob inštalácie môže vyžadovať dodatočnú podmienku alebo nastavenie pravidla zobrazenia.

Ako pridať live chat na WordPress?

Najjednoduchším riešením pre netechnického človeka je použiť Chataptor integráciu s WordPress alebo plugin, ktorý umožňuje pridávať skripty do päty.

Môže to byť napríklad nástroj ako:

• WPCode,
• kód hlavy a päty,
• Skripty hlavičky a päty.

Po nainštalovaní príslušného doplnku:

1. Otvorte jej nastavenia.
2. Nájdite pole s kódom v päte.
3. Vložte celý kód vygenerovaný v Chataptor.
4. Nastaviť zobrazenie na celú stránku.
5. Uložiť zmeny.
6. Vymažte vyrovnávaciu pamäť WordPress.
7. Otvorte stránku v súkromnom režime a skontrolujte widget.

Názvy polí sa môžu medzi zásuvnými modulmi líšiť. Hľadajte výrazy ako:

• Päta,
• Koniec tela,
• Pred </body>,
• Skripty v päte.

Inštalácia cez súbor témy

Technická osoba môže pridať skript pomocou mechanizmu wp_footer alebo do súboru päty podradenej témy.

Nestojí za to pridávať kód priamo do hlavnej témy. Po aktualizácii môže byť zmena odstránená.

Ako pridať live chat do WooCommerce?

WooCommerce beží na WordPress, takže inštalácia je rovnaká.

Chataptor kód možno pridať:

• prostredníctvom doplnku na správu skriptov,
• až wp_footer,
• v päte detskej témy.

Po inštalácii skontrolujte najmä:

• domovská stránka obchodu,
• produktová karta,
• košík,
• mobilné zariadenie.

Widget by nemala pokrývať nákupné tlačidlá alebo prvky používané pri zadávaní objednávky.

Ako pridať live chat do Shopify?

V Shopify je možné kód umiestniť do hlavného súboru šablóny.

Skôr ako začnete, je dobré si vytvoriť kópiu svojej aktívnej témy.

Potom:

1. Prihláste sa do svojho hlavného panela Shopify.
2. Otvorte sekciu Internetový obchod.
3. Prejdite na Témy.
4. Pri aktívnej téme vyberte možnosť upraviť kód.
5. V adresári Layout otvorte súbor theme.liquid.
6. Nájdite štítok </body>.
7. Prilepte celý kód Chataptor priamo pred neho.
8. Uložiť zmeny.
9. Obnovte obchod a urobte testovaciu konverzáciu.

Kód by mal byť zahrnutý v hlavnej šablóne, aby bol widget dostupný na všetkých dôležitých podstránkach obchodu.

Ako pridať live chat do Shoper?

Presný názov sekcie sa môže líšiť v závislosti od verzie panela a použitej šablóny. Užitočný môže byť aj návod na integráciu Chataptoru so Shoper.

Najčastejšie by ste mali:

1. Prihláste sa do administračného panelu.
2. Otvorte sekciu doplnkov alebo integrácií.
3. Prejdite na vlastné integrácie alebo svoj vlastný kód.
4. Nájdite pole s kódom v päte stránky.
5. Vložte kód Chataptor.
6. Uložiť zmeny.
7. Skontrolujte obchod v novom okne prehliadača.

Vyhľadajte pole opísané ako kód pred uzavretím </body>.

Ak túto možnosť nevidíte, kód je možné pridať úpravou šablóny alebo poslať technickej podpore obchodu.

Ako pridať live chat do PrestaShopu?

V PrestaShope je najlepšie použiť riešenie, ktoré nevyžaduje úpravu hlavných systémových súborov.

Možné metódy sú:

• modul, ktorý vám umožní pridať svoj vlastný JavaScript,
• vlastný modul HTML,
• háčik displayFooter,
• päta použitej témy,
• jednoduchý modul pripravený programátorom.

Kód by sa mal načítať globálne, najlepšie v päte stránky.

Hlavné súbory PrestaShop by sa nemali upravovať. Aktualizácia systému môže odstrániť vykonané zmeny.

Ako pridať live chat na bežnú HTML stránku?

Ak máte prístup k súborom lokality:

1. Otvorte hlavnú šablónu alebo súbor spoločnej päty.
2. Nájdite </body>.
3. Prilepte kód Chataptor priamo pred túto značku.
4. Uložte súbor.
5. Zverejnite zmeny na serveri.
6. Obnovte stránku bez vyrovnávacej pamäte.

Ak webová lokalita pozostáva z mnohých samostatných HTML súborov, kód by sa mal pridať do každého z nich alebo do spoločného komponentu načítaného na všetkých podstránkach.

Ako nainštalovať Chataptor cez Google Tag Manager?

Ak webová lokalita už používa Správcu značiek Google, widget možno pridať bez priamej úpravy kódu webovej lokality.

Základný proces:

1. Vytvorte nový štítok.
2. Vyberte typ Vlastné HTML.
3. Vložte celý kód vygenerovaný Chataptorom.
4. Nastaviť pravidlo spúšťania na všetkých stránkach.
5. Uložiť značku.
6. Spustite režim náhľadu.
7. Skontrolujte, či sa skript načítava.
8. Publikovať kontajner.

Táto metóda je pohodlná, ale vyžaduje, aby bol na stránke správne nainštalovaný Správca značiek Google.

Tiež sa oplatí skontrolovať konfiguráciu súhlasu so súbormi cookie. Ak sú skripty zablokované až do udelenia súhlasu, widget sa môže zobraziť až po prijatí príslušných nastavení.

Krok 7. Skontrolujte, či widget funguje

Po uložení a zverejnení kódu neprestávajte pracovať, keď sa zobrazí tlačidlo.

Vykonajte úplný test:

1. Otvorte stránku v súkromnom režime.
2. Skontrolujte, či je tlačidlo chatu viditeľné.
3. Otvoriť widget.
4. Pošlite vzorovú správu.
5. Prihláste sa do Chataptor.
6. Skontrolujte, či sa konverzácia zobrazuje na ovládacom paneli.
7. Odpovedať na správu.
8. Uistite sa, že sa odpoveď zobrazí na strane klienta.
9. Zopakujte test na svojom telefóne.

Vzorová testovacia správa:

Dobré ráno, chcel by som skontrolovať, či live chat funguje správne.

Ak používate automatické preklady, vykonajte test aj v inom jazyku.

Widget sa na stránke nezobrazuje - čo skontrolovať?

Najčastejšie príčiny problémov sú pomerne jednoduché.

Kód nebol zverejnený

Vloženie kódu do editora nemusí vždy znamenať jeho zverejnenie. Overte, či sa zmeny uložili a nasadili do živej verzie lokality.

Kód je len na jednej podstránke

Ak bol skript pridaný na jednu stránku namiesto globálnej šablóny, chat nebude viditeľný inde.

Cache zobrazuje starú verziu stránky

Vymazať:

• vyrovnávacia pamäť WordPress,
• vyrovnávacia pamäť použitého doplnku,
• server alebo hostiteľská vyrovnávacia pamäť,
• CDN cache,
• pamäť prehliadača.

Potom otvorte stránku v súkromnom režime.

Vzorový kód vložený namiesto kódu účtu

Kód musí obsahovať ID priradené správnemu účtu a stránke. Nekopírujte príklad z článku alebo kódu tretej strany.

Skript bol zmenený

Skontrolujte, či editor pri vkladaní neodstránil žiadny kód, úvodzovky alebo atribúty skriptu.

Ďalším prvkom je zakrytie widgetu

Nad chatom sa môže zobraziť banner so súbormi cookie, tlačidlo kontaktu alebo mobilné menu. V takom prípade musíte zmeniť polohu widgetu alebo nastavenia vrstvy stránky.

Systém blokuje externé skripty

Príčina môže byť:

• Zásady zabezpečenia obsahu,
• mechanizmus správy súhlasu,
• blokovanie skriptov bezpečnostným doplnkom,
• optimalizácia JavaScriptu,
• rozšírenie blokovania reklamy alebo sledovania.

Počas trvania testu sa oplatí vypnúť optimalizáciu skriptov a skontrolovať web v inom prehliadači.

Ako nastaviť live chat, aby ho zákazníci skutočne používali?

Inštalácia widgetu je len začiatok. Chat by mal byť viditeľný, jednoduchý a prispôsobený spôsobu, akým zákazníci používajú webovú stránku.

Pred konverzáciou nežiadajte príliš veľa informácií

Ak zákazník potrebuje uviesť meno, priezvisko, telefónne číslo, e-mailovú adresu a niektoré ďalšie informácie, môže sa odhlásiť pred odoslaním prvej správy.

Najprv zbierajte iba tie údaje, ktoré skutočne potrebujete.

Nastavte si realistické očakávania

Ak tím odpovedá iba počas pracovnej doby, oplatí sa to jasne oznámiť.

Príklad:

Napíšte správu. Odpovedáme od pondelka do piatku od 8:00 do 16:00.

Je lepšie dať skutočný čas, ako sľúbiť odpoveď „okamžite“, keď ju nikto nevie dať.

Majte pripravené odpovede

Najčastejšie otázky sú:

• dostupnosť,
• doručenie,
• sa vracia,
• faktúry,
• stav objednávky,
• spoluprácu.

V systéme Chataptor si môžete pripraviť pripravené odpovede na live chat a vložiť ich pomocou krátkych príkazov, napríklad /doprava, /vratenie alebo /faktura.

Šablóna by mala zrýchliť odozvu, no zároveň by mala umožniť jej prispôsobenie konkrétnemu zákazníkovi.

Zapnite mobilné upozornenia

Zákazník môže písať, keď nikto nesedí pri počítači. Mobilná aplikácia zákazníckych služieb vám umožňuje všimnúť si novú konverzáciu a odpovedať z vášho telefónu.

Toto je obzvlášť dôležité v malých spoločnostiach, kde zákaznícky servis nie je samostatným oddelením 24/7.

Otestujte automatické preklady

Ak stránku navštevujú zahraniční zákazníci, povoľte automatický preklad konverzácií.

Zákazník píše vo svojom jazyku. Pracovník si prečíta preloženú správu a odpovie v jazyku, ktorý bežne používa. Chataptor odpoveď pred zobrazením zákazníkovi preloží.

Má bezplatný live chat limity?

Závisí to od nástroja, ktorý si vyberiete.

Limit niektorých bezplatných plánov:

• počet konverzácií za mesiac,
• počet operátorov,
• dĺžka histórie,
• počet strán,
• funkcie AI,
• automatizácia,
• schopnosť odstrániť značku.

Preto sa pred inštaláciou oplatí skontrolovať nielen to, či má nástroj bezplatný plán, ale aj moment, kedy bude musieť spoločnosť prejsť na predplatné.

Chataptor je momentálne bezplatný live chat bez obmedzenia počtu konverzácií. Neexistuje žiadny samostatný platený balík prekladov AI.

Potrebujem vývojára na inštaláciu živého chatu?

Väčšinou nie.

Netechnická osoba môže pridať kód sama:

• WordPress plugin,
• nastavenie ďalších skriptov v obchode,
• Správca značiek Google,
• pole vlastného kódu v nástroji na tvorbu stránok.

Pomoc vývojára môže byť potrebná, keď:

• webová stránka používa vlastný systém,
• nemá prístup k spoločnej šablóne,
• funguje prísna bezpečnostná politika,
• widget by sa mala zobraziť iba za určitých podmienok, Inštalácia
• vyžaduje zmeny témy alebo aplikácie.

Ako dlho trvá pridanie živého chatu na webovú stránku?

Len vytvorenie kanála a vloženie kódu môže trvať niekoľko minút. Oplatí sa venovať viac času:

• nastavenie obsahu widgetu,
• testovanie mobilnej verzie,
• príprava odpovede,
• stanovenie prevádzkových hodín,
• nakonfigurovať upozornenia,
• kontrola prekladu.

Najlepšie je najskôr spustiť jednoduchú, fungujúcu verziu a potom vylepšiť jej vzhľad a dojem na základe skutočných konverzácií.

Kontrolný zoznam spustenia živého chatu

Pred dokončením nasadenia skontrolujte:

• Chataptor účet je aktívny.
• Stránka bola pridaná na kartu Kanály.
• Bol použitý kód vygenerovaný pre správnu stránku.
• Kód bol pridaný globálne pred </body>.
• Widget je viditeľná na vašom počítači.
• Widget je viditeľná v telefóne.
• Nezakrýva tlačidlá ani banner so súbormi cookie.
• Testovacia správa prejde na panel.
• Odpoveď je viditeľná na strane klienta.
• Mobilné upozornenia fungujú.
• Uvítací text sa zhoduje so stránkou.
• Tím vie, kto odpovedá na nové konverzácie.
• Boli pripravené najčastejšie odpovede.
• V prípade potreby boli preklady testované.

Zhrnutie

Ak chcete na svoju webovú stránku pridať live chat, nemusíte si vytvárať vlastný systém ani začínať zložitú implementáciu.

V systéme Chataptor proces spočíva v pridaní stránky, konfigurácii widgetu, skopírovaní individuálneho kódu a jeho umiestnení pred značku </body>.

Kód je možné pridať priamo na stránku HTML prostredníctvom WordPress, WooCommerce, Shopify, Shoper, PrestaShop alebo Google Tag Manager.

Po inštalácii sa oplatí uskutočniť úplný testovaciu konverzáciu a skontrolovať fungovanie chatu na telefóne. Len tak si môžete byť istí, že správy od zákazníkov sa k tímu skutočne dostanú.

Chataptor vám umožňuje začať s jednoduchým živým chatom a potom tiež pripojiť ďalšie komunikačné kanály v rovnakom paneli. Samotný widget, mobilná aplikácia, šablóny odpovedí a preklady AI sú dostupné bez obmedzenia konverzácií a bez plateného plánu.

Chcete spustiť chat na svojom webe? Vytvorte si bezplatný účet Chataptor, pridajte web a vložte vygenerovaný kód widgetu.

FAQ

Ako pridať bezplatný live chat na váš web?

Vytvorte si účet v systéme Chataptor, prejdite na kartu Kanály, pridajte webovú stránku, otvorte inštaláciu widgetu a skopírujte vygenerovaný kód. Potom ho vložte pred záverečnú značku </body>.

Kam vložiť kód živého chatu?

Kód by sa mal objaviť v globálnej šablóne stránky, bezprostredne pred </body>. Vďaka tomu bude widget dostupný na všetkých podstránkach.

Ako pridať live chat na WordPress?

Najjednoduchším spôsobom je použiť doplnok, ktorý vám umožní pridávať skripty do päty. Vložte kód Chataptor do poľa Päta alebo Pred </body>, uložte zmeny a vymažte vyrovnávaciu pamäť.

Funguje Chataptor s WooCommerce?

Áno. WooCommerce beží na WordPress, takže kód je možné pridať pomocou doplnku na správu skriptov wp_footer alebo päty podradenej témy.

Ako pridať live chat do Shopify?

Otvorte aktívny kód témy, prejdite do súboru theme.liquid a vložte kód Chataptor pred značku </body>.

Môžem pridať live chat cez Google Tag Manager?

Áno. Vytvorte vlastnú značku HTML, prilepte kód Chataptor, nastavte ho na spustenie na všetkých stránkach a zverejnite kontajner.

Prečo sa na webovej stránke nezobrazuje live chat?

Najčastejšie dôvody sú nesprávny kód, nezverejnenie zmien, cache, blokovanie externých skriptov alebo pridanie widgetu len na jednu podstránku.

Potrebuje zákazník nainštalovať aplikáciu?

Nie. Zákazník používa chatovacie okno priamo na webovej stránke. Mobilná aplikácia je navrhnutá pre spoločnosť na odosielanie správ.

Je možné zmeniť vzhľad widgetu?

Áno. Okrem iného si môžete prispôsobiť farbu, názov, uvítaciu správu, text v poli správy, tému a polohu tlačidla.

Má bezplatný live chat limit konverzácií?

Chataptor momentálne nemá žiadny limit konverzácií ani platené funkcie. Widget, mobilná aplikácia a preklady AI sú dostupné bez ďalšieho predplatného.

Môžem pridať widget na niekoľko stránok?

Áno. Na paneli môžete pridať ďalšie stránky a vygenerovať pre ne vhodné konfigurácie. Pomáha to oddeliť konverzácie prichádzajúce z rôznych domén, obchodov alebo jazykových verzií.