--- title: "Adding a Content block on a page" canonical: "https://nsw-gov-au-help-hub.refined.site/space/HHK/601784880/Adding%20a%20Content%20block%20on%20a%20page" format: markdown --- Content blocks are used to display groups of related content and/or links. They are for use on landing pages only. > ℹ️ ## Avoid mixing block styles > ℹ️ > ℹ️ Don't mix different block types, for example, icon followed by image, followed by icon, in a single section as this may confuse the audience.  > ℹ️ > ℹ️ Aim for a consistent audience experience with suitable images or icons and description length. --- ## When to use image, icon or text blocks ### Do - Should only be used on full-width pages (like landing pages, not standard pages) - Supports 2, 3, or 4 column layout - Limit of 6 blocks per section - Use when the content requires multiple links - Can be used to display a single link, but cards are the preferred option for displaying a single link - Select icons and images that help inform the content and provide additional context - Ensure headings and links complement each other to meet the audience need ### Don't - Don’t use icons or images for decorative purposes only - Don't mix different block types in a single section as this may confuse the audience - Don't use for very long descriptions - Don't overload the block with too much information. This may overwhelm the audience and result in them abandoning the content --- ## How to add image, icon or text blocks You can add a Content Block on a landing page by selecting **Content block** from the list of [content blocks](https://nsw-gov-au-help-hub.refined.site/space/HHK/603750486/Available+components+for+Landing+pages). If you need to create more than one content block select **Content blocks - multiple**. 1. Select the **Type** of block you require: Image, Icon or Text. 2. All block types include: - **Heading:** maximum 50 characters. - **Text and links** field (WYSIWYG): maximum 200 characters. - **Link** field: add a content or managed link to another page. - By design, the link text displays as **Read more** 3. Additional fields are available when you select: - Image block: add **media button** is available to select an image from the media library. **Hide image credit** checkbox also appears underneath so the image credit does not appear on the page. - Icon block: icon field is available to **select a pictogram** to add your block. --- ## Content block guidelines Refer to the guidelines for each block type for further information about using this component. **Image guiidelines** Use image blocks, rather than icon blocks, when an image better describes the content or when a suitable icon can’t be sourced. **At least one of the optional parts below should be included in this component.** | Part | Required | Guidelines | | --- | --- | --- | | **Image** | Mandatory | - Image should provide additional context. - Image should support and re-enforce the content. Don’t use an image for decorative purposes only. - If a suitable image can’t be sourced, consider using an icon block or text block. | | **Heading** | Mandatory | - Heading has a limit of 50 characters. | | **Description** | Optional | - Should be a short descriptive sentence to provide some context. - Limit of 200 characters. - Try to keep the length of each description similar if using multiple blocks in a row. | | **Link list** | Optional | - Limit of 5 links. - Links are optional as this component can also be used to display a single link or simply display content. | | **Link** | Optional | - Should link to the page that the 'Heading' describes. - You can add a content page link or managed link. - By design, the link text displays as **Read more.** - For single image blocks, the link should be an outlined (secondary) button. Consider using the [Feature ](https://nswdigitalchannels.zendesk.com/hc/en-au/articles/6752693284367-I-want-to-add-a-Feature-block-on-a-page#h_01HPN3KGF5MRMT4B2CM4NNXZ2M)block for a single block with image and link. - Link is optional as this component can also be used to simply display content. | **Icon guidelines** The icon block variant allows you to select a pictogram from a drop down menu to help the audience easily scan and identify information. **At least one of the optional parts should be included in this component.** | Part | Required | Guidelines | | --- | --- | --- | | **Icon** | Mandatory | - Icon should relate to the content. They are selected from a drop down pictogram list. If a suitable icon is not available, consider using an image block or a text block. | | **Heading** | Mandatory | - Heading has a limit of 50 characters. | | **Description** | Optional | - Should be a short descriptive sentence to provide some context. - Limit of 200 characters. - Try to keep the length of each description similar if using multiple blocks in a row. | | **Link list** | Optional | - Limit of 5 links. - Link list is optional as this component can also be used to display a single link or simply display content. | | **Link** | Optional | - Should link to the page that the heading describes. - You can add a content page link or managed link. - By design, the link text displays as **Read more**. - Link is optional as this component can also be used to simply display content. | **Text guidelines** Use text blocks when no suitable icons or images will provide additional context for the audience. **At least one of the optional parts below should be included in this component.** | Part | Required | Guidelines | | --- | --- | --- | | **Heading** | Mandatory | - Heading has a limit of 50 characters. | | **Description** | Optional | - Should be a short descriptive sentence to provide some context. - Limit of 200 characters. - Try to keep the length of each description similar if using multiple  blocks in a row. | | **Link list** | Optional | - Limit of 5 links. - Links are optional as this component can also be used to simply display content. | | **Link** | Optional | - Should link to the page that the 'Heading' describes. - You can add a content page link or managed link. - By design, the link text displays as **Read more**. - Link is optional as this component can also be used to simply display content. | > ℹ️ ### See this live on [http://nsw.gov.au](http://nsw.gov.au) > ℹ️ > ℹ️ Visit [Content block](https://www.nsw.gov.au/nsw-government/content-guidance/cms-components-guide/design-features/content-block) to see how this works on a live page. > ℹ️ > ℹ️ You can also see live examples of how agencies have applied the component to their content below:  > ℹ️ > ℹ️ - [Department of Planning, Housing and Infrastructure](https://www.nsw.gov.au/departments-and-agencies/department-of-planning-housing-and-infrastructure) > ℹ️ - [Department of Regional NSW](https://www.nsw.gov.au/departments-and-agencies/department-of-regional-nsw) > ℹ️ - [NSW Registry of Births, Deaths & Marriages](https://www.nsw.gov.au/departments-and-agencies/births-deaths-marriages) > ℹ️ - [Living in NSW](https://www.nsw.gov.au/living-in-nsw) > ℹ️ - [Working and business](https://www.nsw.gov.au/working-and-business)