Module: Model website presentation components

3 of 11 Pages

Define presentation components

Kentico comes with a user-friendly interface called Page Builder that allows non-technical users to build pages from configurable page templates, sections, and widgets prepared by the developers. Editors can create pages, each with a different layout, without the help of developers. Using content personalization, they can also tailor the page’s content based on visitors’ previous activities.

Page templates define the overall look of the page. Developers build the templates to display content, and editors assign them when they create new or change the layout of existing pages. Editors can also save template configurations into page presets and speed up content creation.

  • General purpose page templates display data stored in a structured format. Editors input content through unified form fields in the admin UI, and the template shows the content dynamically. The website can have multiple templates to display the same content differently, or each template can have specific properties to adjust the page layout. Find out more about page templates in Kentico documentation.
  • Page Builder templates display data through the Page Builder widgets and provide editors with great layout and design options. Find out more about page templates with Page Builder in the documentation.

Even if the page templates display structured content dynamically, we recommend that developers enable Page Builder.

Sections define the page’s vertical and horizontal layout with Page Builder. They determine areas where editors place the content in widget zones. Sections can have properties editors use to define what the sections with widget zones look like, for example, their background and the number of columns where editors input widgets or adjust whitespace around individual content pieces.

Widgets are the most granular Page Builder components. Editors use them to add or display content on the page or to add specific functionality. Widgets are reusable, and different pages or website channels can share the same set of widgets. This dramatically helps the editing experience. Your team gets used to how to create pages in one channel, and they can quickly transfer this knowledge when your company decides to introduce other new website channels, for example, campaign microsites.

Similarly to other Page Builder components, developers prepare widgets to display reusable content from the Content hub or allow editors to create one-off content for individual pages. Based on the project requirements, each widget can have its properties that editors configure which data to display and what it will look like on the page. Editors can also create personalized variants of the widget’s content to tailor the page experience to specific visitor segments.

We recommend that developers build page templates with editable properties editors will use to create their pages. To make their content future-friendly, editors should store it in the structured format and use widgets to display it on the website.

Identify individual page components

Let’s take a look at two pages on the Kbank website.

Article reusable content type

Product content type

Article page template

Product page template

Reusable Article content type

Reusable Product content type

Define editable properties for individual components

Let’s take a look at individual component and their properties. The following list describes individual widgets and their properties, which you can find on the Kbank demo site. It represents one of the options, and you can approach your content creation differently.

The following section shows different Page Builder components and their configuration options. You can see them in action on the Kbank demo site.