# Widgets do Sistema

# Entendendo o funcionamento dos widgets do sistema

<span style="white-space: pre-wrap;">Os </span>**Widgets do Sistema**<span style="white-space: pre-wrap;"> permitem exibir uma tela de outra ferramenta diretamente dentro do Apresenta.me.</span>

Com esse recurso, a equipe pode consultar painéis, relatórios ou informações de sistemas parceiros sem precisar abrir outra aba do navegador. O widget também pode utilizar informações do registro que está aberto no momento para direcionar automaticamente a ferramenta externa para o cliente, contrato ou cadastro correspondente.

---

##### **Navegação no Módulo**

[![widgets.gif](https://ajuda.apresenta.me/uploads/images/gallery/2026-09/widgets.gif)](https://ajuda.apresenta.me/uploads/images/gallery/2026-09/widgets.gif)

**Rotina:**<span style="white-space: pre-wrap;"> Configurações &gt; Integrações &gt; </span>**Widgets do Sistema**

Nesta tela é possível cadastrar, configurar, ativar e remover os widgets utilizados no sistema.

---

##### **Entender a listagem de Widgets**

[![image.png](https://ajuda.apresenta.me/uploads/images/gallery/2026-09/scaled-1680-/Mt4image.png)](https://ajuda.apresenta.me/uploads/images/gallery/2026-09/Mt4image.png)

Os widgets cadastrados são apresentados em uma listagem com suas principais informações.

<table id="bkmrk-campodescri%C3%A7%C3%A3oc%C3%B3digo"><colgroup><col></col><col style="width: 747px;"></col></colgroup><tbody><tr><th>Campo

</th><th>Descrição

</th></tr><tr><td>**Código**

</td><td>Identificador interno do widget.

</td></tr><tr><td>**Título**

</td><td>Nome exibido na aba dentro do sistema.

</td></tr><tr><td>**Localização**

</td><td>Indica em qual área do sistema o widget será apresentado.

</td></tr><tr><td>**URL**

</td><td>Endereço da ferramenta externa carregada pelo widget.

</td></tr><tr><td>**Ordem**

</td><td>Define a posição da aba em relação aos demais widgets.

</td></tr></tbody></table>

<span style="white-space: pre-wrap;">Para criar um novo widget, clique em </span>**Cadastrar**.

---

##### **Identificar e posicionar o Widget**

[![image.png](https://ajuda.apresenta.me/uploads/images/gallery/2026-09/scaled-1680-/Ztkimage.png)](https://ajuda.apresenta.me/uploads/images/gallery/2026-09/Ztkimage.png)

Defina como o widget será identificado e onde ele será apresentado.

<table id="bkmrk-campodescri%C3%A7%C3%A3ot%C3%ADtulo"><colgroup><col></col><col style="width: 671px;"></col></colgroup><tbody><tr><th>Campo

</th><th>Descrição

</th></tr><tr><td>**Título da Aba**

</td><td>Nome exibido na aba dentro do sistema. Campo obrigatório.

</td></tr><tr><td>**Slug da Aba**

</td><td>Identificador curto utilizado para representar a aba.

</td></tr><tr><td>**Localização do Widget**

</td><td>Define em qual tela ou módulo o widget será exibido. Campo obrigatório.

</td></tr><tr><td>**Ordem de Exibição**

</td><td>Define a posição da aba em relação aos demais widgets da mesma localização.

</td></tr><tr><td>**Ícone do Widget**

</td><td>Define o ícone apresentado ao lado do título da aba.

</td></tr></tbody></table>

---

##### **Informar a URL do Widget**

[![image.png](https://ajuda.apresenta.me/uploads/images/gallery/2026-09/scaled-1680-/tiLimage.png)](https://ajuda.apresenta.me/uploads/images/gallery/2026-09/tiLimage.png)

<span style="white-space: pre-wrap;">A </span>**URL do Widget**<span style="white-space: pre-wrap;"> define qual página externa será carregada dentro do sistema.</span>

<table id="bkmrk-campodescri%C3%A7%C3%A3ourl-do"><colgroup><col></col><col style="width: 720px;"></col></colgroup><tbody><tr><th>Campo

</th><th>Descrição

</th></tr><tr><td>**URL do Widget**

</td><td>Endereço completo da tela externa que será apresentada no widget. Campo obrigatório.

</td></tr></tbody></table>

<span style="white-space: pre-wrap;">A URL também pode utilizar </span>**variáveis**, permitindo que o endereço seja montado dinamicamente conforme a tela ou registro acessado pelo usuário.

<table id="bkmrk-vari%C3%A1veldescri%C3%A7%C3%A3o%7Bid"><colgroup><col></col><col style="width: 668px;"></col></colgroup><tbody><tr><th>Variável

</th><th>Descrição

</th></tr><tr><td>`<span class="editor-theme-code">{id}</span>`

</td><td>Código do próprio widget.

</td></tr><tr><td>`<span class="editor-theme-code">{url}</span>`

</td><td>Endereço da página atual do sistema.

</td></tr><tr><td>`<span class="editor-theme-code">{company_id}</span>`

</td><td>Código da imobiliária.

</td></tr><tr><td>`<span class="editor-theme-code">{module.propriedade}</span>`

</td><td><span style="white-space: pre-wrap;">Utiliza uma informação do registro atualmente aberto, como </span>

`<span class="editor-theme-code">{module.id}</span>`

.

</td></tr></tbody></table>

Por exemplo, se uma ferramenta externa utiliza o código do cliente na URL, pode ser configurado:

`<span class="editor-theme-code">https://sistema-parceiro.com/cliente/{module.id}</span>`

<span style="white-space: pre-wrap;">Ao abrir o cliente de código </span>**150**, o endereço utilizado pelo widget será:

`<span class="editor-theme-code">https://sistema-parceiro.com/cliente/150</span>`

Assim, o mesmo widget pode ser utilizado para diferentes registros sem precisar criar uma configuração para cada um.

<p class="callout info">Quando uma variável utilizada na URL não existe ou não possui valor, ela é substituída por vazio. Caso o widget abra uma página genérica ou diferente da esperada, confira se o nome da variável foi informado corretamente.</p>

---

##### **Ajustar a exibição do Widget**

Também é possível controlar o espaço ocupado e em quais situações a aba deverá aparecer.

<table id="bkmrk-campo-%2F-op%C3%A7%C3%A3odescri%C3%A7"><colgroup><col></col><col></col></colgroup><tbody><tr><th>Campo / Opção

</th><th>Descrição

</th></tr><tr><td>**Altura do Conteúdo**

</td><td>Define a altura ocupada pelo widget. Quando não informado, utiliza a altura disponível da tela. Pode aceitar uma medida fixa ou ajuste automático.

</td></tr><tr><td>**Esconder quando Cadastrando**

</td><td>Oculta a aba enquanto um novo registro está sendo criado.

</td></tr><tr><td>**Esconder quando Editando**

</td><td>Oculta a aba enquanto o registro estiver em modo de edição.

</td></tr></tbody></table>

<p class="callout info">Quando o widget depende de informações do registro, como `{module.id}`, é recomendado habilitar Esconder quando Cadastrando. Durante a criação, o registro ainda pode não possuir um código e a variável utilizada na URL ficará vazia.</p>

---

##### **Ativar e gravar o Widget**

Depois de concluir a configuração, defina se o widget ficará disponível.

<table id="bkmrk-op%C3%A7%C3%A3odescri%C3%A7%C3%A3owidget"><colgroup><col></col><col></col></colgroup><tbody><tr><th>Opção

</th><th>Descrição

</th></tr><tr><td>**Widget Ativo**

</td><td>Define se a aba será exibida no sistema. Quando desativado, o widget permanece cadastrado, mas não aparece para os usuários.

</td></tr></tbody></table>

Grave as informações para concluir. Após salvar, a aba passa a ser apresentada na localização configurada.

---

##### **Remover um Widget**

<span style="white-space: pre-wrap;">Para excluir um widget, selecione o registro correspondente na listagem e clique em </span>**Remover**. Após a remoção, a aba deixa de ser exibida no sistema.

---

#### **Perguntas frequentes**

<span style="white-space: pre-wrap;">➜ </span>**O que aparece dentro do Widget?**<span style="white-space: pre-wrap;"> A página definida na </span>**URL do Widget**. O conteúdo exibido e suas funcionalidades são controlados pela ferramenta externa.

<span style="white-space: pre-wrap;">➜ </span>**Preciso saber programar para cadastrar um Widget?**<span style="white-space: pre-wrap;"> Não necessariamente. Porém, a URL e as variáveis utilizadas precisam estar de acordo com o funcionamento da ferramenta externa.</span>

<span style="white-space: pre-wrap;">➜ </span>**A aba aparece para todos os usuários?**<span style="white-space: pre-wrap;"> Ela é exibida na localização configurada para quem possui acesso àquela área do sistema. O conteúdo apresentado pela ferramenta externa pode possuir regras próprias de acesso.</span>

<span style="white-space: pre-wrap;">➜ </span>**Por que o Widget sempre abre a mesma página?**<span style="white-space: pre-wrap;"> Verifique se a URL possui as variáveis necessárias e se elas estão escritas corretamente. Variáveis inexistentes ou sem valor são substituídas por vazio.</span>

<span style="white-space: pre-wrap;">➜ </span>**Posso cadastrar mais de um Widget?**<span style="white-space: pre-wrap;"> Sim. É possível cadastrar vários widgets e utilizar a </span>**Ordem de Exibição**<span style="white-space: pre-wrap;"> para definir a sequência das abas.</span>

<span style="white-space: pre-wrap;">➜ </span>**Posso desligar um Widget temporariamente?**<span style="white-space: pre-wrap;"> Sim. Desative a opção </span>**Widget Ativo**. A configuração permanece salva e pode ser reativada posteriormente.

<span style="white-space: pre-wrap;">➜ </span>**O Widget ocupa a tela inteira?**<span style="white-space: pre-wrap;"> Quando a altura não é definida, ele utiliza o espaço disponível. O campo </span>**Altura do Conteúdo**<span style="white-space: pre-wrap;"> permite ajustar esse tamanho.</span>

<span style="white-space: pre-wrap;">➜ </span>**Por que esconder o Widget durante o cadastro?**<span style="white-space: pre-wrap;"> Porque o novo registro pode ainda não possuir informações necessárias para montar a URL, como um código de identificação. Nesse caso, variáveis como </span>`<span class="editor-theme-code">{module.id}</span>`<span style="white-space: pre-wrap;"> ainda não terão valor.</span>