Lifecycle Block
This block presents a visual representation of a lifecycle process. It's designed to highlight the key stages of a process, making it easy for the user to understand the flow.
Content Editor Fields
1. Header Section:
- Heading: This is the main title of your lifecycle. Use a concise and descriptive heading that clearly communicates the purpose of the lifecycle.
- Excerpt: Provide a brief overview of the lifecycle. This is a good place to set the context for the individual stages.
2. Lifecycle Items:
- Title: Each stage of the lifecycle should have a clear and concise title.
- Excerpt: Use this space to provide a more detailed explanation of each stage.
- Color: You can assign a unique color to each stage, visually separating them and enhancing readability.
3. Images:
- Small Image: This image will be displayed in a smaller size, typically beside the header section.
- Large Image: This image will be displayed prominently, usually below the lifecycle items.
Example Usage
Steps:
-
Add the block: Insert the Lifecycle Block into your page or post.
-
Set the content:
1. Header Section:
- Heading:: "Product Lifecycle"
- Excerpt: "Our recyclable products follow a cradle-to-cradle solution, a journey that lets the range be used, recycled and re-used again."
2. Lifecycle Items:
- Title:: "Cradle to Cradle"
- Excerpt:: "Creating a fully cyclical, everlasting resource from our packaging."
- Color: "Forest Green"
2. Create more Items as requested:
3. Images:
- Small Image:: Upload an image for showing on mobile
- Large Image: Upload an image for showing on desktop
-
Save the Block: Your Lifecyce block is now ready for display!
Result:
Preview with image:

Editor preview:
