> 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/microsite-experiences/microsite-editor-explained.md).

# Editor de microsite explicado

O editor do microssite permite que você tenha controle sobre o que os participantes do seu programa Advocate verão, permitindo personalizar layouts, páginas, conteúdo e elementos de identidade visual, como fontes e cores.

Este artigo de ajuda explica a interface do editor e fornece informações gerais sobre como os microssites são estruturados, incluindo layouts, páginas e componentes. Saiba mais sobre [configurando um microssite](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/set-up-a-microsite.md) e [personalizando a identidade visual e o conteúdo](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/customize-microsite-layouts-and-pages.md) de seus layouts e páginas.

#### Abrir o editor do microssite

1. No menu de navegação à esquerda, selecione ![](/files/160944180402269557074f48f2ece20bc35e8b4d) **\[Engage] → Conteúdo**.
2. Na *Microsite* cartão, selecione **Editar conteúdo**.

#### Interface do editor

O editor do microssite é composto por uma barra de menu superior, a tela de edição, o painel lateral do microssite e o menu de componentes.

<div data-with-frame="true"><figure><img src="/files/1b0a89394f9362dc7952144e84f10513217499e7" alt=""><figcaption></figcaption></figure></div>

{% tabs %}
{% tab title="Barra de menu superior" %}
A barra de menu na parte superior da página é onde você pode desfazer ações, visualizar o código HTML e pré-visualizar o microssite finalizado. Use os ícones de desktop, tablet ou celular para ver como seu microssite aparecerá em dispositivos com tamanhos de tela diferentes.
{% endtab %}

{% tab title="Canvas" %}
A tela exibe o conteúdo atual do seu microssite. Você pode selecionar componentes individuais para editá-los, ou adicionar novos e ver rapidamente como eles aparecerão para seus participantes. Esses componentes estão listados à esquerda, na seção do painel lateral do microssite.

* Selecione **Camadas** para ver uma exibição detalhada de todos os componentes na sua página ou layout
* Selecione **Modelos** para ver os modelos disponíveis para as páginas do seu microssite.
* Você verá um terceiro menu contextual com base na página, layout, widget ou e-mail selecionado

  <div data-with-frame="true"><figure><img src="/files/4459b456cd296e11db5dd6aa45744324340511dd" alt="" width="122"><figcaption></figcaption></figure></div>

{% endtab %}

{% tab title="Painel lateral do microssite" %}
O painel lateral do microssite é um painel recolhível à esquerda da tela. Ele visualiza a estrutura de herança dos seus layouts e páginas em forma de árvore. Selecione layouts ou páginas individuais para ver o conteúdo e fazer ajustes. Também é aqui que você pode adicionar mais páginas e layouts.

Para um estilo ainda mais refinado em nível de identidade visual, selecione a opção Estilo do Microssite. Veja [Personalize Widgets e Microsites com o Editor de Conteúdo](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/customize-widgets-and-microsites-with-the-content-editor.md) para obter mais informações sobre as opções de estilo disponíveis para você.
{% endtab %}

{% tab title="Menu de componentes" %}
O menu de componentes é um painel à direita do canvas. Use a aba *Adicionar* aba para inserir novos componentes na tela e a *Editar* aba para fazer ajustes no que já está lá.
{% endtab %}
{% endtabs %}

#### Estrutura do microssite

Há alguns blocos de construção importantes de entender ao personalizar seu microssite: layouts, páginas e componentes.

<details>

<summary>Layouts</summary>

Os layouts funcionam como “molduras” para o seu microssite. É neles que você pode colocar componentes que deseja que apareçam de forma abrangente no microssite, como cabeçalhos e imagens de banner.

Layouts e páginas estão ligados por meio de uma estrutura de herança. Tanto páginas quanto layouts podem herdar um layout. Páginas e layouts que tenham um layout herdado terão seu conteúdo envolvido pelo conteúdo do layout herdado.

