Reusing data files

You can promote the re-use of low-level data files by grouping them inside JSON arrays, one array per file. You store these files inside the directory styleguide/_group/, and then refer to the arrays’ elements from the parent data files.

Typical project structure

├── All.js
├── All.less
└── styleguide/
    ├── _group/
    │   └── Images.json
    ├── chefs/
    │   ├── Chefs.hbs
    │   ├── Chefs.json
    |   |     {
    |   |       “_include”: ”/_group/Images.json”,
    |   |       “_key”: 0
    |   |     }            
    │   └── Chefs.less
    └── recipes/
        ├── Recipes.hbs
        ├── Recipes.json
        |     {
        |       “_include”: ”/_group/Images.json”,
        |       “_key”: 2
        |     }            
        └── Recipes.less

In the previous illustration, the data files Chefs.json and Recipes.json have a stanza that refers to a file /_group/Images.json, which is an array of similar template definitions. Chefs.json incorporates the first element in the array; Recipes.json incorporates the third element.

This modulariztion helps to easily update parent data files; if you modify one of the data files in the directory _group/, all the referring data files inherit the modifications.

The following steps illustrate how to create a collection of low-level data files and how to refer to them in parent data files.

Step 1: Create a library of related low-level data files

In the directory styleguide/_group/, create a JSON file as an array of similar data files.


    "_template": "/path/Image.hbs",
    "src": "/otherPath/porridge-too-hot.png"
    "_template": "/path/Image.hbs",
    "src": "/otherPath/porridge-too-cold.png"
    "_template": "/path/Image.hbs",
    "src": "/otherPath/porridge-just-right.png"

Step 2: Include low-level data file in parent

Include one of the low-level data files in your parent data file.

  "_template": "Goldilocks.hbs", 
  "illustration": { 
    "_include": "/_group/Images.json", 
    "_key": 2
  • Indicates the associated template is Goldilocks.hbs.
  • Indicates that illustration is populated by the third template (counting from 0) defined in the file Images.json.

See also:

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