Accordions can be useful tools when you are presenting small chunks of clearly defined, related content, where it is likely that your audience is only interested in a few of those chunks.

Accordions allow users to expand and collapse different sections, letting them see all their choices and display only the information relevant to them.

Refer to for more information on how to use accordions properly.


  • Teaser - the text to display
  • Content - the main content to open up


  • Accordions are advanced layout devices and should be used sparingly on our webpages. Please contact us to discuss using these on your site.


Please select your house to learn more:

  • Gryffindor

    Gryffindor values bravery, daring, nerve and chivalry. The house mascot is the lion, and its colors are scarlet and gold.

  • Hufflepuff

    Hufflepuff values hard work, dedication, patience, loyalty and fair play rather than a particular aptitude in its members. The house mascot is the badger, and canary yellow and black are its colours.

  • Ravenclaw

    Ravenclaw values intelligence, knowledge and wit. Its house mascot is the eagle, and its colors are blue and bronze.

  • Slytherin

    Slytherin house values ambition, cunning and resourcefulness. Its house mascot is the serpent, and its colors are emerald green and silver.