TAU Widget

Exemplos Práticos

Implementações completas do TAU Widget para diferentes segmentos e casos de uso.

Exemplos Práticos

E-commerce — suporte contextual por página

Widget que adapta a mensagem conforme a página visitada:

<script>
  function getContextualConfig() {
    const path = window.location.pathname;
    const base = {
      appId: 'minha-loja.com',
      chatbotButtonBackground: '#FF6B35',
      chatbotButtonSize: 65,
      mode: 'cool'
    };

    if (path.includes('/produto/')) {
      return { ...base, defaultMessage: 'Tenho dúvidas sobre este produto', defaultRoute: 'chat' };
    }
    if (path.includes('/carrinho/')) {
      return { ...base, defaultMessage: 'Preciso de ajuda com meu carrinho', autoOpen: true };
    }
    if (path.includes('/checkout/')) {
      return { ...base, defaultMessage: 'Estou com problemas no checkout',
        enableWhatsApp: true, whatsAppMessage: 'URGENTE: Problema no checkout!' };
    }
    return { ...base, defaultMessage: 'Como posso ajudar com sua compra?' };
  }

  window.taubotConfig = getContextualConfig();

  (function() {
    var script = document.createElement('script');
    script.src = 'https://app.taubot.ai/widget/widget.js';
    script.async = true;
    document.head.appendChild(script);
  })();
</script>

E-commerce — carrinho abandonado

Detecta quando o usuário tenta sair com itens no carrinho:

const cartItems = JSON.parse(localStorage.getItem('cart') || '[]');

if (cartItems.length > 0) {
  let triggered = false;
  document.addEventListener('mouseleave', function(e) {
    if (e.clientY < 0 && !triggered) {
      triggered = true;
      setTimeout(() => {
        window.myChatbot?.openChatWithMessage(
          'Espere! Você esqueceu itens no carrinho. Posso ajudar a finalizar com 10% de desconto!'
        );
      }, 1000);
    }
  });
}

Plataforma educacional

Adapta o suporte conforme o progresso do aluno:

const progress = getUserProgress(); // sua função

window.taubotConfig = {
  appId: 'escola-online.edu.br',
  chatbotButtonBackground: '#4CAF50',
  mode: 'default',
  defaultMessage: progress < 30
    ? 'Preciso de ajuda para começar os estudos'
    : progress < 70
    ? 'Tenho dúvidas sobre o conteúdo atual'
    : 'Estou me preparando para a avaliação final'
};

Clínica médica — horário de funcionamento

function isOfficeHours() {
  const now = new Date();
  const day = now.getDay();   // 0 = domingo
  const hour = now.getHours();
  // Seg–Sex 8h–18h
  if (day >= 1 && day <= 5 && hour >= 8 && hour < 18) return true;
  // Sáb 8h–12h
  if (day === 6 && hour >= 8 && hour < 12) return true;
  return false;
}

window.taubotConfig = {
  appId: 'clinica-saude.med.br',
  chatbotButtonBackground: '#2196F3',
  mode: 'cool',
  defaultRoute: 'chat',
  enableWhatsApp: !isOfficeHours(),
  whatsAppMessage: 'Olá! Gostaria de agendar uma consulta.',
  defaultMessage: isOfficeHours()
    ? 'Gostaria de agendar uma consulta'
    : 'Estamos fora do horário — clique para chamar no WhatsApp'
};

Hotel — hóspede vs. visitante

const guestId = localStorage.getItem('hotel_guest_id');
const room = localStorage.getItem('room_number');

window.taubotConfig = guestId
  ? {
      appId: 'resort-paradise.com.br',
      chatbotButtonBackground: '#4CAF50',
      mode: 'cool',
      defaultMessage: `Quarto ${room}: Como posso ajudar?`,
      user: {
        id: guestId,
        name: localStorage.getItem('guest_name'),
        hash: localStorage.getItem('guest_hmac') // gerado no servidor
      }
    }
  : {
      appId: 'resort-paradise.com.br',
      chatbotButtonBackground: '#FF9800',
      mode: 'cool',
      defaultMessage: 'Gostaria de fazer uma reserva',
      enableWhatsApp: true,
      whatsAppMessage: 'Olá! Gostaria de informações sobre reservas'
    };

SaaS B2B — suporte escalonado por plano

const user = getCurrentUser(); // sua função

const supportConfig = {
  free:       { background: '#9E9E9E', message: 'Tenho uma dúvida sobre o plano' },
  pro:        { background: '#4834D4', message: 'Preciso de suporte técnico' },
  enterprise: { background: '#FFB300', message: 'Suporte prioritário — preciso de ajuda urgente' }
};

const plan = user?.plan || 'free';
const cfg = supportConfig[plan];

window.taubotConfig = {
  appId: 'meu-saas.com.br',
  chatbotButtonBackground: cfg.background,
  defaultMessage: cfg.message,
  mode: plan === 'enterprise' ? 'cool' : 'default',
  user: user ? {
    id: user.id,
    hash: user.widgetHash, // gerado no servidor
    name: user.name,
    email: user.email
  } : undefined
};

On this page