Como Adicionar o Chatbot de IA Asyntai ao October CMS

Guia passo a passo para sites October CMS

Plataforma:

Passo 1: Obtenha Seu Código de Incorporação

Primeiro, acesse seu Dashboard Asyntai e role para baixo até a seção "Embed Code". Copie seu código de incorporação exclusivo que se parecerá com isto:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Nota: O código acima é apenas um exemplo. Você deve copiar seu próprio código de incorporação exclusivo do seu Dashboard, pois ele contém seu ID de widget pessoal.

Etapa 2: Adicionar ao Template de Layout (Recomendado)

A maneira recomendada de adicionar o chatbot é editando seu layout padrão no backend do October CMS:

Faça login no backend do October CMS
Vá para CMS > Layouts no menu principal
Abra seu layout padrão (geralmente default.htm)
Encontre o fechamento </body> e o {% scripts %} placeholder
Adicione seu código de incorporação Asyntai logo antes {% scripts %} e </body>:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% scripts %} </body>
Clique em "Save" para aplicar suas alterações

Dica: Placing the script before {% scripts %} and </body> ensures it loads after the page content, which is recommended for chat widgets and won't slow down your page loading.

Alternative Method 1: Using {% put scripts %} Block

Você pode usar o placeholder de scripts do October CMS para injetar o chatbot de uma página ou partial:

Abra qualquer página ou partial no editor do CMS
Adicione o seguinte código usando o {% put scripts %} bloco:
{% put scripts %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endput %}
Substitua YOUR_WIDGET_ID pelo ID real do seu widget no painel
Clique em "Save"

Nota: For this method to work, your layout must include the {% scripts %} placeholder in its markup. This is where October CMS renders all injected scripts. Most default layouts already include this tag.

Método Alternativo 2: Usando Componente PHP

Se você prefere uma abordagem programática, pode adicionar o script do chatbot via um componente personalizado:

Crie ou modifique um componente no seu plugin do October CMS
No método onRun() do componente, use o método addJs():
public function onRun() { $this->addJs('https://asyntai.com/static/js/chat-widget.js', [ 'async' => true, 'data-asyntai-id' => 'YOUR_WIDGET_ID' ]); }
Substitua YOUR_WIDGET_ID pelo seu ID de widget real
Registre o componente nas páginas onde deseja que o chatbot apareça

Dica: Usar um componente oferece controle programático sobre quando e onde o chatbot carrega. Você pode adicionar lógica condicional dentro de onRun() para controlar o carregamento com base em funções de usuário, tipos de página ou outros critérios.

Método Alternativo 3: Usando um Partial

Você pode criar um partial reutilizável para o widget de chatbot:

Vá para CMS > Partials no backend do October CMS
Clique em "+ Add" para criar um novo partial
Nomeie-o como asyntai-widget.htm
Adicione seu código de incorporação do Asyntai ao partial:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
Clique em "Save"
Abra seu template de layout e inclua o partial antes de </body>:
{% partial 'asyntai-widget' %}
Salve o layout

Dica: Usar um partial facilita a ativação ou desativação do chatbot em todo o seu site, bastando adicionar ou remover a inclusão do partial no seu layout.

Passo 3: Verifique a Instalação

Após salvar suas alterações, visite seu site October CMS em uma nova aba do navegador ou janela anônima. Você deverá ver o botão do widget de chat no canto inferior direito. Clique nele para verificar se abre e funciona corretamente.

Não está vendo o widget? Certifique-se de que salvou todas as alterações no backend do CMS. Limpe o cache do navegador ou visualize em uma janela anônima. Se o seu site usa cache, limpe o cache do October CMS executando php artisan cache:clear na linha de comando, ou use a opção Settings > System > Clear Cache no backend.

Seleção de Layout: Certifique-se de que as páginas onde você deseja que o chatbot apareça estão usando o layout correto. Você pode verificar qual layout uma página usa abrindo a página em CMS > Pages e verificando o menu suspenso Layout nas configurações da página.