Skip to main content

Introduction

Manage website pages and mobile app screens with dynamic content.

🎯 What does this module do?

The Pages module allows you to create, retrieve, and manage pages (for websites) or screens (for mobile apps) along with all their content - text, images, SEO settings, and custom attributes.

Think of it as your content management system - instead of hardcoding pages, you manage them in OneEntry and fetch them dynamically in your app.

📖 Simple Explanation

Imagine you're building a website with these pages:

  • 🏠 Home page - main landing page
  • 📄 About Us - company information
  • 📞 Contact - contact form page
  • 📝 Blog posts - multiple article pages
  • FAQ - help center

Instead of creating each page manually in your code, you:

  • ✅ Create pages in the OneEntry admin panel (with content, images, SEO)
  • ✅ Fetch pages dynamically using this module
  • ✅ Update content without redeploying your app
  • ✅ Manage page structure, URLs, and metadata in one place

Real-world example:

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 ✅

✨ Key Concepts

What is a Page?

A page is a content entity that represents:

  • Web: A page on your website (e.g., /about, /contact)
  • Mobile: A screen in your app (e.g., Profile Screen, Settings Screen)

Each page contains:

  • Content - Text, images, videos
  • URL - Page address (e.g., /about-us)
  • SEO - Meta title, description, keywords
  • Custom attributes - Any additional fields you define
  • Status - Published, draft, archived
  • Localization - Multi-language support

Page Types

OneEntry supports different page types:

TypeDescriptionExample Use
Common PageStandard static pageAbout, Contact, Terms
Catalog PageCatalog pagesCatalog pages
External PageExternal pagesExternal pages
Error Page404, 500 error pagesNot Found page

Page Hierarchy

Pages can be organized in a tree structure:

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

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

Why this matters: You can fetch all pages in a section or build navigation menus automatically.

📋 What You Need to Know

Two Ways to Identify Pages

MethodWhen to UseExample
By URLUser visits specific page/about-us, /contact
By IDInternal references123, 456

Best practice: Use id in code (they don't change), use URLs for routing.

Page Structure

Every page has these key fields:

{
"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
}

Localization (Multi-language)

Pages support multiple languages

Same page, different languages!

Custom Attributes

You can add any fields to pages using AttributesSets:

Examples:

  • Blog posts: author, publish date, tags, featured image
  • Product pages: price, SKU, gallery, specifications
  • Landing pages: hero image, CTA buttons, testimonials

Learn more: See AttributesSets Module


📊 Quick Reference Table - Common Methods

MethodWhat It DoesWhen to Use
getPages()Get all pages (paginated)Build sitemap, list all pages
getRootPages()Get all Root pages (paginated)
getChildPagesByParentUrl()Get all Child pages by ParentUrl (paginated)
getBlocksByPageUrl()Get PositionBlock objects for page by url.Blocks are used to render page content.
getConfigPageByUrl()Getting settings for the page by url.Config pages are used to store settings for the page.
getPageById()Getting a single page.Pages are used to render the page.
getPageByUrl()Getting a single page by URL.Pages are used to render the page.
searchPage()Quick search for pages with limited output.Search pages by title, description, tags, etc.

❓ Common Questions (FAQ)

What's the difference between URL and ID?

  • URL (pageUrl) - The web address users see (e.g., /about-us, /contact)

    • Used for routing
    • User-friendly
  • ID - Technical identifier in code (e.g., 123, 124)

    • Used in code references
    • Technical, not user-facing

💡 Important Notes

Page URLs and Routing

Best practice for routing:

✅ Good: Dynamic catch-all route
Next.js example: pages/[...slug].js


Caching for Performance

Reduce API calls with caching.


Preview Drafts

Show draft pages to admins only.


🎓 Best Practices

  • Cache pages to reduce API calls
  • Handle 404 errors gracefully
  • Filter by statusId: 1 and isVisible: true for production
  • Add loading states in UI
  • Implement page caching strategy

More information about the module's user interface https://doc.oneentry.cloud/docs/category/pages


Definition of the Pages module


const { Pages } = defineOneEntry(
"your-project-url", {
"token": "your-app-token"
}
);