Banner Block

What is the Banner Block?

The Banner Block is a full-width visual block used to display short, high-impact messages at the top or within a section of a campaign page. It helps to draw attention to important information, urgent updates, or key campaign messages without taking up too much vertical space.

Unlike the Hero block, which is image-heavy and used for first impressions, the Banner block is more compact and text-focused — ideal for alerts, promotional callouts, or reinforcing campaign themes.

How to Add a Banner Block

  1. In the block editor, under Custom select Banner Block from the block inserter.
  2. Enter your message text.
  3. Choose the styling options:
    • Background colour
    • Text alignment (centered or left-aligned)
  4. Optionally, add a call-to-action link or button within the banner if an action is needed.

Customisation Options

  • Background Colour: Choose between different campaign brand colours to fit your visual identity or indicate priority
  • Text Weight: Use bold text for urgency or lighter text for subtle messaging.
  • Link Styling: Add a clear, accessible link or button if the banner is meant to direct users elsewhere.

Best Practices

  • Keep your message short and direct — no more than 1-2 lines of text.
  • Use accessible contrast: ensure text and background colours meet accessibility guidelines.
  • Avoid overusing banners on one page to preserve impact and avoid visual clutter.
  • Don’t use it for navigational purposes — it’s meant for messaging, not menus.

In this section