arrow-down
    1. Overview
    2. Core concepts
    3. Using docs
    4. Intro Videos
    5. Tutorials
    1. Intro
    2. GraphQL API
    3. Media API
    4. Extending the API
    5. Component API
    1. Content Studio
      1. Branches
    2. Layers
      1. Lifecycle
      2. Media
      3. Attachments
      4. X-data
        1. Page templates
        2. Fragments
      5. Variants
      6. Permissions
      7. Versions
    3. Sites
      1. Visual editor
    4. Publishing
    1. Introduction
      1. Controllers
      2. Globals
      3. Events
      4. HTTP Request
      5. HTTP Response
      6. Error handler
      7. Filters
      8. Templating
      9. Localization
      10. Websocket
      11. Tasks
      12. Main controller
      13. Java bridge
      1. Admin Lib
      2. Application Lib
      3. Auditlog Lib
      4. Authentication Lib
      5. Cluster Lib
      6. Common Lib
      7. Content Lib
      8. Context Lib
      9. Event Lib
      10. Export Lib
      11. Grid Lib
      12. I18N Lib
      13. IO Lib
      14. Mail Lib
      15. Node Lib
      16. Portal Lib
      17. Project Lib
      18. Repo Lib
      19. Scheduler Lib
      20. Schema Lib
      21. Tasks Lib
      22. Value Lib
      23. VHost Lib
      24. Websocket Lib
    2. Other Libraries
      1. CLI
      2. Sandboxes
      3. Code
      4. Building
      5. Configuration
      6. TypeScript
    3. Building APIs
      1. Mappings
      2. Components
      3. Processors
      4. Contributions
    4. Building Webapps
      1. ID providers
      2. Admin Apps
      3. Admin Widgets
    1. Architecture
      1. TODO
      1. Navigating
      2. Users
      3. Applications
      4. Data management
      5. System info
      6. Audit Logs
      7. Task management
      1. Portal
      2. IDprovider
      3. Management
      4. Statistics
      1. Nodes and repos
      2. Properties
      3. Indexing
      4. Branches
      5. Editors
      1. DSL Queries
      2. NoQL Queries
      3. Filters
      4. Aggregations
      5. Highlighting
      1. ID providers
      2. System ID provider
      3. Users and groups
      4. Roles
      1. Strategies
      2. Distributions
      3. Docker
      4. Kubernetes
      5. Systemd
      6. Vhosts
      7. Configuration
      8. Backup & restore
      9. Clustering
      10. Observability
      1. Notes
      2. Upgrade
      3. Upgrading Apps
        1. Asset service
        2. HTTP service
        3. Image service
    1. Best practice
        1. AttachmentUploader
        2. Checkbox
        3. Combobox
        4. ContentSelector
        5. ContentTypeFilter
        6. CustomSelector
        7. Date
        8. DateTime
        9. Double
        10. GeoPoint
        11. HtmlArea
        12. ImageSelector
        13. Long
        14. MediaSelector
        15. Radiobutton
        16. Tag
        17. TextArea
        18. TextLine
        19. Time
        1. Field set
        2. Item set
        3. Option set
      1. Mixins
      2. Localization
      3. Styles
    2. Content Types
    3. X-data
    4. Macros
      1. Pages
      2. Regions
      3. Part component
      4. Layout component
      5. Text component
      6. Component Filtering
      7. Component Indexing
    1. Marketplace
    2. Market guidelines

Pages and components

Contents

Pages allow you to create rich visually oriented content.

Introduction

Pages and components are only available within sites. Any content item (and thus any content type) may also be a page. Similar to how you may add X-data to any content.

Pages are made up from from one or more components. In addition to the page component, there are other component types such as parts, layouts, fragments and text.

Regions enable creation of hierarchical components structures.

Seen from Content Studio, a page, and it’s component structure might look like this:

Component editor

Page component

At the root of every page, you will find the page component. Most sites only need a single page component, as this can be reused across all pages.

In order to create pages, at least one page component must be defined for your site.

To create a page component, add a component descriptor file to your project src/main/resources/site/pages/<page-name>/<page-name.xml>.

The name you choose for a component will be used in the underlying data of the stored page. So choose your name wisely.

Usage

To create a page component, place a descriptor file in your project: `src/main/resources/site/pages/<page-name>/<page-name>.xml.

Sample page descriptor
<page>
  <display-name i18n="component.page.name">My first page</display-name> (1) (2)
  <description>Front page of our site</description>  (3)
  <form/>  (4)
  <regions>
    <region name="main"/>  (5)
  </regions>
</page>
1 display-name provides a display name used by the editorial interface
2 display-name/i18n optionally specify localization key
3 description Description field shown when creating a part in content studio
4 form allows the definition of a configuration form based on the schema system
5 region optionally specify regions for the page.
A page component may define zero, to many regions. Conventionally, a page should at least define a single region called main.

Contents

Contents

AI-powered search

Juke AI