Pular para o conteúdo principal

Introdução

Gerencie páginas de websites e telas de aplicativos móveis com conteúdo dinâmico.

🎯 O que este módulo faz?​

O módulo Pages permite que você crie, recupere e gerencie páginas (para websites) ou telas (para aplicativos móveis) com todo o seu conteúdo - texto, imagens, configurações de SEO e atributos personalizados.

Pense nisso como seu sistema de gerenciamento de conteúdo - em vez de codificar páginas manualmente, você as gerencia no OneEntry e as busca dinamicamente em seu aplicativo.

📖 Explicação Simples​

Imagine que você está construindo um website com estas páginas:

  • 🏠 Página inicial - página principal de aterrissagem
  • 📄 Sobre Nós - informações da empresa
  • 📞 Contato - página do formulário de contato
  • 📝 Postagens de Blog - várias páginas de artigos
  • ❓ FAQ - centro de ajuda

Em vez de criar cada página manualmente em seu código, você:

  • ✅ Cria páginas no painel de administração do OneEntry (com conteúdo, imagens, SEO)
  • ✅ Busca páginas dinamicamente usando este módulo
  • ✅ Atualiza o conteúdo sem precisar reimplantar seu aplicativo
  • ✅ Gerencia a estrutura da página, URLs e metadados em um só lugar

Exemplo do mundo real:

Without Pages Module (hardcoded):
- Edit homepage → Change code → Test → Deploy → Wait ❌
- 10 pages = 10 code files to manage ❌
- SEO changes = code changes ❌

With Pages Module (dynamic):
- Edit homepage → Update in OneEntry admin → Live instantly ✅
- 100 pages = fetch dynamically from API ✅
- SEO changes = update in admin panel ✅

✨ Conceitos Chave​

O que é uma Página?​

Uma página é uma entidade de conteúdo que representa:

  • Web: Uma página no seu website (por exemplo, /about, /contact)
  • Móvel: Uma tela no seu aplicativo (por exemplo, Tela de Perfil, Tela de Configurações)

Cada página contém:

  • Conteúdo - Texto, imagens, vídeos
  • URL - Endereço da página (por exemplo, /about-us)
  • SEO - Meta título, descrição, palavras-chave
  • Atributos personalizados - Quaisquer campos adicionais que você definir
  • Status - Publicado, rascunho, arquivado
  • Localização - Suporte a múltiplas línguas

Tipos de Página​

O OneEntry suporta diferentes tipos de páginas:

TipoDescriçãoExemplo de Uso
Página ComumPágina estática padrãoSobre, Contato, Termos
Página de CatálogoPáginas de catálogoPáginas de catálogo
Página ExternaPáginas externasPáginas externas
Página de ErroPáginas de erro 404, 500Página Não Encontrada

Hierarquia de Páginas​

As páginas podem ser organizadas em uma estrutura de árvore:

📁 Company
  ├─ About Us
  ├─ Team
  └─ Careers

📁 Products
  ├─ Product Category 1
  │   ├─ Product A
  │   └─ Product B
  └─ Product Category 2

Por que isso é importante: Você pode buscar todas as páginas em uma seção ou construir menus de navegação automaticamente.

📋 O que você precisa saber​

Duas Maneiras de Identificar Páginas​

MétodoQuando UsarExemplo
Por URLO usuário visita uma página específica/about-us, /contact
Por IDReferências internas123, 456

Melhor prática: Use id no código (eles não mudam), use URLs para roteamento.

Estrutura da Página​

Cada página tem estes campos principais:

{
  "id": 9,                        // unique ID
  "parentId": 8,                  // parent ID
  "moduleFormConfigs": [],        // Forms module configurations
  "pageUrl": "blog1",             // page URL
  "depth": 1,                     // depth
  "localizeInfos": {              // localization info
    "title": "Blog 1",            // title
    "menuTitle": "Blog 1",        // menu title
    "htmlContent": "",
    "plainContent": "",
  },
  "isVisible": true,              // visibility
  "blocks": [],                   // blocks
  "type": "common_page",          // page type
  "templateIdentifier": null,     // template identifier
  "attributeSetIdentifier": null, // attribute set identifier
  "attributeValues": {},          // attribute values
  "isSync": false,                // sync
}

Localização (Múltiplas línguas)​

As páginas suportam múltiplas línguas

Mesma página, diferentes idiomas!

Atributos Personalizados​

Você pode adicionar quaisquer campos às páginas usando AttributesSets:

Exemplos:

  • Postagens de blog: autor, data de publicação, tags, imagem em destaque
  • Páginas de produtos: preço, SKU, galeria, especificações
  • Páginas de aterrissagem: imagem principal, botões de CTA, depoimentos

Saiba mais: Veja Módulo AttributesSets

📊 Tabela de Referência Rápida - Métodos Comuns​

MétodoO que FazQuando Usar
getPages()Obtém todas as páginas (paginadas)Construir sitemap, listar todas as páginas
getRootPages()Obtém todas as páginas Raiz (paginadas)
getChildPagesByParentUrl()Obtém todas as páginas Filhas por ParentUrl (paginadas)
getBlocksByPageUrl()Obtém objetos PositionBlock para a página por url.Blocos são usados para renderizar o conteúdo da página.
getConfigPageByUrl()Obtendo configurações para a página por url.Páginas de configuração são usadas para armazenar configurações para a página.
getPageById()Obtendo uma única página.Páginas são usadas para renderizar a página.
getPageByUrl()Obtendo uma única página por URL.Páginas são usadas para renderizar a página.
searchPage()Pesquisa rápida por páginas com saída limitada.Pesquisar páginas por título, descrição, tags, etc.

❓ Perguntas Comuns (FAQ)​

Qual é a diferença entre URL e ID?​

  • URL (pageUrl) - O endereço da web que os usuários veem (por exemplo, /about-us, /contact)

    • Usado para roteamento
    • Amigável ao usuário

  • ID - Identificador técnico no código (por exemplo, 123, 124)

    • Usado em referências de código
    • Técnico, não visível para o usuário

💡 Notas Importantes​

URLs de Páginas e Roteamento​

Melhor prática para roteamento:

✅ Bom: Rota dinâmica catch-all Exemplo do Next.js: pages/[...slug].js

Cache para Desempenho​

Reduza chamadas de API com cache.

Visualização de Rascunhos​

Mostre páginas de rascunho apenas para administradores.

🎓 Melhores Práticas​

  • Cache as páginas para reduzir chamadas de API
  • Trate erros 404 de forma elegante
  • Filtre por statusId: 1 e isVisible: true para produção
  • Adicione estados de carregamento na UI
  • Implemente uma estratégia de cache de páginas

Mais informações sobre a interface do usuário do módulo https://doc.oneentry.cloud/docs/category/pages

Definição do módulo Pages​


const { Pages } = defineOneEntry(
  "sua-url-do-projeto", {
    "token": "seu-token-de-aplicativo"
  }
);

🔗 Documentação Relacionada​