O editor está dividido em três áreas principais: a barra superior (em verde), o menu lateral (em vermelho) e a área de edição (em azul).


Barra superior

A barra superior possui alguns controles importantes para a edição da página:

  • Botões Desktop, Tablet, Celular - Modificam o formato da página e a área de edição reflete como a página seria exibida em outro formato de tela.

  • Botões desfazer e refazer ações - Desfaz as ações e refaz as ações.

  • Auto save - todas as suas alterações são salvas automaticamente.

  • Configurações - Nome da página, link do Pixel do facebook, informações do SEO e paleta de cores.

  • Código da página - permite a edição do Head e Body do código.

  • Botão Fechar o Editor - Fecha o editor e por estar aberto em outra aba, direciona você para a página inicial da Hero.

  • Pré-visualizar a página - compila informações da página, javascript e css em uma visualização em tela cheia numa aba separada onde você pode visualizar como a página ficará

  • Publicar - publica a versão salva da página


Área de Construção da Página

A área de Construção da Página é onde a página é construída de fato. Nela geralmente estão contidos vários componentes, que podem ter suas configurações editadas através do Menu Lateral do Editor

Atenção! Caso tenha dúvidas quanto à navegação entre os componentes, confira Como Abrir as Configurações de um Componente


Uma página possui 3 tipos de componentes: widgets, painéis e seções.

1. Widgets

Widgets (ou conteúdos) são componentes básicos, cada um tem um conjunto de configurações e uma função específica.

Atualmente o editor suporta os seguintes widgets: Imagem, Vídeo, Texto, Botão e Formulário

2. Painéis
Estrutura onde ficam contidos os widgets, utilizados principalmente para ajustar a disposição e layout dos elementos da página.

3. Seções
Estrutura onde ficam contidos painéis, define um contexto. É usado para organizar a página, e pode ser usado para delimitar áreas da sua página, como “Cabeçalho” ou “Área de depoimentos'', por exemplo.


Menu Lateral do Editor

O Menu Lateral do Editor é onde você realiza as configurações de todos os componentes.