Pular para o conteúdo principal

Landing Page Builder

O Landing Page Builder é um editor visual drag-and-drop que permite personalizar sua landing page sem conhecimento de programação. Alterar cores, textos, imagens, layouts – tudo é ponto e clique.

Watch the Video Tutorial​

Accessing the Builder​

Há duas formas de abrir o builder:

Method 1: From Settings​

  1. Vá para SaaS Management → SuperAdmin Settings → Landing Page Settings
  2. Clique em "Customize with builder"

Method 2: From Sidebar​

  1. Vá para SaaS Management → Landing Page Builder

Builder Interface​

Landing Page Builder interface O Landing Page Builder – Páginas à esquerda, editor visual no centro, propriedades à direita

O builder tem três áreas principais:

AreaLocationWhat It Does
Pages & Sections PanelLado esquerdoNavegar temas, adicionar seções, gerenciar páginas
Visual EditorCentroVer sua página e clicar em elementos para editá-los
Properties PanelLado direitoEditar conteúdo, estilo e configurações do elemento selecionado

Working with Themes​

O painel esquerdo mostra temas disponíveis:

  • SaasCandy – Design moderno focado em SaaS
  • Mexant – Limpo e minimalista
  • Productly – Estilo de showcase de produto

Clique em um tema para começar com suas seções predefinidas, depois personalize a partir daí.

Adding Sections​

  1. No painel esquerdo, clique em "+ Add section"
  2. Navegue pelos tipos de seção disponíveis:
    • Hero – Cabeçalho com título e CTA
    • Features – Mostrar recursos em cards ou listas
    • Pricing – Exibir seus planos de assinatura
    • Testimonials – Citações e avaliações de clientes
    • Contact – Formulário de contato ou informações
    • Custom – Seção em branco para seu próprio conteúdo
  3. Clique em uma seção para adicioná-la à página
  4. Arraste seções para reordená-las

Editing Elements​

  1. Clique em qualquer elemento no editor visual (texto, imagem, botão, etc.)
  2. O Properties Panel à direita mostrará suas configurações
  3. Abas no Properties Panel:
    • Content – Editar texto, imagens, links
    • Style – Alterar cores, fontes, espaçamento, bordas
    • Advanced – Classes CSS, animações, visibilidade

Managing Pages​

O builder suporta múltiplas páginas:

  • Clique em "New page +" na seção Pages (canto superior esquerdo) para criar páginas adicionais
  • Útil para criar páginas separadas de preços, recursos ou sobre

Tips for a Great Landing Page​

Keep It Simple​

  • Não sobrecarregue com seções – 5–7 seções é ideal
  • Cada seção deve ter UM propósito claro
  • Use bastante espaço em branco

Use High-Quality Images​

  • Substitua imagens padrão por suas próprias capturas de tela
  • Mostre sua interface CRM real – real é melhor que stock photos
  • Use tamanhos de imagem consistentes

Optimize for Speed​

  • Mantenha imagens abaixo de 200KB cada
  • Não adicione muitas seções (tempo de carregamento importa!)
  • Teste a velocidade com Google PageSpeed

Test on Mobile​

  • Clique no botão de preview mobile no builder
  • Certifique-se de que todo o texto é legível em telas pequenas
  • Verifique se os botões são fáceis de tocar

Saving Your Changes​

Quando estiver satisfeito com sua landing page:

  1. Clique em "Save Page" (canto superior direito, botão verde)
  2. Clique em "View page" para ver a versão publicada
  3. Compartilhe a URL com os clientes!
aviso

Não esqueça de salvar! As alterações NÃO são salvas automaticamente. Sempre clique em "Save Page" antes de sair do builder.

dica

Landing page está boa? Avance para configurar Custom Domains se quiser oferecer suporte a domínio personalizado para seus tenants premium.