Brightspot CMS Developer Guide

Style variations


Style variations provide different versions of a component. Style variations may be defined in the global configuration file or in a configuration file colocated with the component. A variation may be selected by editors in Brightspot, or a developer can use them to provide a default rendering strategy using Contextual rendering.

The following example registers FancyPromo as a style variation for the Promo component.

{
  "styles": {
    "/core/promo/Promo.hbs": {
      "templates": [
        {
          "displayName": "Fancy Promo",
          "example": "/core/promo/FancyPromo.json"
        }
      ]
    }
  }
}

In this scenario, FancyPromo usually points to a dedicated template for rendering. It may include different styling or behaviors than the original Promo component.

Previous Topic
Data modeling for themes
Next Topic
Theme fields
Was this topic helpful?
Thanks for your feedback.
The elements that get you up and running in a matter of days, from pre-built content types, to modules, to landing pages.

Content types
Modules
Landing pages
Everything you need to manage and administer content within Brightspot CMS, including plug-and-play integrations.

Dashboards
Authoring content
Workflows
Admin configurations
A guide for installing, supporting and administering code on the Brightspot platform, including integrations requiring developer support to use.

Field types
Content modeling
Rich-text elements
Images