Available blocks (old)

Cover/hero image

EHU Cover block

Add an EHU Cover block to the top of your page if you want a large banner image. Reserve for landing pages/top-level category pages.

You can also change the width of the EHU Cover block – None (1200px), Wide width (100%) and Full width. Wide width or None are generally preferred.

You should manually add the title of your page to the EHU Cover block and check the “Hide Page Title” checkbox at the bottom of the Page sidebar. You can also supply text to appear before (“Pre Title”) and after the title (“Subtitle”). Reserve pre-text for a label (eg “Department”) and the text after for a very short summary or qualifying text. Site-specific CTAs can appear here as well, eg “Book an open day”.

Examples

Width: None

• Image size: 1280 x430px

Width: Wide width

• Image size: 1400 x 430px

Width: Full width

• Image size: 100% x 430px

---

Intro text

Paragraph block (Intro Text block style)

Most pages will benefit from intro text, where the first paragraph is slighter larger than standard body text and helps explain the purpose of the page.

Example

Aenean cursus tellus eu condimentum eleifend. Integer lacinia quam at imperdiet fringilla. Morbi ut blandit lectus. Duis sit amet diam eget dui facilisis tincidunt scelerisque pulvinar sem.

---

Paragraph

Paragraph block (Default block style)

When you type or copy text into the editor, it will be created using the standard Paragraph block. Be careful when copying and pasting text from other sources. Paste by using ctrl + shift + v to insert the text without formatting and/or paste it into a program like Notepad first to remove any styling.

Example

Aenean cursus tellus eu condimentum eleifend. Integer lacinia quam at imperdiet fringilla. Morbi ut blandit lectus. Duis sit amet diam eget dui facilisis tincidunt scelerisque pulvinar sem. Mauris mattis, nisi nec placerat vulputate, eros odio pulvinar augue, laoreet pretium leo eros sit amet lacus. In tempus odio urna, sit amet accumsan risus placerat id. Fusce congue justo vel commodo hendrerit. Nullam consequat augue ut molestie ultrices. Praesent orci velit, pulvinar id pellentesque in, aliquam sed metus.

---

Headings

Heading block

The in-page navigation menu appears on most pages and indexes all Heading 2s that appear on the page. Be sure to use properly organised and nested heading styles to make sure that this works correctly.

Heading 3 example

Aenean cursus tellus eu condimentum eleifend. Integer lacinia quam at imperdiet fringilla. Morbi ut blandit lectus. Duis sit amet diam eget dui facilisis tincidunt scelerisque pulvinar sem. Mauris mattis, nisi nec placerat vulputate, eros odio pulvinar augue, laoreet pretium leo eros sit amet lacus. In tempus odio urna, sit amet accumsan risus placerat id. Fusce congue justo vel commodo hendrerit. Nullam consequat augue ut molestie ultrices. Praesent orci velit, pulvinar id pellentesque in, aliquam sed metus.

Heading 4 example

Aenean cursus tellus eu condimentum eleifend. Integer lacinia quam at imperdiet fringilla. Morbi ut blandit lectus. Duis sit amet diam eget dui facilisis tincidunt scelerisque pulvinar sem. Mauris mattis, nisi nec placerat vulputate, eros odio pulvinar augue, laoreet pretium leo eros sit amet lacus. In tempus odio urna, sit amet accumsan risus placerat id. Fusce congue justo vel commodo hendrerit. Nullam consequat augue ut molestie ultrices. Praesent orci velit, pulvinar id pellentesque in, aliquam sed metus.

---

Group of blocks

The Group block is a block that groups other blocks together inside one container. Think of it as a “parent” block that can hold multiple “child” blocks within it.

One popular use is to group together several blocks and apply a background colour to distinguish it visually. Use in conjunction with the Column block to arrange an image next to a Heading, paragraph and EHU Button, as below.

You can also change the width of a Group of blocks – None (1200px), Wide width (100%) and Full width.

Examples

Width: None

Width: Wide width

Width: Full width

---

Card

EHU Card block INSIDE Column block

The EHU Card block should typically appear in a Column block layout, rather than as a full-width element, so these blocks are nested inside the Column block.

Cards are typically used to link to sub/child pages, but don’t have to link to anything,

You can also change the width of the Column block – None (1200px), Wide width and Full width.

Examples

Width: None

Width: Wide width

Width: Full width

