Quem desenvolve pode decidir exatamente onde a caixa de chat aparece, basta adicionar algumas opções de configuração ao código de instalação do Smartsupp. Aqui você aprende como colocar a caixa de chat do lado esquerdo, afastar da posição padrão, usar outra posição só no celular ou esconder no celular.
Avançado: defina a posição no código de instalação
🟡 Nota: Você vai precisar ter acesso de desenvolvedor ao código do seu site. Colocar a caixa de chat do lado esquerdo está disponível a partir do plano Solo.
Adicione as opções logo na parte de configuração do código de instalação: depois da linha _smartsupp.key e antes do loader (a parte que começa com window.smartsupp||). A caixa de chat lê essas opções logo ao carregar, então elas precisam estar ali antes do loader rodar.
Colocar a caixa de chat no lado esquerdo:
<script>var _smartsupp = _smartsupp || {};_smartsupp.key = 'YOUR_SMARTSUPP_KEY';_smartsupp.orientation = "left";// ...restante do seu código de instalação (o loader)</script>Afastar a caixa de chat da posição padrão (valores em pixels):
_smartsupp.offsetX = 20; // Afasta da borda lateral_smartsupp.offsetY = 100; // Sobe a partir da borda inferior
Usar outra posição só no celular:
<script>var _smartsupp = _smartsupp || {};_smartsupp.key = 'YOUR_SMARTSUPP_KEY';if (window.innerWidth < 768) { _smartsupp.offsetY = 150;}// ...restante do seu código de instalação (o loader)</script>Esconder a caixa de chat somente no celular (ela continua aparecendo no desktop; disponível em todos os planos):
_smartsupp.hideMobileWidget = true;
Como fazer:
Abra o código do seu site e encontre o script de instalação do Smartsupp.
Adicione as opções que você precisa logo depois da linha
_smartsupp.keye antes do loader.Ajuste os valores conforme o visual do seu site.
Salve as mudanças e acesse seu site em uma janela anônima ou privada para testar a nova posição. Lembre de conferir também no celular.
💡 Dica: Comandos como smartsupp('chat:position', ...) não funcionam. A caixa de chat ignora esses comandos e o console do navegador mostra "Unknown API command". Para ver todas as opções de configuração, acesse a documentação para desenvolvedores.
O que você pode fazer agora?
💡 Precisa de mais ajuda? Fale com a nossa equipe de suporte — estamos prontos para ajudar você!