Building blocks of content modeling

Optimizely Content Management System properties are the building blocks of CMS content types that make up an application's user interface (UI) content.

When modeling content, consider the level of control you want to give the user, the freedom to adjust the layout and structure of the content, and the reusability of the content. You can take the following approaches to model your content.

• Top-down – Identify the main types of content first, like blogs, product pages, forms, search, galleries, and so on. Instead of the pages you want on your application, think about the types of pages, then work your way down to the details, one level at a time.
• Bottom-up – Start with the finer details, and then group these individual elements together to form a larger content item. For example, think about the text in a call to action (CTA), then the CTA object itself, the title text, and the body text. Then you can group the elements as a promotion box or a card.
• Hybrid – Balance between high-level thinking and granular detail design, providing flexibility to ensure everything is covered.

📘

Note

See an interactive demo on how to approach content modeling in CMS and Visual Builder.

CMS uses the following types of properties:

• Built-in properties – Set by the system and are available for pages and blocks regardless of type. See the following topics for property details:
  • Basic data types
    • Block property
    • Choice property
    • Content property
    • DateTime property
    • Link property
    • Number property
    • Text property
  • Utility
    • Blob property
    • Guid property
    • JsonString property
    • OptiAlloy property
• User-defined properties – Added to the page, block, and experience type definitions (in code or from the admin view). See:
  • Create pages and blocks
  • Create Visual Builder content from scratch
  • Create Visual builder content from a blueprint.

Property types

The following diagram shows the properties with their property types.

Each property group can have several property types that you can use to build named pieces of content for content types. 

For example, the Number property has two types:

• Integer – You can create an Age or Street number field.

  

• Floating point number – You can create a Dollar amount or Interest rate field.

  

You can define the property type building blocks that suit your organization and application. Different content types can reuse a field, such as Age or Dollar amount, so you do not have to define it repeatedly.

Content types

A content type is a collection of properties for a specific use, such as a Call to action content type that has two named properties.

Build an editorial content type

The following diagram shows the Call To Action content type, which contains a Home URL field and a Button Name field. The Home URL field is a link of the URL to page/external address type. The Button Name field is a Simple text box field with a String less than or equal to 255 characters.

The following image shows what the Call To Action content type may look like when you add it to an experience in Visual Builder. Please remember that in order for the content type to be available in the dynamic Visual Builder composition, you need to set the correct composition behavior.

Build a block content type

You can build content types with many properties, such as an Office Location content type with eight simple text box strings with different names.

The following block, called Global HQ, uses the Office Location content type. Red asterisks (*) indicate that the field is required.

The following image shows what it may look like when you place Global HQ on a page.

Configure composition behavior

For a block content type to be available when designing Experience content in the Visual Builder, you need to set its composition behavior. The composition behavior can be found under the Settings for the block type.

The available composition behaviors are:

• Section - The block type will be available to use in the Experience outline
• Element - The block type will be available to use in the Section grid

Build a page content type

You can build more complex types and organize content into pages. For example, the following image combines a simple Text property (called Office Name), a Content Area (called Office Image), a Block with eight properties (called Office Location), and a Text property with extended rich-text editing features (called Description) to create a page content type (called Corporate Office).

These content types are combined to create a page content type called Corporate Office.

After you create it, Corporate Office shows in the Content Types list as a Page content type.

When you create a new page, Corporate Office displays in the Page Types list.

Select it and fill in the required fields.

Configure blank experience

An experience type is an extension of the page type, enhanced for use with Visual Builder.

Go to Settings > Content Types and select Create New > Experience type.

Build an experience content type

An experience is a built-in definition of Experience content type managed from code, so you cannot adjust the Settings, but you can modify Permissions and add properties to the All Properties view of the experience.

The following images illustrate a Blank experience experience content type with added SEO settings content type to the All Properties view, made from a Block property of the Page SEO Settings property type.

The SEO Settings tab displays in the All Properties view with the Block type.

Build a media content type

Media can have the following types: 

• Image – jpg, png, webp, svg
• Video – mp4, avi, mov, wmv, webm
• Other media – pfd, doc, mp3, zip, iso

Go to Settings > Content Types and select Create New > Media type.

The following images illustrate a Media content type, with a Hero image named media content type, made of a Text property for Alt text and a DateTime property for Copyright.