---

Call to Action (CTA) button

EHU CTA block

If you have a single call-to-action that you want to highlight, you can use the EHU CTA block.

Example

Title of CTA

Subtext to accompany CTA

EHU Buttons block

If you want to include a group of related calls-to-action without subtext, you can use the EHU Buttons block.

Example

Button 1 Button 2 Button 3

---

Expanding boxes

EHU Expanding Box block

You can add a title and any blocks to the content nested inside the EHU Expanding Box block. It might be easier to use the List view button to keep track of which blocks are inside – you can drag and drop to move them round and change the order. You can change the width of the block and put it inside a group to add a background colour as well.

Examples

Issues with this block:

• No facility to change title heading level.
• Content after EHU Expanding Box block wraps (would require Spacer block added manually to display correctly)

---

Numbered steps or USPs/key stats panel

EHU Number Block INSIDE Column block

Issues with this block:

• No link target option (not essential but would be good to know if we’re going to get it)
• No facility for icons (can use FontAwesome Link block instead)
• Can’t change title heading level

---

Icon buttons or panel

EHU Icon Panel block (to be renamed)

Use this block if you want to include Font Awesome icons and text in a card or panel layout. You can optionally include subtext and a link for each icon. You don’t need to combine this block with columns to arrange several on a single row. You can (currently) change the size of the icon in the Block tab of the Settings sidebar on the right-hand side, by typing fa-1x up to fa-10x. The panel slider lets you change the layout from a small button to a larger panel too:

Is panel = no

Is panel = yes

---

Promo panel

EHU Promo Panel

Use this block to promote a single item or activity as a highly visible, full-width panel. You can adjust the ratio of image to content and align the image on the left or right side as needed in the Block tab of the Settings sidebar on the right-hand side.

Issues with this block:

• No facility to change width
• CTA button is mandatory ATM
• Video doesn’t work

---

Image gallery

Gallery block

---

Timeline

EHU: Timeline block

---

Announcement

EHU Announcement

---

Tabs

Tab Content block WITH Tab Headings block

Use this block for in-page tabbed content. Make a note of the page if you use this block and want vertical tabs rather than horizontal – this will be need to be addressed with a block style at a later date.

• Item 1
• Item 2
• Item 3

Issues with this block:

• Content only appears on-page when you click the headings. TOGGLE ADDED TO OPEN AS DEFAULT

---

Table

Table block

There are two block styles – the Stripes style (pictured below) is more aesthetically pleasing, but both may be replaced with standard styles at a later date.

Heading label	Heading label
Data	Data
Data	Data
Footer label	Footer label

---

List with column styles

• Curabitur cursus nunc sed venenatis feugiat.
• Sed in ipsum sollicitudin, suscipit elit nec, molestie risus.
• Nunc quis risus nec tellus molestie volutpat in non lacus.
• Maecenas rhoncus sapien vitae turpis blandit fringilla.
• Morbi egestas est nec massa eleifend commodo.
• Aenean at dolor id mi facilisis ultrices sit amet ac urna.
• Lorem ipsum dolor sit amet, consectetur adipiscing elit.
• Nulla dapibus metus ac lorem vestibulum venenatis.
• Sed a turpis vel velit scelerisque feugiat at eu ex.
• In imperdiet metus id vestibulum vulputate.
• Praesent quis arcu non lacus tincidunt bibendum.
• Pellentesque pharetra nulla a justo molestie ultrices.
• Nulla ultrices velit id vestibulum aliquet.

---

Profile quote block

EHU Quote block

Select and present a specific Quote (associated with a Profile) that has been uploaded to the website.

Issues with this block

• Currently pulls in news posts rather than quotes – outputs post ID.

---

Courses list block

EHU Courses List block

Use this block to present a list of courses for a department or subject area. You can also manually select individual courses to include in a “You may also be interested in” list.

Issues with this block:

• Padding above list.
• Page can’t be updated if block is used.

---

Profiles list/grid block

EHU Profiles List block

---

Media & Text

Media & Text block

Issues with this block:

• Default width (“Wide width”) will be too large in most if not all instances. Should be “None”.
• Default text size is too large – should be standard paragraph text size (currently fixed by changing block from Paragraph to Heading and back to Paragraph).

---

News list/grid block

EHU News List block

---

Staff/student profiles list/grid block

EHU Profiles List block

---