Text-Layouts
100% Text
This is a 100% Text layout. This means it stretches all the way across the screen. In this text box you can:
- Change font and font sizes
- Align text left, centre and right
- Put text into bold
- Add a link
Hero Carousel Text Line One
Text Line Two
Text Line Three
Thu 25th 12°CFri 26th 11°CSat 27th 12°C
Title With Icon
Title with Lozenge
Text-Layouts
50% Text / 50% Image
This is a 50% Text/50% Image Text-layout. In this text box you can do all the same things as you can in the 100% text layout, but the text will only occupy 50% of the width of the page. You can add an image on the right side of this block. If you do not add an image, the text box will still remain at 50% width.
Text-Layouts
50% Image / 50% Text
This is a 50% Image/50% Image Text-layout. In this text box you can do all the same things as you can in the 100% text layout, but the text will only occupy 50% of the width of the page. You can add an image on the left side of this block. If you do not add an image, the text box will still remain at 50% width.
Text-Layouts
70% Text / 30% Image
This is a 70% Text/30% Image Text-layout. In this text box you can do all the same things as you can in the 100% text layout, but the text will only occupy 70% of the width of the page. You can add an image on the right side of this block. If you do not add an image, the text box will still remain at 70% width.
Text-Layouts
30% Image / 70% Text
This is a 30% Image/70% Text Text-layout. In this text box you can do all the same things as you can in the 100% text layout, but the text will only occupy 70% of the width of the page. You can add an image on the left side of this block. If you do not add an image, the text box will still remain at 70% width.
Announcement Block
This is an Announcement Block.
It is very similar to a Full Width Section (Image) apart from the fact that it’s constrained to margins of the page. You can add a button if you want to.
Spacer Layouts
Spacer Layouts help to divide blocks of information into more manageable chunks. Below are the three different types of spacer layout you can choose from
- Line-break – a plain line
- Icon Line-break – two lines with crossed oars in the centre
- Blank – You can’t see these! They are simply a little bit of white space between two blocks. you can choose from small, medium or large, depending how much of a gap you want to create.
See below for examples of each spacer layout:
Breaker Layout (Block) Quote Body
Quote Author Quote Role
Breaker Layout (Block) Text Editor area
Breaker Layout (Breaker) Quote Body
Quote Author Quote Role
Breaker Layout (CTA)
Text Editor area
Related Content (Any Page)
Social Layout
Social layouts allow you to pull in live social feeds directly from the HWR facebook, twitter and instagram. These sections are pre-formatted and all you need to do is enter the relevent handles.
Text Box
Downloads (Column)
This is a Downloads (Column) Layout.
Download blocks are pre-formatted sections that allow you to easily display multiple files for download. You can add as many ‘repeater’ rows as needed, simply by clicking the ‘add row’ button and selecting the relevant file from your computer or media library.
Gallery Layout
This is a Gallery Layout.
You can add photos from the media library. You can add a title and some body text if you like (that’s what this is).
Full Width Section (Image)
This is a Full Width Section (Image). You can add a title, body text and a button if you want to. If you don’t add any of these, this block is simply a full width image.
Button TextFull Width Section (Parallax)
This is a Full Width Section (Parallax). You can add a body text and a button if you want to. If you don’t add any of these, this block will simply appear as a full width image with a moving letterbox frame.
Button TextFull Width Section (Video)
This is a Full Width Section (Video). You can add a body text if you want to (that’s what this is).
Accordion
Accordian Row One Title
Accordion Row One
This is an accordion. An accordion lets you display text content in a way that allows the user to to expand and compress ‘drawers’, enabling them to reveal as much or as little information as they want. You can add as many rows as you want to an accordion and can delete rows as and when you want.
Accordion Row Two
Accordion Row Two
This is an accordion. An accordion lets you display text content in a way that allows the user to to expand and compress ‘drawers’, enabling them to reveal as much or as little information as they want. You can add as many rows as you want to an accordion and can delete rows as and when you want.
Accordion Row Three
Accordion Row Two
This is an accordion. An accordion lets you display text content in a way that allows the user to to expand and compress ‘drawers’, enabling them to reveal as much or as little information as they want. You can add as many rows as you want to an accordion and can delete rows as and when you want.
