O WhatsForm disponibiliza um conjunto de funções JavaScript que permitem controlar o widget de forma programática. Use-as para criar interações personalizadas, acionar o widget com base no comportamento do usuário ou integrá-lo à sua interface existente.
Funções disponíveis
whatsform.open()
Abre o widget do WhatsForm. Se o widget já estiver aberto, chamar esta função novamente não tem efeito.
whatsform.open();Exemplo: Abrir o widget quando um usuário clicar em um botão.
<button onclick="whatsform.open()">Fale conosco</button>
whatsform.close()
Fecha o widget do WhatsForm. Se o widget já estiver fechado, chamar esta função novamente não tem efeito.
whatsform.close();Exemplo: Fechar o widget após o envio de um formulário ou ao navegar para fora de uma seção.
<button onclick="whatsform.close()">Fechar Chat</button>whatsform.toggle()
Alterna o widget entre os estados aberto e fechado. Se o widget estiver aberto, fecha. Se estiver fechado, abre.
whatsform.toggle();Exemplo: Use um único botão para abrir e fechar o widget.
<button onclick="whatsform.toggle()">💬 WhatsApp</button>Exemplos de uso
Abrir ao rolar a página
Acionar o widget quando o usuário rolar além de um certo ponto na página.
window.addEventListener('scroll', function () {
if (window.scrollY > 1500) {
whatsform.open();
}
});Abrir após um delay
Exibir o widget automaticamente após o usuário ficar na página por um tempo.
setTimeout(() => {
whatsform.open();
}, 15000); // Abre após 15 segundosFechar após inatividade
let inactivityTimer;
function resetTimer() {
clearTimeout(inactivityTimer);
inactivityTimer = setTimeout(() => {
whatsform.close();
}, 30000); // Fecha após 30 segundos de inatividade
}
window.addEventListener('mousemove', resetTimer);
window.addEventListener('keydown', resetTimer);Alternar com um botão flutuante personalizado
Ocultar o botão padrão e usar seu próprio botão estilizado.
<script async src="https://whatsform.com/launcher.js" id="wf-widget" data-id="demo" data-message="Message on WhatsApp"></script>
<script>window.whatsformHideButton = true;</script>
<button class="my-custom-chat-btn" onclick="whatsform.toggle()">
Precisa de ajuda?
</button>Observações importantes
Estas funções estão disponíveis apenas após o carregamento completo do script do WhatsForm. Se você as chamar imediatamente no carregamento da página, podem não estar prontas ainda. Envolva chamadas antecipadas em um timeout ou aguarde o evento
load.Combine estas funções com
window.whatsformHideButton = truese quiser substituir completamente o botão padrão pela sua própria interface.Todas as três funções funcionam com todos os tipos de widget do WhatsForm.
Ainda precisa de ajuda?
Fale conosco