Topics

Wireframes for Brightspot GO theme layouts


In This Guide

Brightspot GO’s layouts include dozens of layout elements that you can show, hide, and customize. This section provides wireframes for the most common layouts. You can use the wireframes to locate the corresponding elements within data files and templates.


Content-type layouts

This section describes the layouts for Brightspot’s basic content types.

Article layout

The following wireframe shows the layout for articles as described in /styleguide/core/article/ArticlePage.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Author layout
The following wireframe shows the layout for authors as described in /styleguide/core/author/AuthorPage.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Blog layout
The following wireframe shows the layout for blogs as described in /styleguide/blog/BlogPage.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Blog post layout
The following wireframe shows the layout for blog posts as described in /styleguide/blog/blogpost/BlogPostPage.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Gallery layout
The following wireframe shows the layout for galleries as described in /styleguide/core/gallery/GalleryPage.hbs. Elements in the legend correspond to objects in JSON data files.

Gallery, Slides

Layout

Gallery, Thumbnails

Layout

Gallery, Long

Layout

Page layout
The following wireframe shows the layout for pages as described in /styleguide/core/page/Page.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Press release layout
The following wireframe shows the layout for press releases as described in /styleguide/corporate/press-release/PressRelease.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Search results layout
The following wireframe shows the layout for search results as described in /styleguide/core/search/SearchResultsPage.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Section layout
The following wireframe shows the layout for sections as described in /themes/<theme-name>/styleguide/page/Section.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Tag layout
The following wireframe shows the layout for tags as described in /themes/<theme-name>/styleguide/page/Tag.hbs. Elements in the legend correspond to objects in JSON data files.

Layout

Video layout
The following wireframe shows the layout for videos as described in /styleguide/core/video/VideoPage.hbs. Elements in the legend correspond to objects in JSON data files.

Layout


Component layouts

This section describes the layouts for low-level components contained in layouts for higher-level components.

Structural layouts
Structural components provide structure to your website. Examples of structural components include header, footer, and navigation.

The following wireframes represent several structural layouts. These templates for these layouts are available at the following locations:

  • /styleguide/core/page/PageHeaderTextHat.hbs
  • /styleguide/core/banner/Banner.hbs
  • /styleguide/core/navigation/Navigation.hbs
  • /styleguide/core/page/Page.hbs
Component layout

Module layouts
Brightspot provides several modules you can incorporate into content types. Examples of these modules include the following:

  • Promo
  • List
  • Quote
  • Carousel
  • Tabs
  • Rich Text
  • Container

The following wireframes represent layouts for several modules.

Component layout