When to use the Split component

Use the Split component to add text to your page opposite a:

• tagline
• image
• media embed

You can use the Split component on a:

• Campaign
• Landing page

Finding the Split component

You can add up to four Split sections to a page.

To find the component on a Campaign or Landing page template:

1. Open the drop-down menu under 'Drag and drop components'.
2. Select 'Split'.
3. Click 'Add component'.

The Split will appear beneath 'Component(s) currently in use'.

Adding content to the Split component

Title

Use the Title field to write a heading that clearly and succinctly explains the content that follows.

Typecase formats the Title field as h1 so, if you add a subheading to the Text block field (using Markdown), it must be h2.

Section appearance

Select one of the radio buttons next to:

• dark text on a light background
• light text on a dark background

If you add more than one Split section to a page, choose contrasting appearances for each Split to make the page easier and more interesting to read.

Text block

You must add text to the Text block field in each Split section.

You can type directly into the Text block field or copy and paste from somewhere else, like a Word document.

Use markdown to format your text if necessary, for example, to add subheadings, bullet points, or links.

Don't put all your text into one Split section. It's clearer and easier to read if you separate your content into different sections with appropriate headings.

Associated tagline, image, or other media

You must add either an image, tagline, or other media embed to each Split component. These appear opposite the content you add to the Text block field.

Choose a side

Choose a side for your image, tagline, or other media by selecting either the 'Left' or 'Right' radio button.

You should select 'Right' for the uppermost Split section on the page so your Text block content appears on the left. This makes it easier for people to scan the page and read the information that's there.

If you use more than one Split section in a row, alternate the side the Text block content is on to make the page look more varied and compelling.

Add a tagline

A tagline is a short sentence promoting a benefit or highlighting key information. You can choose to add a tagline to appear opposite the content in the Text block field.

To add a tagline, select the correct radio button under 'Choose what to add', then add your text to the 'Tagline' field.

If you add a tagline, you might also need to add a footnote to give a reference or explain the tagline statement. The footnote appears in smaller text at the bottom of the content in the Text block field.

To add a footnote, add an asterisk (*), followed by the text, to the Footnote field. Add another asterisk at the end of your tagline text.

You can add up to 255 characters to the Tagline and Footnote fields. Typecase includes spaces and line breaks when counting characters in these fields.

You can't use Markdown to format the tagline or footnote text.

Add an image

You can choose to add an image to appear opposite the Text block content.

Use an image that's 500 x 500 pixels (1:1 ratio) or larger.

Under 'Choose what to add', select 'Image', then add the:

• image web address (URL)
• alternative image text (alt text) to describe the image to people who can't see it

Add a media embed

You can choose to add a video or audio embed to appear opposite the content in the Text block field.

You must only embed accessible video or audio content. Make sure you add captions to videos and provide transcripts of audio files so that everyone has access to the same content.

Select the 'Other media' radio button under 'Choose what to add', then paste the embed code of your video or audio file in the 'Embed code' field.

Find out about embedding:

• video from Vimeo
• audio from SoundCloud

Moving your content around the page

You can use up to four Split sections on Campaigns and Landing pages.

You can drag and drop each Split section to move them to a different position on the page. Don't put a Split section directly after a Hero image because it makes the page look busy and difficult to read.

Click 'Collapse this section' to minimise a Split component while you work on other areas of the page. The content will still appear on the preview and published pages if you collapse part of the template.