Style guide

Page that documents how the Hantsweb templates work

Overview

Style guide pages are used to describe how components of the Hantsweb template work.

They normally include an example, a code sample and some guidance for authors to create their own instances of the component.

Example

WCMS use

From the style guide in the content tree, right click and choose Insert > Hantsweb_StyleGuidePage.

Not all places allow creation of style guide pages.

Give the page a name, following our standards for page names.

Update the Page title, summary, metadata and other standard fields as described under general page authoring.

The style guide page has five main sections:

  • Overview
  • This provides an introduction to the page or component, explaining it's purpose.
  • Example
    This rich text field and placeholder can be used to put a working example of a component directly in the page. This lets authors see a real example in a typical context.
  • WCMS use
    This field is where you put the instructions for content authors to allow them to create components themselves
  • MVC.NET use
    This field and placeholder can be used to provide guidance for developers who need to implement the same kind of component in their own applications
  • Code
    This field and placeholder are used to provide HTML, CSS and JavaScript examples of the front-end code that makes up the component.
  • Version and status
    Versioning information about the style guide
MVC.net use
Code
Version and status
  • current version
  • Concept