> For the complete documentation index, see [llms.txt](https://c2dbr-pt.gitbook.io/c2dbr/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://c2dbr-pt.gitbook.io/c2dbr/configuracoes-chat2desk/widget-no-site-+-live-chat.md).

# Widget no Site + Live Chat

O primeiro passo é acessar as configurações seguindo o caminho Configuração > Widget no Site + Live Chat

<figure><img src="/files/6rz5pKgRQAd0PtJqU9Qa" alt=""><figcaption></figcaption></figure>

No painel abaixo, precisamos selecionar o canal que deseja configurar como indicado abaixo:

<figure><img src="/files/3KZ1TRVuUhkHHvdRDAre" alt=""><figcaption></figcaption></figure>

Após selecionar o canal é a hora de configurar o Widget.

<figure><img src="/files/xKlP5HBkLJQCtzmZJ15m" alt=""><figcaption></figcaption></figure>

* 1 – Este botão é para habilitar ou desabilitar o Widget
* 2 – Este campo irá mostrar todos os canais que você possui integrado na plataforma, que são visualizados na coluna do item 6.
* 3 – Nesta parte você poderá arrastar os itens do campo 2 para o campo 3 para adicionar ou remover itens do Widgets.
* 4 e 5 – Nesta opção é possível escolher a forma de visualização do Widget tanto na versão desktop para PC, ou para o Mobile.
* 6 – Neste item você poderá visualizar as alterações no Widget.

**Customização:**

Logo abaixo, você poderá escolher o tema do Widget, como no print:

<figure><img src="/files/s2qj6D4GsgmGOgfENBP6" alt=""><figcaption></figcaption></figure>

Na tela abaixo, você poderá escolher o ícone no Widget entre os quais já estão definidos ou escolher um próprio, como indicado no item 2. Você também pode escolher a posição onde ficará localizado o Widget no site, seja na versão mobile ou desktop, além da margem (a distância entre o Widget da lateral do site).

<figure><img src="/files/XiKxuM3HJhAvDpRzX5ds" alt=""><figcaption></figcaption></figure>

É possível escolher se o Widget vai aparecer de forma expandida como no print abaixo, ou de forma encolhida, apenas mostrando o ícone, que ao clicar se expande.

<figure><img src="/files/NLjwhYPrzx347aDUs8ue" alt=""><figcaption></figcaption></figure>

No print abaixo é possível escolher a ordenação dos ícones de forma horizontal ou vertical, abaixo está habilitado o modo horizontal.

<figure><img src="/files/UqTbndZPnEBum7JPmLoU" alt=""><figcaption></figcaption></figure>

**Chat online**

Nas configurações abaixo, são configurações relacionadas aos Live Chat

<figure><img src="/files/8g9VIcz8B9aznyOAimu9" alt=""><figcaption></figcaption></figure>

* **1 – Você pode programar para que o Live Chat se abra automáticamente no site para seu o visitante após determinados segundos.**
* 2 – Ao habilitar ou não, ao abrir o chat ou ao visitante clicar no chat, você poderá programar se a URA, Mensagens de boas vindas será enviadas após o envio da primeira mensagem.
* 3 – Nesta opção, diferente da opção 2, o sistema irá enviar a URA e Mensagens de Boas Vindas ao clicar no bate-papo. Neste caso, é possível habilitar a opção de Deletar Chats Vazios, para que o sistema apague os chats vazios.

<figure><img src="/files/xg2QXzutTGqSYf6AqxDM" alt=""><figcaption></figcaption></figure>

**No print acima, os itens marcados se referem:**

* 1 – É possível escolher a cor do seu Live Chat
* 2 – Você pode renomear e colocar o nome do seu Live Chat
* 3 – Você pode escolher se o nome e a foto irá ser mostrado para seu visitante no chat no Live Chat.

**Campos obrigatórios no Live Chat**

<figure><img src="/files/0DE6dqWwKYX3QdxPkvSP" alt=""><figcaption></figcaption></figure>

Você poderá colocar campos obrigatórios dentro do Live Chat, tanto dentro do Horário de Atendimento ou Fora do Horário.

É importante observar que é possível colocar campos obrigatórios para ser preenchido em cada caso. Tais campos são os mesmos que estão presente nas Configurações Gerais.

**Código Fonte do Widget:**\
O sistema gera um código fonte em javascript que você facilmente copia e cola em seu footer ou na página onde deseja mostrar o widget.