Content Block

Overview

Displays supertitle, title, copy, and image. Commonly used to list steps in a campaign.

Example Content Block

Content Type Fields

  • Internal Title: This is for our internal Contentful organization and will be how the block shows up in search results, etc.

  • Supertitle (optional): The supertitle for the content block which appears in smaller font-size above the title.

  • Title (optional): The title for the content block which appears in larger font-size above the content.

  • Content: The content for the content block in Markdown format, displayed below the title.

  • Image (optional): An accompanying image displayed alongside the content.

  • Image Alignment (optional): Controls whether to render the image to the right or left of the content (defaults to right).

  • Additional Content (optional): A JSON field, with properties:

Content Width Span

By default, the content provided will span two-thirds of the row to accommodate the image in the other third. This works well for e.g. Campaign Pages where we assign extra row space for Content Blocks so that the image can simply appear within the extra space:

Content Block on Campaign Page

But for e.g. General Pages where the content width is truncated to accommodate the image within the natural bounds of the row, we need to ensure that when there is no image provided, the content flows across the full row:

Content Block on General Page

The fullWidth prop toggles this behavior.

If a footerType is set in Additional Content, the content will span across the full row if:

  • The footerType is set to GetOutTheVoteBlock

  • Or if footerType is set to CivicEngineVoterWidget, and not rendered on a campaign page (URL does not contain /us/campaigns/)

Last updated