{% hint style="info" %}
**Exemplo:** Se o seu layout base contiver uma imagem de cabeçalho, qualquer página que herdar o layout base exibirá a mesma imagem de cabeçalho no mesmo local.
{% endhint %}

Se você usou a configuração automática para criar seu microssite, então seu site tem três layouts por padrão.

**Layout base**

O layout base é onde você pode colocar conteúdo que deseja que apareça independentemente de em qual página o participante esteja e se ele está autenticado no seu site. É onde você pode adicionar um cabeçalho ou rodapé que deseja que apareça em todo o site. O layout base também contém o contêiner da marca, que gerencia as cores e as fontes em todo o site.

Ambos os *Layout de usuário conectado* e o *Layout deslogado* herdam o *Layout base*.

<div data-with-frame="true"><figure><img src="/files/361884d96205711a045eb0c4204ab406ed2bb8e5" alt="" width="312"><figcaption></figcaption></figure></div>

**Layout de usuários autenticados**

A *Layout de usuário conectado* é onde você pode adicionar componentes que todos os seus participantes autenticados verão, independentemente da página em que estiverem. Por exemplo, o menu de navegação da barra lateral do seu microssite é criado por meio de um componente no layout. Como ele é adicionado ao layout, qualquer página que herdar esse layout incluirá essa barra lateral.

<div data-with-frame="true"><figure><img src="/files/d0556f12cd0f71a0f9367d2711c8eb234c6196a2" alt="" width="310"><figcaption></figcaption></figure></div>

**Layout de usuários não autenticados**

A *Layout deslogado* é onde você pode personalizar o que qualquer participante que não esteja autenticado no momento verá.

<div data-with-frame="true"><figure><img src="/files/0532ae45762909af0438ef34cb4e3ed9e67b0750" alt="" width="291"><figcaption></figcaption></figure></div>

</details>

<details>

<summary>Páginas</summary>

As páginas são onde você cria o conteúdo do seu site, como explicações do programa, informações sobre indicação e compartilhamento, e texto/imagens. Selecione uma página individual dentro de um dos seus layouts para abrir e editar seu conteúdo.

<div data-with-frame="true"><figure><img src="/files/d62416045bcbc86e0a34c48df62429b5ad962f49" alt="" width="318"><figcaption></figcaption></figure></div>

A visibilidade também pode ser definida no nível da página, permitindo restringir o acesso à página a uma das seguintes opções:

* <mark style="color:$success;">**Verificado**</mark>: Somente participantes autenticados.
* <mark style="color:$danger;">**Não verificados**</mark>: Participantes autenticados que ainda não verificaram seu endereço de e-mail.
* **Público**: Visível para qualquer pessoa.

Se você usou a configuração automática para criar seu microssite, então seu site vem equipado com várias páginas que herdam o *Layout de usuário conectado* e o *Layout de usuário conectado*.

**páginas do layout de usuários autenticados:**

* Atividade
* Painel
* Editar perfil
* Envio de lead
* Impostos e Dinheiro

**páginas do layout de usuários não autenticados:**

* Verificação de e-mail
* Esqueceu a senha
* Login
* Sair
* Página não encontrada
* Cadastro
* Redefinir senha
* Verificar e-mail

</details>

<details>

<summary>Componentes</summary>

Os componentes são elementos individuais que você pode adicionar às suas páginas e layouts para personalizar ainda mais a experiência do microssite dos seus participantes, como imagens de destaque ou um feed de indicações.

Os componentes são agrupados juntos no menu de componentes. Consulte [Componentes de Widget e Microssite Explicados](/brand/pt-br/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences.md) para ver uma lista completa dos agrupamentos de componentes e dos componentes individuais.

<div data-with-frame="true"><figure><img src="/files/8326ec14c6e46de0fc52b597dac19dea3e5c12d1" alt="" width="229"><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/microsite-experiences/microsite-editor-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.