# WebChat {% embed url="" %} Základní vztah: Skupina-Routing-Webchat balíček {% endembed %} {% hint style="info" %} *Chcete upravit podobu tlačítka WebChatu na svém webu? Pak jste v sekci WebChat správně. Zde můžete nastavit **vzhled chatového widgetu**, pole **CallBack** nebo **chatového okna**. Přizpůsobit zde můžete barvy, texty či loga.* *Aplikace má přednastavený vzhled i texty. Pokud si neupravíte nastavení podle svých preferencí, aplikace bude používat základní nastavení.* {% endhint %} {% hint style="success" %} *Ke každému z WebChat balíčků je užitečné si poznamenat do popisu např. URL webu, kde je WebChat balíček použit.* {% endhint %} ## Vytvoření nového WebChat balíčku Nový WebChat balíček nastavíte kliknutím na tlačítko **„Přidat“.** Vyplníte jeho název a buď ze seznamu vyberete existující routovací pravidlo, nebo vytvoříte nové (klikněte na tlačítko **„Přidat”**, pravidlo pojmenujte a uložte, ostatní můžete nastavit později) a klikem na „OK” nastavení uložíte. {% hint style="info" %} *Právě jste vytvořili nový WebChat balíček, který si můžete podle návodu v následujících sekcích libovolně upravit.* {% endhint %} ## **Obecné nastavení** Zde můžete navolit **routingová a spouštěcí pravidla** k WebChat balíčku. Před jejich nastavením doporučujeme si prostudovat jednotlivé sekce [Routing](https://docs.mluvii.com/pro-administratory/sprava-tenantu/nastaveni/routingova-pravidla) a [Pravidla](https://docs.mluvii.com/pro-administratory/sprava-tenantu/nastaveni/pravidla). V sekci **Obecné nastavení** naleznete také **javascriptový kód**, kterým můžete balíček do vaší stránky jednoduše vložit. Stačí stisknout tlačítko „Kopírovat kód” a vložit ho do vašich stránek do `` nebo `` elementů. Nebo si můžete vytvořit **vlastní testovací webovou stránku**. ## **Tlačítko** U nastavení tlačítka máte možnost měnit jeho vzhled a také jeho chování. ### **Vzhled** * při volbě **vzhledu tlačítka** nastavujete jeho podobu a typ vstupu (WebChat, Callback či Videohovor), * **nastavení pozice** - umístění tlačítka na stránce. Vybrat si můžete z pozic vpravo, vlevo, nahoře, dole nebo si navolit vlastní umístění s horizontálním a vertikálním odsazením. * **Z-index** určuje, který prvek je v popředí (čím vyšší z-index tím víc v popředí). * **nastavení barev** - indikace stavu Online, Zaneprázdněn, Offline. #### **Chování** * zde máte možnost rozhodnout, zda chcete **zobrazovat tlačítko** ve stavu **zaneprázdněn** a ve stavu **offline** * **dostupnost WebChatu** - můžete zvolit **vyhodnocení routingu**, stav všech skupin, či stav jedné skupiny. {% hint style="warning" %} *Volba "vyhodnocení routingu" ovlivňuje mimo jiné chování chatbotů či routingu samotného!* {% endhint %} {% hint style="info" %} ***Modelová situace:*** * *Nastavujete Chování WebChat balíčku* * *WebChat balíček používá routing, který obsahuje skupinu operátorů a chatbota* * *Vyberete z nabídky položku podle "Stavu jedné skupiny" a zvolíte danou skupinu* ***--> Přítomnost chatbota v routingu nemá význam a stav widgetu je dán stavem skupiny!!!*** {% endhint %} ## **Pop-up** Pop-up je prvek, který vám pomůže upoutat pozornost návštěvníka na stránce. Může jím být text, vlastní obrázek nebo prvek v iframe, který se objeví po nastavené době. Velikost, odsazení nebo barvu textu si můžete sami nastavit. Pop-up lze ovšem také **zcela vypnout**. ### **WebChat** Zde můžete nastavit všechny parametry, které se týkají chatového okna a vstupních, výstupních a offline formulářů. Upravovat můžete: * **logo společnosti** - doporučujeme čtvercový formát obrázku nebo gifu. Jeho pozici pak můžete upravit v editoru. * **textace v horní liště** - tedy nastavení názvu společnosti, nastavení vstupní zprávy (možno v několika jazycích). * **barva jednotlivých prvků** - barva textů, barva konverzačních bublin operátora i klienta. * **umístění a odsazení** - poloha chatového okna (vpravo, vlevo, uprostřed...) a jeho odsazení od okrajů. * **velikost chatového okna** - můžete nastavit šířku a výšku zcela dle potřeby. {% hint style="success" %} *Pokud si nepřejete zobrazovat v chatovém okně informaci "Hledáme pro vás volného operátora", použijte nastavení ve spodní části okna.* {% endhint %} ### **Formuláře** Mluvii rozlišuje 4 druhy formulářů: * **vstupní** * **výstupní** * **offline** * **Call script (**používaný v případě telefonních kampaní). Pro svůj widget můžete použít buď mluvii formulář vytvořený v rámci editoru formulářů, nebo si pomocí iframe vytvořit vlastní. Pokud nechcete při konverzaci s klienty používat formuláře, můžete je jednoduše vypnout. {% hint style="info" %} *U offline formuláře je nutné zadat e-mail, ze kterého budou klientům odesílány **přepisy konverzací**.* {% endhint %} {% hint style="warning" %} *Vstupní a výstupní formulář u tlačítek typu Callback se řídí nastavením v rámci záložky **Showroom formuláře.*** {% endhint %} ### **Showroom** Showroom slouží k vizuálnímu nastavení pro spojení přes funkci CallBack či pro Pozvánky. Nastavuje se zde **pozadí showroomu**, tedy obrázek, vizualizace nebo barevné schéma. A samostatně se zde nastavuje vstupní a výstupní formulář. {% hint style="success" %} *Nastavení WebChatu si můžete ještě před jeho nasazením zkontrolovat kliknutím na **tlačítko „Náhled“.** Takovou kontrolu můžete provádět jak u **Showroomu, chatu, Pop-up nebo vybraného formuláře či Hero Card.*** {% endhint %} {% hint style="success" %} *Chcete-li si otestovat, jak se bude váš WebChat chovat v reálném prostředí, klikněte na **testovací stránku**. Pokud máte k WebChatu správně nastavený routing a skupinu, můžete si zkusit sezení od úplného začátku až po jeho konec.* {% endhint %} {% hint style="warning" %} *Pokud si potřebujete nastavit pozadí stránky pro potřeby **Pozvánek**, přesuňte se na záložku "Showroom" v rámci Výchozího WebChat balíčku.* {% endhint %}