Environmental Block

This block presents a dynamic section with an image, icon, title, and description that users can switch between using a tabbed menu.


Content Editor Fields

  1. Repeater: This is where you'll input the content for each tab in the menu. Each item in the repeater will have the following fields:

    • Title: The name of the tab, displayed in the menu.
    • Icon: An icon representing the tab's content.
    • Description: A detailed explanation or information related to the tab's topic.
    • Image: A visual accompanying the description.
  2. Footnote: An optional field for adding a footnote or disclaimer to the entire block.


How it Works

  • The block uses a tabbed menu interface. On desktop, the tabs are displayed vertically, while on mobile, a dropdown menu is used for selection.
  • Clicking on a tab dynamically updates the icon, title, description, and image to reflect the selected category.
  • The content is pulled from the repeater fields

Example Usage:

Steps:

  1. Add the block: Insert the Enviromental Block into your page or post.

  2. Set the content:

    • Title: "Water Use"
    • Icon: Upload an icon representing the tab's content.
    • Description: "A way of measuring water scarcity that factors in the demands of humans, aquatic ecosystems and manufacturing processes in a given region."
    • Image: Upload a conresponding image
  3. Add more rows as request

  4. Save the Block: Your Environmental block is now ready for display!


Result:

Preview with image:

environmental with image

Editor preview:

environmental acf


Conclusion:

This block is ideal for showcasing different aspects of a company's environmental initiatives.Each tab would then display relevant information, an icon, and an image, providing a comprehensive overview of the company's commitment to environmental responsibility.