Hero - Two Column With Video
A two-column hero with text and a video.
View a live demo of this section.
Modules:
Usage Guide
This Hero - Two Column With Video section delivers a powerful visual impact by balancing compelling text content with dynamic video elements in a split-screen layout. The left column typically showcases your primary headline, supporting copy, and call-to-action buttons, while the right column displays an embedded video that can autoplay or play on user interaction.
In the HubSpot page editor, you can easily drag this section onto any page template within the Vertical theme. The section works exceptionally well on landing pages, product pages, and homepage designs where you need to immediately communicate your value proposition while demonstrating your product or service in action.
When customizing this section, you’ll find the Hero - 2 Columns module offers extensive flexibility through the theme’s design system. You can adjust the column proportions to give more visual weight to either the text or video content, depending on your messaging strategy. The video column supports both HubSpot Video uploads and embedded content from platforms like YouTube or Vimeo.
Best practices for this section include keeping your headline concise but compelling, as it needs to work harmoniously with the video content rather than competing for attention. Consider using videos that are 60 seconds or shorter to maintain engagement, and ensure your video has captions for accessibility.
The section’s responsive behavior automatically stacks the columns on mobile devices, with the text content appearing above the video by default. You can modify this order through the module’s advanced options if your video serves as a better mobile hook than your text content.
This section particularly shines for SaaS product demos, testimonial videos, or company introduction content where the combination of clear messaging and visual proof creates a compelling first impression.