Canais

Instalar o webchat SiteUp em sites WordPress

Duas formas de instalar o widget de webchat em sites WordPress: pelo plugin oficial SiteUp ou via edição do tema, com identificação automática de usuários logados.

Instalar o webchat SiteUp em sites WordPress

Para sites construídos em WordPress, há duas formas de publicar o widget de webchat: a via mais simples, com o plugin oficial; e a via manual, editando o tema, recomendada quando você quer mais controle ou já tem um theme child estruturado.

Antes de começar, tenha em mãos o website token do seu canal de webchat, encontrado em Configurações → Caixas de entrada → [seu webchat] → Configuração. Para uma visão geral do canal, veja Conectar webchat ao site.

Opção 1: plugin oficial SiteUp

Recomendada para a maioria dos casos. Não exige edição de código.

  1. No painel do WordPress, vá em Plugins → Adicionar novo
  2. Pesquise por "SiteUp Live Chat"
  3. Clique em Instalar agora e depois em Ativar
  4. Vá no novo menu SiteUp que aparece na sidebar
  5. Cole o website token e o base URL (https://app.siteup.com.br)
  6. Salve as alterações

O widget passa a aparecer automaticamente em todas as páginas. As opções do plugin permitem:

  • Excluir o widget de páginas específicas (ex: checkout WooCommerce)
  • Mostrar somente para visitantes não logados
  • Mostrar somente para visitantes logados
  • Passar automaticamente os dados do usuário WP logado para o SiteUp

Opção 2: instalação no tema (header.php ou functions.php)

Recomendada para quem mantém um theme child e prefere controle total. Nunca edite o arquivo de um tema pai diretamente — atualizações sobrescrevem suas alterações.

Via header.php

Edite o arquivo wp-content/themes/[seu-theme-child]/header.php e adicione antes do fechamento de </head>:

<script>
  (function(d,t) {
    var BASE_URL = "https://app.siteup.com.br";
    var g = d.createElement(t), s = d.getElementsByTagName(t)[0];
    g.src = BASE_URL + "/packs/js/sdk.js";
    g.defer = true;
    g.async = true;
    s.parentNode.insertBefore(g, s);
    g.onload = function() {
      window.chatwootSDK.run({
        websiteToken: "SEU_TOKEN_AQUI",
        baseUrl: BASE_URL
      });
    };
  })(document, "script");
</script>

Via functions.php (mais limpo)

Em vez de tocar no header.php, registre o snippet pelo hook wp_head:

function siteup_widget_init() {
  ?>
  <script>
    (function(d,t) {
      var BASE_URL = "https://app.siteup.com.br";
      var g = d.createElement(t), s = d.getElementsByTagName(t)[0];
      g.src = BASE_URL + "/packs/js/sdk.js";
      g.defer = true; g.async = true;
      s.parentNode.insertBefore(g, s);
      g.onload = function() {
        window.chatwootSDK.run({
          websiteToken: "SEU_TOKEN_AQUI",
          baseUrl: BASE_URL
        });
      };
    })(document, "script");
  </script>
  <?php
}
add_action('wp_head', 'siteup_widget_init');

Passando o usuário WP logado para o SiteUp

Para que o atendente veja nome e e-mail de usuários autenticados, expanda a função acima:

function siteup_widget_init() {
  $user_data = 'null';
  if ( is_user_logged_in() ) {
    $u = wp_get_current_user();
    $user_data = json_encode([
      'id'    => $u->ID,
      'email' => $u->user_email,
      'name'  => $u->display_name
    ]);
  }
  ?>
  <script>
    var SITEUP_USER = <?php echo $user_data; ?>;
    /* ... snippet padrão acima ... */
    g.onload = function() {
      window.chatwootSDK.run({ websiteToken: "TOKEN", baseUrl: BASE_URL });
      window.addEventListener("chatwoot:ready", function() {
        if (SITEUP_USER) {
          window.$chatwoot.setUser(SITEUP_USER.id, {
            email: SITEUP_USER.email,
            name: SITEUP_USER.name
          });
        }
      });
    };
  </script>
  <?php
}
add_action('wp_head', 'siteup_widget_init');

Sobre os identificadores chatwootSDK, chatwoot:ready e $chatwoot: são nomes globais expostos pela API JavaScript do widget (carregada via sdk.js). Mantenha-os exatamente como aparecem — são handles do SDK e não devem ser renomeados.

Customizações por página

Se quiser ocultar o widget em páginas específicas (ex: política de privacidade, checkout), use condicionais WP no início da função:

if ( is_page('checkout') || is_page('politica-de-privacidade') ) {
  return;
}

Validação final

Acesse o site em modo anônimo e confirme que o widget aparece. Faça login com um usuário de teste e abra uma conversa — no painel SiteUp, o contato deve vir com nome e e-mail preenchidos do WordPress, não como visitante anônimo.

Esse artigo respondeu sua duvida?

Falar com o time