> ## Documentation Index
> Fetch the complete documentation index at: https://help.treble.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# WhatsApp dentro do Salesforce

> Como criar uma aba personalizada para que seus assessores vejam e respondam conversas de WhatsApp sem sair do CRM.

Você pode incorporar a caixa de entrada de conversas do Treble **dentro do Salesforce**, como mais uma aba da barra de navegação. O assessor entra no Salesforce, clica na aba e responde ao WhatsApp a partir dali.

<img src="https://mintcdn.com/trebleai/n_48dzI5l_tB6XfZ/images/salesforce-custom-tab-5.png?fit=max&auto=format&n=n_48dzI5l_tB6XfZ&q=85&s=012e13587eb22ff95ebfa2cb70474e7b" alt="A aba do Treble WhatsApp dentro do Salesforce" className="mx-auto" width="3024" height="1714" data-path="images/salesforce-custom-tab-5.png" />

<Note>
  Isso é configurado no Salesforce, com um usuário administrador, e é independente da integração de dados. Você pode tê-lo com qualquer um dos dois tipos de integração.
</Note>

<div class="hr" />

## Antes de começar

<Steps>
  <Step title="Tenha à mão sua API key do Treble">
    Você a encontra na plataforma do Treble, em **Configurações → Desenvolvedores → API KEY**.

    <Warning>
      A API key é uma credencial. Trate-a como uma senha: não a publique, não a cole em canais abertos e não a compartilhe fora da sua equipe de administração do Salesforce.
    </Warning>
  </Step>

  <Step title="Confirme que seus assessores existem como agentes no Treble">
    A aba faz login com o **e-mail do usuário do Salesforce**. Se esse e-mail não corresponder a um agente do Treble, a aba não vai conseguir abrir a caixa de entrada dele.
  </Step>
</Steps>

<div class="hr" />

## 1. Criar a aba web

<Steps>
  <Step title="Acesse Setup → Tabs">
    Pesquise "tabs" na barra de busca do Setup e abra **Tabs**. Desça até a seção **Web Tabs** e clique em **New**.

    <img src="https://mintcdn.com/trebleai/n_48dzI5l_tB6XfZ/images/salesforce-custom-tab-1.png?fit=max&auto=format&n=n_48dzI5l_tB6XfZ&q=85&s=68052676e21154c95cdbf87bf5ebbf40" alt="Criar uma nova Web Tab no Salesforce" className="mx-auto" width="3024" height="1718" data-path="images/salesforce-custom-tab-1.png" />
  </Step>

  <Step title="Escolha o estilo da aba">
    No passo 1, mantenha o estilo padrão (página inteira). Clique em **Next**.
  </Step>

  <Step title="Defina o nome e a altura">
    <img src="https://mintcdn.com/trebleai/n_48dzI5l_tB6XfZ/images/salesforce-custom-tab-2.png?fit=max&auto=format&n=n_48dzI5l_tB6XfZ&q=85&s=e3fcb875706bd4f03946fd18dda76b6a" alt="Propriedades da aba web" className="mx-auto" width="3024" height="1716" data-path="images/salesforce-custom-tab-2.png" />

    | Campo | Valor sugerido |
    | - | - |
    | **Tab Label** | `Treble WhatsApp` |
    | **Tab Name** | `Treble_WhatsApp` |
    | **Tab Style** | O ícone e a cor que você preferir |
    | **Content Frame Height (pixels)** | `600` |

    <Tip>
      600 pixels funciona bem na maioria das telas. Se seus assessores trabalham em monitores grandes e a caixa de entrada parecer apertada, você pode aumentar esse valor depois editando a aba.
    </Tip>
  </Step>

  <Step title="Insira a URL do Treble">
    No passo 3, no campo **Button or Link URL**, cole:

    ```
    https://agent-api.treble.ai/agent/login/salesforce?email={!$User.Email}&apiKey=TU_API_KEY
    ```

    Substitua `TU_API_KEY` pela chave que o Treble forneceu a você. Deixe `{!$User.Email}` como está: é um campo de mesclagem do Salesforce que insere automaticamente o e-mail do usuário que abre a aba, e é o que faz cada assessor ver **sua própria** caixa de entrada.

    Em **Encoding**, mantenha `Unicode (UTF-8)`.

    <Warning>
      Não substitua `{!$User.Email}` por um e-mail fixo. Se fizer isso, todos os seus assessores entrariam na caixa de entrada da mesma pessoa.
    </Warning>
  </Step>

  <Step title="Defina a visibilidade e salve">
    Nos passos 4 e 5, escolha quais perfis podem ver a aba e em quais aplicativos ela deve aparecer. Salve.
  </Step>
</Steps>

<div class="hr" />

