> For the complete documentation index, see [llms.txt](https://help.impact.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.impact.com/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/widget-and-microsite-components-explained.md).

# Explicação dos componentes de widget e microsite

<a href="https://pxa.impact.com/student/activity/2359603?sid=0c0e3e5c-54c9-4435-9bee-ebcdccb7f292&#x26;sid_i=0?utm_source=app.impact.com&#x26;utm_medium=owned-platform&#x26;utm_content=&#x26;utm_campaign=help-center" class="button primary">Faça o curso PXA</a>

{% hint style="success" %}
**Limitado**: Os componentes, além dos fornecidos nos modelos disponíveis, estão disponíveis apenas para certas edições de produto ou complementos. Se você quiser um controle mais granular sobre quais componentes seus microsites usam, entre em contato conosco para fazer upgrade do seu programa.
{% endhint %}

Os componentes são os blocos de construção individuais, como imagens de destaque e cartões de tarefas, que compõem o widget ou o microsite do seu programa Advocate. Esses elementos moldam a [experiência do participante](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/introduction-to-participant-experiences.md) e podem ser personalizados para se alinhar à sua marca.

Este artigo fornece uma lista categorizada dos componentes disponíveis nos editores de widget e microsite. A maioria dos componentes oferece suporte a estilo e personalização, embora alguns tenham limitações de design. Você também pode visualizar os estados do seu componente na interface do editor.

<details>

<summary>Estatísticas</summary>

Use *Estatísticas* componentes para permitir que seus participantes saibam como estão indo no seu programa. Para ver uma lista das estatísticas que esses componentes podem oferecer suporte, visite [Estatísticas do Widget e do Microsite](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/widget-and-microsite-statistics-explained.md).

| Componente                      | Descrição                                                                                                                                                                |
| ------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Saldo de pontos                 | Mostra o saldo de pontos do participante. Usado em programas Advocate que recompensam os participantes com pontos.                                                       |
| Gift Cards Ganhos               | Mostra a contagem de recompensas em gift card conquistadas pelo Advocate.                                                                                                |
| Indicações                      | Exibe quantas indicações o participante fez. Inclui indicações iniciadas e convertidas.                                                                                  |
| Contêiner com Três Estatísticas | Um modelo com espaço para três estatísticas. As estatísticas exibidas podem ser alteradas. Estatísticas podem ser adicionadas e removidas conforme desejado.             |
| Outra estatística               | Exibe uma estatística de sua escolha. Você pode selecionar entre uma estatística de indicação, várias estatísticas de recompensa ou criar uma estatística personalizada. |

<figure><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fh7SqO0ijZKN04RyBL6ma%2FScreenshot%202026-05-20%20at%2009.51.59.png?alt=media&amp;token=55e2a10a-895a-4913-a2ba-16877a196a94" alt="" width="563"><figcaption></figcaption></figure>

</details>

<details>

<summary>Componentes comuns</summary>

*Componentes comuns* são amplamente usados para aprimorar tanto a funcionalidade quanto a consistência do design em todo o seu widget ou microsite. Eles abrangem elementos visuais e estruturais de uso geral, como imagens de destaque, formatação de layout e etapas descritivas do programa.

| Componente                         | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
| ---------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Imagem de Destaque em Duas Colunas | <p>Uma imagem de banner e texto de cabeçalho ocupando duas colunas. A imagem, o texto e a cor de fundo podem ser atualizados.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-112e3e854f2ec884d09dcbf3c3a0dd91132b8065%2F0d6b6b7a5f3894b815b738a15afb7bd08e1ee77413858922235268a0119f528d.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                 |
| Imagem principal sobreposta        | <p>Uma imagem de banner com texto sobreposto. A imagem, o texto e a cor de fundo podem ser atualizados.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-def9dab1f6744d99f704005955522c5cae8f7ca1%2F1c8f53dc5117ebce1719f58d4974f97d4cb9fdddaa0a6d8741277d00139a5178.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                       |
| Imagem                             | <p>Uma imagem. A cor de fundo, o alinhamento, a altura e a largura podem ser alterados.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-e9f631d5fae5baef21e495c18995bcc41931ff86%2Fe0c44f0accab2819658563d03164459fb470eedf4929c402138476b2eb8afa36.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                       |
| Botão de link                      | <p>Um botão clicável que redireciona os participantes para o link selecionado. A cor do botão é controlada pela Cor da Marca definida no nível do Contêiner da Marca.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-875e756c5a4d4a79e4b62187ff8acb00da68f51d%2Fc0ebb75eb41b33f85ab7695f287a373730909122d616a7c19fd4bdd0675c8787.png?alt=media" alt="" data-size="original"></p>                                                                                                                         |
| Explicação do Programa             | <p>Um modelo que explica como um programa Advocate funciona, como ganhar recompensas. Inclui duas etapas de explicação do programa por padrão. Mais etapas podem ser adicionadas. A cor é controlada pela Cor da Marca definida no nível do Contêiner da Marca.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-ccd03061b907a18c914385b9fbdfcc1c54dfdd7e%2Fd7a265c23d586b3a6bcd9198cbee8eea2fedda9817794a468f309717081e72c0.png?alt=media" alt="" data-size="original"></p>                               |
| Etapa da Explicação do Programa    | <p>Adicione texto descritivo para explicar parte do seu programa. Cabe dentro de um componente de explicação do programa. A cor é controlada pela Cor da Marca definida no nível do Contêiner da Marca.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-abf1a9d883d813187d2013fc7c8cd815639c0351%2Fba66c3ec6beb608ff42bb2cbb3757c5e98ad4e1946809fee380b0069cee8677a.png?alt=media" alt="" data-size="original"></p>                                                                                       |
| Linha do Tempo do Programa         | <p>Exiba uma visão geral da jornada de indicação e das recompensas para seus participantes. Adicione ou remova entradas da linha do tempo conforme necessário. A cor do ícone circular e das linhas entre as entradas é controlada pela Cor da Marca definida no nível do Contêiner da Marca.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-ad4d74aab6ba3e437ed0b5c2ba350e95e584491c%2Fecfa298fa0a457c5061fc7de31fa195868d524d0905ba16cf512470cb6a9de33.png?alt=media" alt="" data-size="original"></p> |
| Entrada da Linha do Tempo          | <p>Cabe dentro de um componente de linha do tempo do programa para mostrar uma etapa da jornada de indicação. A cor do ícone circular e das linhas entre as entradas é controlada pela Cor da Marca definida no nível do Contêiner da Marca.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-0d702f85b541b49847a0131fa6094cf37d45b95b%2F6cce8eebc7410fd43031702177f3fa6450cb172e8d420a31b7041ccc926011be.png?alt=media" alt="" data-size="original"></p>                                                  |
| Exibição do Nome do Usuário        | <p>Busca dinamicamente o nome completo do participante. O padrão é “Usuário Anônimo” se o participante não tiver informado um nome.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-454b0c94d3cdf37d3bec1f9feb38efa895ce21d4%2F333618f77b6dee4e26c899eb87962d2769ebbc161da05a90aadb3a5f2b59c3cf.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                           |

</details>

<details>

<summary>Recompensas</summary>

{% hint style="info" %}
**Observação:** *Recompensa* componentes só podem ser usados para widgets e microsites com acesso verificado.
{% endhint %}

| Componente                 | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              |
| -------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Feed de Cartões de Tarefas | <p>Os cartões de tarefas permitem que seus usuários executem ações ou vejam o progresso em direção às metas do programa Advocate diretamente no widget ou microsite. Este componente adiciona vários cartões de tarefas ao seu widget ou microsite. A cor do botão é controlada pela Cor da Marca definida no nível do Contêiner da Marca.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-d1742cb883be61d63192bcb218ab5d53757e9e82%2Fe992aa7cf1f554169c1e60d351739a9bd8990ad01c4c29bf1deb2d971e07c8c4.png?alt=media" alt="" data-size="original"></p> |
| Troca de Recompensas       | <p>Permite que os participantes troquem recompensas ganhas por outro tipo de recompensa.</p><p>Você precisa ter <a href="/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/advocate-rewards/reward-exchange-explained.md">Troca de Recompensas</a> configurado para usar este recurso.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-bbfbff1ec1b5d7b899ab55217f300e5bdf820502%2F914a34e427693bf936d3363a8075046dd25ef3de091552fc7de4cb82e00b3d7b.png?alt=media" alt="" data-size="original"></p>                                      |
| Tabela de Recompensas      | <p>Exibe uma lista de recompensas que o participante ganhou. Pode incluir recompensas manuais e/ou recompensas ganhas em vários programas Advocate.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-5b4272b710f08544f2091db011583b6300278788%2Facbbaa66b154eaf370ec5457fd9e77b39272a679f7a9c67b17383c5530362f92.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                        |
| Coluna de Nota do Cliente  | <p>Adicione outra coluna de nota à tabela de recompensas. Deve ser colocada dentro do componente Tabela de recompensas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-49a7a7000c4e43d73944d65d9268d049ce733f22%2F4bb3b31be09584ce982c27d57b373dc3ba807de9f29be528bab2361ae68d8c8e.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                    |
| Coluna de Data             | <p>Adicione outra coluna de data à tabela de recompensas. Deve ser colocada dentro do componente Tabela de recompensas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-9f1dabcef083a77ff77adb59d8d2877821b52e6c%2Fe36fb74a08d833bfbb0ebae4b1ef3ba7b49018b00c9cf835c75f1a6a73f3df9f.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                    |
| Coluna de Recompensa       | <p>Adicione outra coluna de recompensa à tabela de recompensas. Deve ser colocada dentro do componente Tabela de recompensas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-e64ef4645152bb65dd8c3e0ad3b8bee76f930f16%2Fd32357695c9503d7751f493e28b36d9bd8ee1af725556d43a072b2dbc2d1e9f0.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                              |
| Coluna de Origem           | <p>Adicione outra coluna de origem à tabela de recompensas. Deve ser colocada dentro do componente Tabela de recompensas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-e22f21797957227a12deafc7384625cf77154c01%2F57891cdf76885a886769e0fa768567c48e36f38c00a0e72e25ca640a21e6c92e.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                  |
| Coluna de Status           | <p>Adicione outra coluna de status à tabela de recompensas. Deve ser colocada dentro do componente Tabela de recompensas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-10a40c5e3746406038e4e8bac76d9fffabfa2733%2F73173dd2ce38046c737485ea1c0123f1d51c18195c684f59ab776aac9f6f76b9.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                  |

</details>

<details>

<summary>Componentes do Microsite</summary>

*Microssite* componentes são usados principalmente para o formulário de cadastro e a barra lateral de navegação do seu microsite. Esses componentes não podem ser adicionados aos widgets do programa.

| Componente                            | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
| ------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Campo de Checkbox do Formulário       | <p>Adicione uma caixa de seleção ao formulário de cadastro. Você pode mapear se a caixa foi marcada para um campo personalizado no participante do Advocate. Leia Ver Suas Submissões do Formulário de Cadastro do Microsite para mais informações.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-b755fcb2cb0a2a4332d334c5d4df9750abc74535%2Fbe707549d5ab3386580210dadc39c277a8221a2294690f6f5098f8fa49e91dad.png?alt=media" alt="" data-size="original"></p>                                                                           |
| Campo de Lista Suspensa do Formulário | <p>Adicione uma lista suspensa com itens personalizáveis ao formulário de cadastro. Você pode mapear o item da lista selecionado pelo usuário para um campo personalizado no participante do Advocate. Entre em contato com o Suporte para obter ajuda com isso.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-d4d06463b739d6320cca385d51aef2ebb21a06e9%2Fbcfe9233e8daa3f5cdd4213fc80fb2a8ecef610eecaed1be02e99d4939ff14e5.png?alt=media" alt="" data-size="original"></p>                                                              |
| Campo de Entrada do Formulário        | <p>Adicione um campo de entrada de texto livre ao formulário de cadastro. Você pode mapear o texto inserido pelo usuário para um campo personalizado no participante do Advocate. <a href="https://app.impact.com/support/portal.ihtml?createTicket=true&#x26;">Entre em contato com o suporte</a> para obter ajuda com isso.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-22dbac6584da989b0190425decc62f668a813320%2F9324f8dd94e41ba973d7753c410bbd020e8d61f060652fcabbd14482b4d242c5.png?alt=media" alt="" data-size="original"></p> |
| Campos de Nome do Formulário          | <p>Adicione campos preenchíveis de Nome e Sobrenome ao formulário de cadastro.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-f516e369b49dd1fa5220e0eb0fd5a8a5e13715cc%2Ff86f4e367584f563904db00af1e76cdad40c92a4b2694146b5b755a017e76886.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                                                |
| Item da Barra Lateral                 | <p>Adicione uma nova página ou link à navegação da barra lateral do seu microsite. Só pode ser colocado no Layout de Usuário Logado do microsite.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-22080a0fa46172389a9f84eb1f5b915a9cb9bd53%2F927e9d1ef0ec4a6d3c1797199be78426ffcbaf84e4007288b303eee91d005e3d.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                             |
| Campo de Senha do Formulário          | <p>Adicione um campo de senha preenchível ao formulário de cadastro.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-d11ad739227f7ef4d5ef2155131766cef7bfe569%2Fc09a224e7a38863ef546d342ef93fac272cfde0e95b47c6e99c73302159aece9.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                                                          |

</details>

<details>

<summary>Acesso Instantâneo</summary>

*Acesso Instantâneo* componentes tornam rápido e fácil para amigos indicados se cadastrarem ou resgatarem recompensas sem passar pelo processo padrão de cadastro. São ideais para programas que usam widgets de indicação com acesso instantâneo ou fluxos de cadastro de amigos.

| Componente                       | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      |
| -------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Código de Cupom                  | <p>Exibe um código resgatável para uma recompensa Fuel Tank.</p><p>O <a href="/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/advocate-rewards/fuel-tank-rewards-explained.md">tanque de combustível de recompensas</a> precisa ter códigos de cupom disponíveis para que este componente funcione como esperado.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-b6751473ff9a89ec2635661cbefd69fe20e2606c%2Fdc86a733cfb70c7df0a19df89b1dd5c9bbc57d5e0ff52bb5278be069d9543ed6.png?alt=media" alt="" data-size="original"></p> |
| Cadastro de Advocate             | <p>Permite que novos Advocates informem seu endereço de e-mail para se cadastrar e fazer indicações. Depois de informar o e-mail, os usuários serão levados a uma segunda tela onde poderão acessar seus sharelinks de indicação. Usado para o Widget de Indicação do Website com acesso instantâneo.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-848bf4497a7280a28c48b76e0031a7cabd2702d1%2Fcb04ab4a85a9c132631ae16c6f15215af60c9f5355ab77de58469379dc65e0a9.png?alt=media" alt="" data-size="original"></p>                              |
| Encerrar sessão do usuário atual | <p>Permite que o visualizador saia da exibição personalizada de acesso instantâneo.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-0a4b2367a12e92611062ba6b3385739c3f25f195%2Fcf128314c155054d77102dafd71a5e5082975ee8851b79b718d105095f498eef.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                                                |
| Cadastro de Amigo                | <p>Permite que amigos indicados informem seu endereço de e-mail para se cadastrar. Depois de informar o e-mail, os usuários serão levados a uma segunda tela onde poderão acessar sua recompensa de Código de Cupom. Usado para o Widget de Amigo com acesso instantâneo.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-848bf4497a7280a28c48b76e0031a7cabd2702d1%2Fcb04ab4a85a9c132631ae16c6f15215af60c9f5355ab77de58469379dc65e0a9.png?alt=media" alt="" data-size="original"></p>                                                          |

</details>

<details>

<summary>Layout</summary>

*Layout* componentes permitem que você organize e agrupe outros componentes. Use-os para criar seções, linhas, colunas ou abas.

| Componente                         | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |
| ---------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Layout de Destaque em Duas Colunas | <p>Adicione um layout de destaque com duas colunas de conteúdo.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-90fbc0943f7a9bf20af2a8ef5224fe307b4cd447%2Fe9d5fb3e534e6d42f93128e7f52c08f21cefd7f0c378c1f6e72877b5fbfe8703.png?alt=media" alt="" data-size="original"></p>                                                                                                                        |
| Contêiner de Layout de Linha       | <p>Adicione um novo contêiner de linha para conteúdo. Outros componentes podem ser colocados dentro da linha.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-c6a50f4ca39b0fa9df127beda85b8fda790dbd1c%2F792b42fe4a633f3b3950954d520b5f5d8e7bce7c15d0d6ce14cc041c0244ea3c.png?alt=media" alt="" data-size="original"></p>                                                                          |
| Contêiner de Layout de Coluna      | <p>Adicione um novo contêiner de coluna para conteúdo. Outros componentes podem ser colocados dentro da coluna.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-c6a50f4ca39b0fa9df127beda85b8fda790dbd1c%2F792b42fe4a633f3b3950954d520b5f5d8e7bce7c15d0d6ce14cc041c0244ea3c.png?alt=media" alt="" data-size="original"></p>                                                                        |
| Aba                                | <p>Adicione uma nova aba a um grupo genérico de abas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-bf80a7b35daafb8849d2fabb0acac194eb8de4ae%2F5517db3bff5c64677ef351b5ec94ce32336e728877cca2b5614cdc719bbdd087.png?alt=media" alt="" data-size="original"></p>                                                                                                                                  |
| Grupo Genérico de Abas             | <p>Adicione um grupo de abas. Cada aba pode conter componentes e conteúdo distintos. Vem com três abas por padrão, mas as abas podem ser removidas ou adicionadas conforme necessário.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-f38bb2abbd959f6de3dd3057279bef72b167bd7a%2F6d51c82449438758a0d7e7c667b4e41e8b1ba274f5f32206ea0a934ef967349b.png?alt=media" alt="" data-size="original"></p> |
| Seção intitulada                   | <p>Adicione uma nova seção que contenha um título e texto de parágrafo. Outros componentes podem ser adicionados à seção intitulada abaixo do título.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-d2e2627c0305da170e459293404b3a7a32bbdd57%2Fd5c2b7ee84117e3804a0afe8d99c1681b0c370c578620d960f2cd780b1b034f9.png?alt=media" alt="" data-size="original"></p>                                  |

</details>

<details>

<summary>Faturas</summary>

*Fatura* componentes permitem inserir componentes de fatura para visualizar dados de ganhos.

| Componente                          | Descrição                                                                                                                                                                                                                                                                                                                                                                               |
| ----------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Tabela de Faturas                   | <p>Adicione um acordeão de faturas expansível que contenha dados de ganhos.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-4c505a7531266547be4dd870343a448fbe506af7%2F987ceee7ddf4cf17d9cc5978b505139e06c16cab3e44c221d7374f65e563fa19.jpg?alt=media" alt="" data-size="original"></p> |
| Coluna de Data da Tabela de Faturas | <p>Adicione uma nova coluna ao componente de tabela de faturas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-fb42d6e770406c2e2cc06864b1aaf1d129d7df72%2F48530b7fb857185f3571f592166d3b8f937e5a2f84e6d8b0387c6b63c2e382de.png?alt=media" alt="" data-size="original"></p>             |

</details>

O *Ranking* componente permite classificar os participantes do seu programa, oferecer recompensas aos melhores desempenhos e incentivar os participantes a gerar melhores resultados no seu programa. Adicione rankings ao seu [widget com acesso verificado](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/widget-experiences/widget-types-explained.md) ou [microsite](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/microsites-overview.md), e configure o sistema de pontuação, o sistema de classificação e as opções de filtragem de participantes. Veja os artigos abaixo para mais informações:

* [Ranking Explicado](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/leaderboards-explained.md)
* [Configurar um Ranking](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/set-up-a-leaderboard.md)

| Componente           | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         |
| -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Indicação Iniciada   | <p>Este tipo de ranking classifica os participantes pelo número de indicações que iniciaram. As pontuações dos seus defensores de clientes corresponderão ao número de indicações iniciadas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-347d66dfe033a6dcf0e6d487801fbab053997704%2Fc4df3139983a0454f0cca11c832c8870fea8cf861c651210e437d2ee148ee757.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                          |
| Indicação Convertida | <p>Este tipo de ranking classifica os participantes pelo número de indicações que converteram. As indicações são consideradas convertidas quando o amigo indicado atinge uma meta do programa, como fazer uma compra de um valor definido por você. As pontuações dos seus defensores de clientes corresponderão ao número de indicações convertidas.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-347d66dfe033a6dcf0e6d487801fbab053997704%2Fc4df3139983a0454f0cca11c832c8870fea8cf861c651210e437d2ee148ee757.png?alt=media" alt="" data-size="original"></p> |
| Pontos Ganhos        | <p>Este tipo de ranking classifica os participantes pelo número total de pontos que ganharam em programas Advocate que recompensam com pontos. Todos os pontos das unidades de recompensa contam, desde que não estejam pendentes ou cancelados. Este tipo de ranking só é válido para o tipo de recompensa em pontos.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-c77ede4e082778754887872f948e6b8b0d188474%2F83ae9393fa0cb1e9bc6f4dd53aa9d77e858bb40ef4e985a5247413950ff66729.png?alt=media" alt="" data-size="original"></p>                                |
| Ranking Anônimo      | <p>Uma versão totalmente anonimizada do ranking que não exibe nenhuma informação de identificação pessoal sobre outros participantes do programa. Pode exibir qualquer tipo de ranking.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-7de957636976c1d06b91c963c3bc6befffa789d8%2Fb04ceffabe2ed8007c96b0f932ebf06063fd5d3a4af2dec81b1fad443ee7d4b5.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                               |

<details>

<summary>Impostos e Dinheiro</summary>

*impostos e dinheiro* componentes permitem incorporar a coleta de formulários fiscais e opções de pagamento em dinheiro em seu [widget com acesso verificado](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/widget-experiences/widget-types-explained.md) ou [microsite](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/microsites-overview.md).

Este grupo de componentes só está disponível se o [*pagamentos em dinheiro*](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/advocate-rewards/pay-with-cash/cash-payouts-for-advocate-explained.md) recurso tiver sido ativado na sua conta.

| Componente                                                | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      |
| --------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Modal de Informações do Parceiro                          | <p>Insira um modal que coleta o país e a moeda dos participantes. Essas informações garantem que seus participantes possam receber suas recompensas sem atrasos ou etapas extras de configuração.<br></p><p>Ele tem dois estados configuráveis, dependendo se o e-mail do participante já está vinculado a uma conta existente:</p><ul><li><strong>Descrição de novo parceiro</strong>: Exibida para participantes de primeira viagem. O texto padrão ("Confirme agora seu país e moeda para receber suas futuras recompensas mais rápido") incentiva-os a fornecer seus dados antes de receberem seu link de compartilhamento.</li><li><strong>Descrição de parceiro existente</strong>: Exibida quando o e-mail do participante já está associado a uma conta na impact.com. O modal preenche automaticamente suas informações e pede que ele as confirme, em vez de digitá-las novamente do zero.</li></ul> |
| Alerta de Status de Pagamento                             | <p>Avisa o participante sobre as ações que ele precisa tomar antes de poder receber um pagamento em dinheiro. O componente inclui um botão de chamada para ação que leva o participante para revisar suas configurações de pagamento.</p><p>Opcionalmente, personalize qualquer uma das descrições de texto que o participante verá ao visualizar o componente.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-4d9b5f8072ff2b0c78e1f173493cf4d2ddef9334%2F2c0be35e8e0bfbcb7d7b5e9b9ea30b1b794722e04336f566b033cc9850e1b486.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                                    |
| Formulário de Pagamento em Dinheiro do Microsite e Widget | <p>Insira um formulário que coleta as informações bancárias dos participantes e quaisquer formulários fiscais aplicáveis, como um W-8 ou W-9.</p><p>Opcionalmente, personalize qualquer uma das descrições de texto que o participante verá ao visualizar o formulário.</p><p>Você também pode definir alertas e requisitos de verificação dentro deste componente.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-00fc2e186e360a8330580a3163c8016aae9c6ecc%2F270f47b47bd597f40b6a4253ce541ea0b53a552847e5efc71afeaa74fba1354b.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                                |

</details>

<details>

<summary>Compartilhamento</summary>

*Compartilhamento* componentes oferecem aos participantes maneiras convenientes de promover seus links e códigos de indicação em vários canais. Quando um participante clica em um botão de compartilhamento, ele abre o canal escolhido, como *Facebook*, *LinkedIn*, *WhatsApp*, ou *email*, com uma mensagem ou link preenchido previamente, pronto para enviar.

Alguns componentes, como Código de Indicação, exibem o código individual de indicação ou promoção do participante junto com a opção de copiar para a área de transferência para compartilhamento rápido. Outros, como Códigos Promocionais, apresentam vários códigos disponíveis (se alocados) em uma visualização deslizante, e incluem botões de compartilhamento para que os participantes possam publicar ou enviar instantaneamente o código selecionado. Essas ferramentas facilitam para os participantes divulgar a novidade e gerar novas indicações.

| Componente                                    | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              |
| --------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Código de indicação                           | <p>Exibe um campo de código de indicação com a opção de copiar para a área de transferência. Usado como parte da funcionalidade de Códigos Promocionais.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-350b4cd5d21cca6714a3eadcac9b273250d1489b%2Fc765bebedb73ecdfcb67f14de17f261c9d55d4043cf4296025801350717df9ff.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                   |
| Códigos Promocionais                          | <p>Bloco de componente pré-formatado que inclui um campo de código promocional de indicação com controle deslizante para alternar entre vários códigos, se mais de um tiver sido alocado. Ele também inclui um link de compartilhamento e componentes de botão de compartilhamento para Facebook, LinkedIn e Twitter / X.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-3fd5339df311e321f51f058bbaa88ddfaf08d6bc%2Ffe4b15e28eecd25533da83c6417660b98eb94e8dd083040f5f847d1683a8f7b2.png?alt=media" alt="" data-size="original"></p>                  |
| Botão de Compartilhar no Facebook             | <p>Exibe um botão Compartilhar no Facebook com texto personalizável. Quando clicado, o botão redireciona para uma nova publicação no perfil do usuário no Facebook com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-ac40825644d43883701dfefcf84d0d237ed0c694%2Fe90f8748aff7c0bf33cba007cab091851f916f9dfb24ec228bc27634bca575fe.png?alt=media" alt="" data-size="original"></p>                                                                                                                           |
| Botão de Compartilhar no X                    | <p>Exibe um botão Compartilhar via X com texto personalizável. Quando clicado, o botão redireciona para uma nova publicação na conta do usuário no X com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-ce26efcd37d82f16d9f2d4d288f42b28e54bcb9b%2Fc4de3610b0ba8f1599ff74aa83740b07bf9d20a3ae09f33df7858dc15d8a82b2.png?alt=media" alt="" data-size="original"></p>                                                                                                                                         |
| Botão de Compartilhar por E-mail              | <p>Exibe um botão Compartilhar por E-mail com texto personalizável. Quando clicado, o botão abre o aplicativo de e-mail padrão do usuário e inicia um novo e-mail com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-99cd491d8066557af00352c2161adbf0d1ff80d9%2F65667d26945a492f02467c4d6cd3d88f4501f029c3fa924ce20587ae6661fde1.png?alt=media" alt="" data-size="original"></p>                                                                                                                            |
| Botão da Folha de Compartilhamento do Celular | <p>Exibe um botão para compartilhar no navegador da web do participante. Quando clicado, o botão abre um menu listando todos os aplicativos disponíveis que o usuário pode abrir para compartilhar seu link. Quando um aplicativo é selecionado, uma nova publicação ou mensagem será criada com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-b0aefc7accad7dc192307b765172cba66908faeb%2Fbf216b95fbd48c0377b824b12708e0ca1f8e6e2a9c1660359e7e0bbc65725b09.png?alt=media" alt="" data-size="original"></p> |
| Botão de Compartilhar no LinkedIn             | <p>Exibe um botão Compartilhar no LinkedIn com texto personalizável. Quando clicado, o botão redireciona para uma nova publicação no perfil do usuário no LinkedIn com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-2a776449d19fc08bb449a5f8351c7101075f1c74%2F2f76bd37890d40e8839f6cab5f0cb5a2b8b11d7bf5f9dfe02d48dad3a8d96cb1.png?alt=media" alt="" data-size="original"></p>                                                                                                                           |
| Botão de Compartilhar por SMS                 | <p>Exibe um botão Enviar para um amigo com texto personalizável. Quando clicado, o botão redireciona para o aplicativo padrão de SMS/mensagens de texto do usuário, e uma nova mensagem SMS/texto será criada com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-798893a05da61813dc9d1935d7008941222a8b90%2F3a3fc9c019417421b28b3a5514384cc6a02b25046b7703325aeefe2ed4ca902a.png?alt=media" alt="" data-size="original"></p>                                                                                |
| Botão de Compartilhar no Messenger            | <p>Exibe um botão Compartilhar via Messenger com texto personalizável. Quando clicado, o botão redireciona para uma nova mensagem no aplicativo Facebook Messenger do usuário com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-93f82656f6614d7f34071466b5d061b7c3d1d463%2F2b31207d2addc11e7d589fada9808712bfa21e218fde0aebcbd0bc989d18919d.png?alt=media" alt="" data-size="original"></p>                                                                                                                |
| Botão de Compartilhar no WhatsApp             | <p>Exibe um botão Compartilhar via WhatsApp com texto personalizável. Quando clicado, o botão redireciona para uma nova mensagem na conta do usuário no WhatsApp com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-e3b0d2368c1eaa1b37d41216636f85eee4c9e138%2Fb939f470eb31109551821fe0d22887a99ae81678872ff3241ddcfe2e382c5796.png?alt=media" alt="" data-size="original"></p>                                                                                                                             |
| Botão de Compartilhar no LINE                 | <p>Exibe um botão Compartilhar via Line Messenger com texto personalizável. Quando clicado, o botão redireciona para uma nova mensagem no aplicativo Line Messenger do usuário com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-0551e0947b75a319cd37b2fc5190f94aa7ac3275%2Fc9b7ee44e3f60422f7f0c1314fd669569eac6da0c1f4cdfe8baa7733f704b67b.png?alt=media" alt="" data-size="original"></p>                                                                                                               |
| Botão de Compartilhar no Pinterest            | <p>Exibe um botão Compartilhar no Pinterest com texto personalizável. Quando clicado, o botão redireciona para uma nova publicação no perfil do usuário no Pinterest com a Mensagem Social da marca pré-carregada.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-6c91830cc012ce3ddbdd99a80c2ab4808e27eb14%2F32f7f7814c6be91a947add2d5d7f0bb5b375a16f212313a18774e79dfa562374.png?alt=media" alt="" data-size="original"></p>                                                                                                                         |
| Link de Compartilhamento                      | <p>Exibe o link de compartilhamento do participante para este programa.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-a7096d63847a389d28ffebcc71d0883ed90cc525%2F2eb89dd61c2c37dbc09f4a4d765b980826a5a3f755bad93880e9fb9248593db6.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                                                                    |
| Código QR                                     | <p>Exibe o link de compartilhamento do participante na forma de um código QR para este programa.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-1aa383efd76c4268b71ab2118635a650a5dca9b3%2Fb575c24753eb2779431f9a9bfe56e84abd836992751052ea5d6b58b54a2fd964.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                                           |

</details>

<details>

<summary>Indicações</summary>

*Indicação* componentes exibem informações sobre os amigos indicados pelo participante e o status de conversão deles. Eles facilitam para os participantes acompanhar quem eles indicaram, quando as conversões aconteceram e quaisquer recompensas ganhas com essas indicações.

| Componente                                    | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |
| --------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Cartão de Indicação                           | <p>Bloco de componente pré-formatado que inclui <em>linha do tempo do programa</em>, <em>link de compartilhamento</em>, e <em>Facebook</em>, <em>LinkedIn,</em> e <em>Twitter / X</em> componentes de botão de compartilhamento. Outros componentes podem ser adicionados ou removidos conforme necessário.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-f756a1f54cf83ab690539ad68993287112cce6c0%2F8f6c3feabc2b64c582ba9c730c7813b993ead61741d6b21490dd04cc1a92c766.png?alt=media" alt="" data-size="original"></p> |
| Tabela de Indicações                          | <p>Exibe uma tabela mostrando os amigos indicados pelo participante, a data de conversão e o status de conversão.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-ce55181b973b561145f087c8112c6008d71daac2%2F14f8e870dfa6c7bf6ab3d1d1fc0ccdc296b2e0b654b72d9b955d7e658fcce1a3.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                           |
| Coluna de Data da Tabela de Indicações        | <p>Adicione outra coluna de data à tabela de indicações. Deve ser colocada dentro do componente Tabela de indicações.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-8992234a958c425bfc53bf938cd323162d62d857%2Fd33d6f5ef933f7df85c392f6733973cafe2b798ea1798628f55b67f201cb0734.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                       |
| Coluna de Recompensas da Tabela de Indicações | <p>Adicione outra coluna de recompensas à tabela de indicações. Deve ser colocada dentro do componente Tabela de indicações.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-ef97eededbc5f92ec490dcab90fd10fb97170671%2F12c9225c7808b735b15b3534fd04a4ffbb7556b6fdc457a942f3ffb76456ba69.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                |
| Coluna de Status da Tabela de Indicações      | <p>Adicione outra coluna de status à tabela de indicações. Deve ser colocada dentro do componente Tabela de indicações.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-e3440cacb4114c9d370932773b6d92b971729d75%2F1cbe3630384c042632077d3cf87577401eaa02496651fbf90e6e4dba9f62a5aa.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                     |
| Coluna de Usuário da Tabela de Indicações     | <p>Adicione outra coluna de cliente (amigo indicado) à tabela de indicações. Deve ser colocada dentro do componente Tabela de indicações.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-07c39fcbf12ca844c00d89c7e423190d5e7ee38e%2F2e6b9f6c02a9670ddd7b2bf8fc050f6a8776851c6eac94b794c42d3aa33ed2f8.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                   |

</details>

<details>

<summary>Avançado</summary>

Componentes avançados oferecem mais controle sobre o que os participantes veem e quando veem. Eles permitem exibição condicional de conteúdo, substituições de programa e outras configurações especializadas que ajudam a adaptar a experiência para públicos específicos.

| Componente                  | Descrição                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       |
| --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Área Condicional / Segmento | <p>Exiba conteúdo nesta seção somente quando o participante pertencer a um determinado <a href="/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participants/manage-advocate-user-segments.md">segmento de usuários</a>.</p><p>Para definir o segmento do usuário, abra as propriedades do componente e edite a expressão JSONata no <em>Condição</em> campo.</p><p>Os usuários dentro do segmento definido verão todo o conteúdo exibido na seção condicional, enquanto os usuários fora do segmento não verão o conteúdo.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-2fe790e8458995641bd60d7f1efc8f81a0c5598e%2Fbb4c121de32787e766f9d5930e0e34f0ce2637ab3a1dfc6aa5fb7bf7bb4bd0d5.png?alt=media" alt="" data-size="original"></p>                                                                                                        |
| Área Condicional / Campo    | <p>Exiba conteúdo nesta seção somente quando um <a href="/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participants/custom-and-calculated-fields/custom-fields-for-advocate-explained.md">campo personalizado</a> no perfil do participante contém um determinado valor.</p><p>Para definir o nome e o valor do campo personalizado, abra as propriedades do componente e edite a expressão JSONata no <em>Condição</em> campo.</p><p>Usuários com o valor correto do campo personalizado verão todo o conteúdo exibido na seção condicional, enquanto usuários sem o valor correto do campo personalizado não verão o conteúdo.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-2fe790e8458995641bd60d7f1efc8f81a0c5598e%2Fbb4c121de32787e766f9d5930e0e34f0ce2637ab3a1dfc6aa5fb7bf7bb4bd0d5.png?alt=media" alt="" data-size="original"></p> |
| Seção do Programa           | <p>O componente de seção do programa permite substituir o ID do programa de seus componentes filhos. Use-o quando quiser exibir conteúdo que não esteja vinculado a um programa específico. Incluído por padrão na maioria dos modelos de widget e microsite.</p><p><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-2fe790e8458995641bd60d7f1efc8f81a0c5598e%2Fbb4c121de32787e766f9d5930e0e34f0ce2637ab3a1dfc6aa5fb7bf7bb4bd0d5.png?alt=media" alt="" data-size="original"></p>                                                                                                                                                                                                                                                                                                                                                                                                       |

</details>

<details>

<summary>Tipografia</summary>

Os componentes de tipografia permitem adicionar blocos de texto formatado ao seu widget ou microsite. Selecione entre:

* Parágrafo
* Título 1
* Título 2
* Título 3
* Título 4

  <div data-with-frame="true"><figure><img src="https://526234278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-a21333a42165afd0b94699beb820ce6f01d4967b%2F98486fd03f5278fcc0128c28d9b9c6a7a62508a7f08c0db73e8d274a1198d0e0.jpg?alt=media" alt="" width="208"><figcaption></figcaption></figure></div>

</details>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://help.impact.com/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/widget-and-microsite-components-explained.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.