HomeDev GuideAPI Reference
Dev GuideAPI ReferenceUser GuideLegal TermsGitHubNuGetDev CommunityOptimizely AcademySubmit a ticketLog In
Dev Guide

Content model

How to model content in Optimizely Content Management System (CMS) (SaaS).

Content is at the heart of CMS (SaaS). Before building your application, you should consider how you want to model your content. Your content can be any type, including webpages, components, and media, and can be shared across multiple platforms. It is important to model your content in a platform-agnostic way. Content modeling provides a "framework" for content structure in CMS (SaaS).

📘

Note

Before you begin modeling yoru content, see Building blocks of the user interface for information on available property and content types in CMS (SaaS).

Content modeling approaches

How you approach modeling your content depends on your use cases and how you plan on displaying your content in your applications. Here are a few ideas to get you started:

  • Top-down approach – Start from a high-level overview and identify the main types of content you need first. These include blogs, product pages, forms, searches, and galleries—not necessarily the different pages you have on a site but the different types. Then, you can work down to the individual page's details, one level at a time.
  • Bottom-up approach – Start at the most granular level of detail. You start with the finer details and slowly group these elements to form a larger content item. For example, you might think about the text in a call to action (CTA), then the CTA object itself, and the title text and body text afterward. These three elements can then be grouped as promo boxes or cards.
  • Hybrid approach – Combines elements of the top-down and bottom-up methodologies, offering a flexible way to model your content. Start with a high-level overview to identify the main content types and drill down to details when necessary. You might start by identifying major content types like blogs, product pages, and galleries. Then, for each type, you would delve into specifics, such as defining the structure and elements of a blog post (title, body, images, tags). This approach lets you maintain a clear vision of the overall content structure while paying attention to the necessary details that make each content type unique.

No matter the approach, the most important thing to consider when designing your content model is the level of control you want to give the CMS (SaaS) user, the freedom to adjust the content's layout and structure, and the content's reusability.

Content modeling steps

Consider the following high-level steps when developing your content model:

  1. Analyze your requirements – Determine what content your application requires. Consider your application's content, such as blog posts, about me sections, or product listings.
  2. Decide on the structure – Based on your application's requirements, decide how you want that content structured in CMS (SaaS). Determine what content types are needed, including their fields and properties.
    The content type is the foundation for creating one or many experiences, pages, or block instances. The content type and properties must be mapped to the corresponding rendering to display content to visitors.
  3. Create the content types – You can create and manage your content types through the CMS (SaaS) UI or code using the REST API. To create your content types, select the appropriate base type for the content type and configure any standard fields or custom properties. See Content types in the developer guide and Content types in the end-user guide.

Example

Using the sample Moseybank application from the Create a demo site using CMS (SaaS) and Vercel and Create a demo site using CMS (SaaS) and Netlify walkthroughs, here are some options for modeling content for the masthead banner.

Masthead example from Moseybank

From the image, you can break down the different content of the masthead. There are five pieces of content:

  1. Image
  2. Image
  3. Title
  4. Main content section
  5. Call to action (CTA) button

To increase the reusability, you can group these into three content types: image, text, and button. You can design your content model differently depending on the level of control, freedom, and reusability you want to give to CMS (SaaS) users. Here are a few examples:

  • All content within a single item – You can create a single component with the five content types listed separately. This option offers no flexibility regarding what a CMS (SaaS) user can control, where everything displays, and the content works exactly the way it was designed.
  • A content holder for different content types – You can create a content holder by masthead type and then create content types for images, text, and buttons. This option improves the reusability of content types but does not give much control or freedom of the design.
  • Create content types with styling options – You can create and add styling options for the layout and structure of content types, including the image, text, and button content types. This provides flexibility to the design defined in CMS (SaaS), and you can reuse these content types in different combinations to meet many different needs.

As you can see from the examples above, there are many different ways of implementing content modeling, from the first example of almost no freedom and control to the last example of maximum flexibility, reusability, freedom, and control.

This example only discusses the masthead banner, but when you start looking at the design of your entire application, you may notice similar content in multiple places. For example, sections of your application follow the same pattern, such as pages containing titles, text, and buttons. Instead of creating pages with this combination every time, these can be set as a content type and made reusable.

See the interactive demo using a CMS (SaaS) instance for information on content modeling in action.