Brightspot CMS Developer Guide

Preview System

The Brightspot preview system enables users to view how an asset will appear once it is published or delivered to a downstream channel. This system offers flexibility in determining the downstream delivery mechanism, whether it is a decoupled rendering system, headless delivery, document generation, or mobile virtual device. While Brightspot provides several default preview types for common scenarios, you can customize the system to create preview types tailored to your specific needs.

The following documentation provides a comprehensive overview of the preview system's functionality, including how it operates, instructions for building custom preview types, guidance on configuring the preview type for individual assets, and a technical overview of Brightspot's Preview to Edit system.

Key components

Below are some key components of the Brightspot preview system:

  • Preview Type: This mechanism enables the display of a preview for a given preview object. To define a new way to display a preview, you need to implement the abstract class
  • IFrame Preview Type: This preview type utilizes an HTML iframe to show the preview within the CMS. Brightspot provides, an abstract class extending that assists in creating this specific preview type.
  • Default Preview Type: Brightspot offers this pre-built preview type to facilitate previewing content delivered through its decoupled rendering system.
  • Content Delivery Preview Type: A standard preview type designed specifically for previewing content delivered via headless content delivery.
  • Preview Object: The database record that stores all the necessary data for creating an object's preview. The class powers this functionality.
  • Preview Context: The context in which the preview object is displayed within the CMS. For example, the preview context is content-edit-preview when a preview object is used on the content edit page. In contrast, the preview context is share-preview when used in shared preview. The preview context is employed to control which preview controls are displayed in different contexts.
  • Preview Controls: Preview types generally offer various options for how they are displayed. For example, a Preview Width Control allows users to see how the asset appears at different browser widths.
  • Shared Preview: This is a standard preview context that enables non-Brightspot users to view an asset's preview.
  • Mirror Preview: This standard preview context allows Brightspot or non-Brightspot users to view a preview of the content currently being edited by a user in a separate window.
Previous Topic
Next Topic
Creating a custom Preview Type
Was this topic helpful?
Thanks for your feedback.
Our robust, flexible Design System provides hundreds of pre-built components you can use to build the presentation layer of your dreams.

Asset types
Module types
Page types
Brightspot is packaged with content types that get you up and running in a matter of days, including assets, modules and landing pages.

Content types
Landing pages
Everything you need to know when creating, managing, and administering content within Brightspot CMS.

Admin configurations
A guide for installing, supporting, extending, modifying and administering code on the Brightspot platform.

Field types
Content modeling
Rich-text elements
A guide to configuring Brightspot's library of integrations, including pre-built options and developer-configured extensions.

Google Analytics
Apple News