Como colocar o chat no site
Como colar o código do Web Chat no seu site, com exemplos para WordPress, Next.js, Vue e PHP.
Depois de criar o canal de Web Chat e copiar o código do painel, basta colá-lo na página. Não é preciso instalar nada: o OSBChat cuida do funcionamento do chat.
O código é uma linha de script. O jeito de colá-lo muda conforme a tecnologia do seu site, mas o resultado é o mesmo.
O que o código contém
Copie sempre o código pronto do painel: ele já vem com os seus valores.
Exemplo em HTML simples
Cole antes do fechamento do body:
<script
src="https://seu-osbchat.com/widget.js"
defer
data-integration-id="123"
data-api-base="https://seu-osbchat.com"
data-widget-key="SUA_CHAVE"
></script>
WordPress e outros gerenciadores de conteúdo
Use a opção de adicionar código no rodapé do tema (ou um plugin de "scripts no rodapé") e cole o código ali. Assim ele aparece em todas as páginas.
Next.js
No layout principal, use o componente Script do Next.js com os mesmos dados do código:
import Script from 'next/script';
<Script
src="https://seu-osbchat.com/widget.js"
strategy="afterInteractive"
data-integration-id="123"
data-api-base="https://seu-osbchat.com"
data-widget-key="SUA_CHAVE"
/>
Vue
Cole o código no index.html, antes do fechamento do body, como no exemplo de HTML simples.
PHP
Cole o código no rodapé do seu modelo de página (uma vez por página que deve mostrar o chat).
Cuidados
- Sites autorizados: o endereço do site onde o chat aparece precisa estar em Origens permitidas no canal. Se o site abre com e sem
www, inclua os dois. - Chave: não a publique em repositórios abertos. Se ela vazar, gere outra no canal e atualize o código.
- Uma vez só: cole o código uma única vez por página, para não aparecerem dois chats.