Editar páginas no Builder
Cada página do site é montada com componentes que você arrasta, configura e publica um a um, e a página não tem um botão que publique tudo de uma vez.
Onde acessar
No Builder, as páginas ficam em dois grupos da barra lateral:
- Páginas padrão: as páginas públicas do site, como Builder > Páginas padrão > Home.
- Preview: as páginas da área do aluno dentro de um curso, como Builder > Preview > Preview do curso.
💡 Como abrir o Builder: no admin, abra uma área de membros em Loja > Produtos > Área de membros, entre em Área de membros > Personalizar e clique no card Editar vitrine. O Builder abre em outra aba. As páginas só aparecem para administrador de plataforma.
Quais páginas existem
| Página | O que é |
|---|---|
| Home | Página inicial da plataforma |
| Loja | Listagem de produtos |
| Detalhes do produto | Modelo da página de produto. Vale para todos os produtos |
| Categoria | Modelo da página de categoria. Vale para todas |
| Professor | Modelo da página de professor. Vale para todos |
| Sobre | Página institucional |
| Busca | Página de resultados da busca |
| Página de cursos do aluno | Lista do que o aluno comprou. É o último item do grupo Páginas padrão |
| Preview do curso | Área do aluno dentro de um curso |
| Preview · Professores, Preview · Categorias e Preview · Módulos | Variações do preview por professor, categoria e módulo |
Não dá para criar uma página padrão nova nem excluir uma existente. Para uma página avulsa, use uma landing page (veja mais abaixo).
A tela de entrada da página
Ao clicar em uma página, você vê o título, a descrição, o selo Publicada ou Rascunho, a data da última edição, a URL da página (com os botões de copiar e de abrir em nova guia) e dois botões.
- Editar página abre o editor.
- Publicar ou Despublicar aparece na tela, mas hoje não executa nenhuma ação nas páginas padrão. A publicação é feita componente por componente, dentro do editor.
O selo mostra Publicada quando ao menos um componente da página está publicado.
⚠️ Nas páginas que são modelo (Detalhes do produto, Categoria e Professor) e nas de Preview, o endereço mostrado é genérico e não serve como link para divulgar. O endereço real de cada curso, professor, loja e categoria está em Builder > Personalizar páginas.
O editor
O editor ocupa a tela inteira, em três colunas:
- Esquerda: a biblioteca de componentes, em grupos que abrem e fecham.
- Centro: os componentes da página, na ordem em que aparecem no site.
- Direita: o painel de configuração, que aparece ao clicar em um componente.
No topo ficam a seta de voltar, o nome da página, o endereço público e o botão de atualizar.
Adicionar um componente
Arraste o item da biblioteca para a coluna central. Ele entra como Rascunho, com o aviso "Componente adicionado!". Enquanto for rascunho, o aluno não vê.
Configurar
Clique no componente. O painel abre na aba Editor, com a pré-visualização, o status e os campos daquele componente. Ao terminar, clique em Salvar. O aviso é "Componente atualizado!".
A aba Código JSON mostra a configuração bruta do componente. Use só com orientação do suporte.
Publicar
No painel do componente, clique em Publicar. O status passa a Publicado e a mudança vale na hora no site. Despublicar tira o componente do ar sem apagar a configuração.
Os três status possíveis são Rascunho, Publicado e Despublicado. A caixa Só publicados, na coluna central, filtra a lista para mostrar só o que está no ar.
Ordenar
Arraste o componente pela alça. Aparece a barra "Ordem alterada": clique em Salvar Ordem. Sem esse clique, a ordem antiga continua valendo.
Remover
Clique no ícone de lixeira do componente e confirme. A remoção não pode ser desfeita.
⚠️ Não existe rascunho da página nem histórico de versões. Cada componente publicado muda o site na hora. Para preparar uma mudança sem que o aluno veja, adicione o componente novo, configure com calma e só publique quando estiver pronto.
Campos que se repetem
Vários componentes têm os mesmos campos:
| Campo | Opções |
|---|---|
| Schema | O estilo visual do componente. As opções mudam de um componente para outro |
| Visível para | "Todos", "Apenas logados" ou "Apenas visitantes" |
| Margens e fundo | Margem em cima, embaixo, à esquerda e à direita ("Pequeno", "Padrão", "Médio", "Grande" ou nenhuma), a chave Personalizar para celular e a Cor de fundo |
A cor de fundo pode ser uma das cores da paleta ("Principal", "Secundária", "Seção", "Terciária", "Header", "Footer") ou "Personalizada…".
Componentes disponíveis
A biblioteca tem 36 componentes, em 9 grupos. Ela é a mesma em todas as páginas.
| Grupo | Componentes |
|---|---|
| Listas de Cards | Card List, Card List Paginado, lista horizontal de professores, lista horizontal de categorias, Agenda de Aulas |
| Banners e Carrossel | Banner, Carrossel |
| Mídia e Imagens | Mídia Estática, Seção de Vídeo, Lista de Imagens, Carrossel Estático, Galeria de Fotos |
| Conteúdo | Bloco HTML, Título/Descrição, Depoimentos, Compartilhar, Pesquisa NPS, Step Flow, Bloco de Localização, Perguntas Frequentes |
| Ofertas | Ofertas do Curso, Ofertas de Planos |
| Curso | Card de Oferta, Módulos do Curso, Módulos e Aulas, Oferta Flutuante, Painel de Compra, Lista de Professores |
| Estrutura do App | Cabeçalho, Rodapé, Login, Cadastro Padrão, Recuperar Senha |
| Área do Aluno | Menu lateral de cursos do aluno, Sobre o Curso |
| Busca | Cabeçalho, Resultados e Filtros da busca |
Alguns nomes mudam depois que o componente é solto na página. "Carrossel" vira "Carrossel Principal", "Bloco HTML" vira "HTML Livre" e "Pesquisa NPS" vira "Modal NPS". Se o componente tem um título preenchido, o cartão mostra esse título no lugar do nome.
Como a biblioteca não filtra por página, é possível soltar um componente onde ele não faz sentido, por exemplo um componente de curso na página inicial. Nesse caso ele pode aparecer vazio.
Imagens nos componentes
Nos componentes com imagem, o campo aceita envio de arquivo (Enviar imagem (upload)) ou um endereço colado.
- Tamanho máximo: 10 MB. Acima disso aparece "Imagem acima de 10MB.".
- Formatos: WEBP, JPG, JPEG, PNG, GIF e SVG.
- JPG e PNG são convertidos para WEBP. Quando o campo tem proporção fixa, abre um recorte com os botões Usar imagem, Usar original e Cancelar.
- GIF, SVG e WEBP sobem como estão, sem recorte. Se o campo tem proporção fixa, prefira JPG ou PNG.
| Componente | Proporção do recorte | Largura máxima |
|---|---|---|
| Banner (desktop) | Escolhida no recorte | 1920 px |
| Banner (mobile) | Escolhida no recorte | 1080 px |
| Galeria de Fotos | 4:3 | 1200 px |
| Lista de Imagens | 4:3 | 1200 px |
| Carrossel Estático | 16:9 | 1920 px |
| Step Flow (desktop) | 16:9 | 1600 px |
| Step Flow (mobile) | 1:1 | 1080 px |
| Depoimentos | 1:1 | 400 px |
| Mídia Estática | Sem recorte | 1920 px |
Landing pages
Em Builder > Landing Page você cria páginas avulsas, no endereço https://seudominio/lp/nome-da-pagina.
- Clique em + Criar landing page.
- Preencha Nome da página, Título da página (o que aparece na aba do navegador), Descrição do site (opcional) e URL da página (só letras minúsculas, números, hífen e sublinhado).
- Clique em Continuar, escolha como começar e clique em Criar landing page.
- Clique em Ir para a edição e monte a página com o mesmo editor.
- De volta à lista, clique em Publicar no cartão da página.
O que você precisa saber antes de criar:
- Os templates não preenchem a página. As opções "Hero de destaque", "Conteúdo e parceiros", "Trailer e conteúdo" e "Banner destaque" aparecem na tela, mas a página é criada vazia em qualquer escolha. Você monta do zero.
- A landing page é a única com publicação da página inteira. O botão Publicar ou Despublicar do cartão funciona. Os componentes dentro dela ainda precisam estar publicados.
- Título, descrição e URL não podem ser editados depois. Confira antes de criar. Para corrigir, exclua a página e crie outra.
- O cartão mostra o Título da página, não o nome.
- A página nasce despublicada e fica na aba Despublicadas.
Personalizar páginas
Builder > Personalizar páginas lista cursos, professores, lojas e categorias, cada um com o seu endereço público e os botões de copiar e de abrir em nova guia.
A edição por item ainda não está disponível: ao clicar em um curso, professor, loja ou categoria, a tela informa que a personalização daquela página ainda não pode ser feita. Hoje a aparência da página de todos os produtos vem do modelo Builder > Páginas padrão > Detalhes do produto. O mesmo vale para Categoria e Professor.
Use esta tela para achar e copiar o endereço correto de cada item.
O que não existe
- Campos de SEO por página (título e descrição para buscadores). Só a landing page tem título e descrição, definidos na criação.
- Página de erro 404 personalizada.
- CSS customizado. O mais próximo é o componente Bloco HTML, para um trecho de HTML dentro da página.
- Histórico de versões ou botão de desfazer.
- Agendamento de publicação.
Erros comuns
"Cliquei em Publicar na tela da página e nada aconteceu"
Esse botão não tem ação nas páginas padrão. Entre em Editar página e publique cada componente.
"Adicionei o componente e ele não aparece no site"
Ele ainda é rascunho. Clique nele e depois em Publicar.
"Mudei a ordem e o site continua igual"
Faltou clicar em Salvar Ordem.
"Escolhi um template de landing page e a página veio vazia"
É o comportamento atual: os templates não são aplicados. Monte a página com os componentes da biblioteca.
"O Carrossel não tem onde colocar imagem"
As imagens do carrossel são os banners cadastrados no admin. Veja Banners: o que são e onde ficam.