Content section

Layout component

The Content section is a core component that can be used as a section level wrapper. It includes a heading and optional children.

---

Table of contents

• 1. Heading
• 2. Copy
• 3. CTA
• 4. Children
• 5. Layout

Dependencies (2)

• Layout
• CTA

Used by (4)

• CTA section
• Card section
• Card section carousel
• Link list section

Back links (2)

Card section carousel (1)

• Card section carousel combines the Content section,

Content block (1)

• Content section. Many of the options available at this level are...

Resources

• r1: Box folder

---

Should consider replacing heading, copy, and CTA with a Content item. Issue right now is hierarchy H2 vs H4?

1. Heading

optional string

An optional short String of text to be displayed as an H2 level heading, and indicates a change in section.

Is this an H2 even when it has a child of Content block that is also an H2, or is it more of an either or situation?

Back to top

2. Copy

optional string

An optional short String of text that describes the section in a little more detail.

Back to top

3. CTA

optional component

An optional section level CTA that allows a user to navigate to related content.

Properties and values

	props	values
4.1	type	All except for jump
4.2	style	text

See CTA for more information.

Back to top

4. Children

optional container

An optional container area that child components, and other content types can be passed into.

When nesting children use with the Layout utility's 8-4 and nested option set to true for proper alignment to the Carbon 2x grid.

Example

Back to top

5. Layout

built-in component

The Content Section uses the Layout core component to position itself and body content in the expected column layout. Refer to Layout functional specs for details

Properties and values

	props	values
5.1	type	4-12
5.2	nested	false

See Video for more information.

Back to top