Promo Cards Block

This block displays a series of visually appealing promo cards, each with a title, description, image, and optional link. It's designed to showcase promotions, services, or key information in an engaging and interactive way.


Content Editor Fields

1. Promo Cards (Repeater Field):

  • Title: Each promo card has a title. Use concise and attention-grabbing titles to pique interest.
  • Description: Provide a brief description or summary of the promotion or service.
  • Image: Choose a visually appealing image that represents the promotion or service.
  • Brand Colour: Select a brand color to apply to the promo card, ensuring brand consistency.
  • Link: You can optionally link each promo card to a specific page or URL.

2. Mobile Promo Card:

This is for the last card with CTA. It is withdrawed from the slider on mobile and is showed seperatly on mobile.

  • Title: The mobile promo card has its own title.
  • Description: Provide a brief description for the mobile promo card.
  • Image: Choose an image for the mobile promo card.
  • Link: You can optionally link the mobile promo card to a specific page or URL.

Example Usage

Steps:

  1. Add the block: Insert the Promo Cards Block into your page or post.
  2. Set the content:

1. Promo Cards (Repeater Field):

  • Title: "Pet Food"
  • Description: "Working with some of the biggest names in the industry, our always-evolving line of pet food packaging makes it one of our biggest markets."
  • Image: Upload an image
  • Brand Colour: "Navy"
  • Link:
    • Link text: "Pet food"
    • Anchor ID / Landing page: "/pet-food"

2. Add more rows as request

3. Mobile Promo Card:

  • Title: "Reduce your impact"
  • Description: "PIt’s our ultimate goal to achieve net-zero contamination. It’s ambitious, but we’re driving the way - and we want you to help us get there."
  • Image: Choose an image for the mobile promo card.
  • Link:
    • Link text: ""
    • Anchor ID / Landing page: "/talk-to-us"
  1. Save the Block: Your Promo Cards block is now ready for display!

Result:

Preview with image:

Promo Cards with image

Editor preview:

Promo Cards acf