Style guide

Page that documents how the Hantsweb templates work


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.


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 use
Version and status
  • current version
  • Concept