## 2. Adicionar a aba à barra de navegação

Criar a aba não a torna visível por si só: é preciso adicioná-la ao aplicativo.

<Steps>
  <Step title="Abra o editor de navegação">
    No aplicativo onde você a quer (por exemplo *Sales*), clique no **ícone de lápis** no final da barra de navegação.

    <img src="https://mintcdn.com/trebleai/n_48dzI5l_tB6XfZ/images/salesforce-custom-tab-3.png?fit=max&auto=format&n=n_48dzI5l_tB6XfZ&q=85&s=5c4663f0e993504cd583e05446768b0e" alt="Ícone de lápis para editar a navegação" className="mx-auto" width="3024" height="1712" data-path="images/salesforce-custom-tab-3.png" />
  </Step>

  <Step title="Adicione Treble WhatsApp">
    Clique em **Add More Items**, procure a aba que você criou e adicione-a. Arraste-a para a posição que quiser e clique em **Save**.

    <img src="https://mintcdn.com/trebleai/n_48dzI5l_tB6XfZ/images/salesforce-custom-tab-4.png?fit=max&auto=format&n=n_48dzI5l_tB6XfZ&q=85&s=d453b899547b302b9fe307e46a091143" alt="Adicionar Treble WhatsApp aos itens de navegação" className="mx-auto" width="3024" height="1714" data-path="images/salesforce-custom-tab-4.png" />
  </Step>
</Steps>

<Check>
  Pronto. A aba **Treble WhatsApp** aparece na barra de navegação e abre a caixa de entrada do assessor que está conectado.
</Check>

<div class="hr" />

## O que o assessor vê

Dentro da aba, ele tem:

* **Conversas**: as conversas ativas que foram atribuídas a ele, para ler e responder.
* **Contatos**: a lista de contatos, a partir da qual ele pode criar um novo ou enviar um template (HSM) para abrir uma conversa.

<Info>
  A caixa de entrada mostra as conversas **atribuídas a esse assessor**. Se um assessor disser que não vê nada, o mais provável é que ele simplesmente não tenha conversas atribuídas naquele momento, e não que a aba esteja mal configurada.
</Info>

<div class="hr" />

## Problemas frequentes

<AccordionGroup>
  <Accordion title="A aba aparece em branco ou não carrega">
    Geralmente é uma destas:

    1. **A API key está errada ou incompleta.** Verifique se ela foi colada por completo, sem espaços no final.
    2. **O e-mail do usuário do Salesforce não corresponde a um agente do Treble.** A aba entra com o e-mail do usuário conectado; se ele não existir no Treble, não há caixa de entrada para mostrar.
    3. **Restrições do navegador.** Algumas configurações de segurança bloqueiam o conteúdo incorporado. O Salesforce avisa sobre isso na tela de criação da aba.
  </Accordion>

  <Accordion title="O assessor entra no Salesforce, mas não consegue entrar no Treble">
    Uma sessão do Salesforce **não** é uma sessão do Treble. A aba usa o e-mail do usuário do Salesforce para identificar o agente, mas esse agente precisa existir no Treble e ter suas próprias credenciais.

    Se o assessor não conseguir entrar, o caminho é redefinir a senha **do Treble** dele, não a do Salesforce. E se ele não existir como agente, é preciso criá-lo primeiro.

    <a class="article-link" href="/pt/docs/agent-platform/admin/tags-teams#criar-um-novo-agente"><p>Criar um novo agente</p><Icon icon="arrow-up-right-from-square" iconType="solid" /></a>
  </Accordion>

  <Accordion title="Todos os assessores veem a mesma caixa de entrada">
    `{!$User.Email}` foi substituído por um e-mail fixo na URL. Edite a aba e coloque novamente o campo de mesclagem.
  </Accordion>

  <Accordion title="A aba não aparece na barra de navegação">
    Criar a aba e adicioná-la ao aplicativo são dois passos diferentes. Revise o passo 2 deste guia e confirme que o perfil do assessor tem a aba como visível.
  </Accordion>

  <Accordion title="A caixa de entrada aparece cortada verticalmente">
    Aumente o valor de **Content Frame Height** na configuração da aba.
  </Accordion>
</AccordionGroup>

<div class="hr" />

## Próximos passos

<CardGroup cols={2}>
  <Card title="Transferir para um assessor" icon="headset" href="/pt/docs/integrations/salesforce/blocks/human-transfer">
    Como uma conversa chega à caixa de entrada de um assessor.
  </Card>

  <Card title="Iniciar conversas a partir do Salesforce" icon="bolt" href="/pt/docs/integrations/salesforce/embed/automation-flow-package">
    Disparar uma campanha do Treble a partir de um automation flow.
  </Card>
</CardGroup>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.