Video Section vs. Video Banner in Maison

Maison provides two different sections for displaying video:

Although both support uploaded and external videos, they are designed for different layouts and use cases.

Quick comparison

Feature Video section Video banner
Main purpose Display standalone video content Create a large hero-style video banner
Video position Regular content block inside the section Video fills the banner background
Default structure Heading + Video Video + Content container
Content container No dedicated Content container Yes, overlaid on the Video
Aspect ratio Yes No
Video fit Cover or Contain Background cover behavior
Corner radius Yes No
Cover image Available for External URL Available for External URL
Autoplay / Mute / Loop Yes Yes
Video controls / Play button Yes Yes
Overlay content Supporting blocks around the Video Content displayed over the Video
Desktop/mobile Size Mainly controlled by Video block and section width Controlled by section Size
Separate mobile video No No
Transparent header Not designed as a hero banner Supported when first section
Best use Tutorials, product videos, editorial content Homepage hero, campaigns, storytelling

Video section

Use the Video section when the video should behave like normal page content.

The default structure is:

Video
├── Heading
└── Video

You can also add supporting blocks such as:

  • Subheading
  • Rich text
  • Text
  • Button
  • Image
  • Divider
  • Spacer

The Video block supports:

  • Uploaded or External URL video
  • Autoplay
  • Mute video
  • Loop video
  • Video controls
  • Play button
  • Aspect ratio
  • Video fit
  • Corner radius
  • Overlay
  • Size and Spacing

This section is best when the video itself is the main content customers should watch or interact with.

Video banner

Use the Video banner when the video should act as a large visual background with text or buttons layered over it.

The structure is:

Video banner
└── Video
    └── Content container
        ├── Heading
        ├── Description
        └── Button

The Video fills the banner area using cover-style behavior.

Instead of Aspect ratio, the banner uses section Size to control its desktop and mobile height.

The Video block also supports:

  • Uploaded or External URL video
  • Autoplay
  • Mute video
  • Loop video
  • Video controls
  • Play button
  • Cover image
  • Custom colors
  • Overlay color and opacity
  • Content positioning

The Content container is displayed over the Video and can contain headings, text, buttons, and other supported content.

Main difference

The easiest way to think about the two sections is:

Video section
= Video as content

Video banner
= Video as background
  + content over the Video

Use Video section when customers should focus on watching the video.

Use Video banner when the video supports a marketing message, heading, or call to action.

Which one should you use?

Use Video section when you want to:

  • Show a product demonstration.
  • Add a tutorial or informational video.
  • Control the Video Aspect ratio.
  • Use Cover or Contain.
  • Add rounded Video corners.
  • Place Heading or text above or below the Video.
  • Treat the Video as part of the normal page content.

Use Video banner when you want to:

  • Create a large hero banner.
  • Display text directly over the Video.
  • Add a CTA over the Video.
  • Use a full-width visual section.
  • Control separate desktop and mobile banner heights.
  • Add an Overlay for text contrast.
  • Use a transparent Header over the Video banner.

Need Further Assistance

If you encounter any issues or need additional help with your Maison theme, please reach out to our support team via our Ticket System for assistance within 8 hours.