The Modern Video Showcase Module allows you to highlight your story, product, or service through stunning video integration combined with engaging content. Designed with flexibility and brand consistency in mind, it offers multiple layout options, customizable typography, and CTA buttons to drive user action. The module ensures smooth video playback with content, responsive design, and advanced controls for performance optimization. Perfect for landing pages, product launches, or storytelling sections, it blends video with impactful messaging to capture audience attention across all devices.
Key Features of a Modern Video Showcase Module :
Multiple Layouts: Side-by-side (text + video), full-width video, or stacked layout.
Background Settings: Gradient, solid color, or image background.
Content Alignment: Left, right, center positioning for text.
Spacing Controls: Padding & margin options for responsive adjustments.
Card Style: Option to wrap video in a styled card with rounded corners, shadows, or borders.
Video Sources: Support YouTube, Vimeo, or HubSpot video.
Play Button Style: Customizable icon, color, and size.
How to Set Up the Use Modern Video Showcase in HubSpot :
In the main dashboard, go to the ‘Content’ tab and select either ‘Website’ or ‘Landing Pages,’ depending on where you want to add the section. This lets you choose the right location for managing or updating your content.
Search for "Modern Video Showcase" and drag and drop the module into the desired location on your page.
Layout ID :
Easily enhance navigation by adding an ID to the target section and using the same ID in an anchor link. This enables a smooth scrolling effect when users click a Call-to-Action (CTA) button, improving the overall user experience.
Layout Options :
Effortlessly showcase your story and connect with your audience through the Modern Video Showcase Module — perfect for product launches, campaign highlights, or brand storytelling. Built with flexible layouts and customizable styling, this module combines powerful video integration with engaging content and conversion-focused CTAs. With responsive design and smooth performance, it ensures your message is delivered beautifully across all devices.
Layout 1 – Feature Highlight Video
A design that places your video side-by-side with strong headlines, descriptive text, and conversion-ready CTAs — ideal for introducing services, features, or campaigns.
Layout 2 – Storytelling & Experience Video
A layout that emphasizes immersive visuals, customer journeys, or behind-the-scenes content, paired with supportive messaging that builds authentic brand connections.
Layout 3 – Full-Width Showcase Video
A bold layout designed to spotlight product mockups, campaign highlights, or cinematic storytelling with full-width video and sleek modern presentation.
Video Column :
Video Type
Choose between HubSpot Video or iFrame embed. Perfect for flexibility when using hosted content or external platforms like YouTube and Vimeo.
Content Column :
Heading Enable
Toggle the main heading on or off. Great for when you want a video-focused section without extra text.
Enter Heading
Add and customize the main heading text. Ideal for delivering a strong, eye-catching message.
Description Enable
Show or hide the supporting description under your heading. Keeps the layout flexible for minimal or detailed storytelling.
Enter Description
Add descriptive text below the heading. Perfect for explaining your offering in 1–2 concise lines.
CTA Show/Hide
Enable or disable the call-to-action button. Useful if the section should be informational only.
CTA Choice
Select from different CTA types (e.g., Simple CTA, HubSpot CTA). Tailor the call-to-action style to your campaign.
CTA Text
Customize the button label. Use action-driven words like “Download Free Guidebook” or “Learn More.”
Link Options
Choose where your CTA directs: internal pages, external links, or files. Optionally open in a new tab and set nofollow for SEO control.
CTA Icon
Add or replace an icon inside your button. Great for emphasizing direction or action (e.g., arrow, play, download).
Module Setting :
Adjust the margin, padding, container width and background colors to achieve your desired look and feel for the module. This flexibility lets you fine-tune the layout and aesthetics, ensuring your design is both visually appealing and user-friendly.
Heading & Description Setting :
The Heading & Description Settings in Modern Video Showcase allow you to fully customize the look and feel of your text by adjusting desktop and mobile typography (font family, size, weight, line height, and color), managing spacing (margins and padding for precise layout control), and applying text transform options such as uppercase, lowercase, or capitalize, ensuring your headings and descriptions remain visually consistent, responsive, and aligned with your brand style across all devices.
CTA Setting :
Desktop Typography
Customize font style, size, weight, and color for the CTA on desktop. Ensures your button text is bold, readable, and aligned with your brand style.
Mobile Typography
Individually set typography for mobile devices. Keeps the CTA optimized and user-friendly across all screen sizes.
Spacing
Adjust padding and margin around the CTA button. Helps maintain balanced layout and proper visual hierarchy.
Background
Choose and style the background color or gradient of the CTA. Makes the button stand out and match your brand’s look.
Border
Add or customize borders for the CTA button. Ideal for minimal designs or creating outlined button styles.
Border Radius
Control the corner roundness of the CTA. Switch between sharp edges, soft curves, or pill-shaped buttons.
Text Transform
Format your CTA text as uppercase, lowercase, or capitalized. Great for enforcing consistent design language.
Box Shadow Enable
Add or remove shadows around the CTA. Enhances depth and draws more attention to the button.
Alignment
Position the CTA left, center, or right within the section. Provides flexibility depending on layout style.
Video Column Setting :
Video Height
Adjust the video height to fit your layout. Great for balancing video size with surrounding content.
Corner Radius
Round the video corners for a softer, modern look — or keep them sharp for a bold, professional style.
Border Settings
Add or customize a border around the video. Perfect for highlighting the video area or matching brand design.
Spacing Controls
Set padding and margins around the video. Helps maintain clean, responsive layouts across devices.
We hope you enjoy using our modern video showcase to create a seamless experience for both your users and your marketing team. At Code Accelerator, we're committed to ensuring your HubSpot experience is exceptional. If you need a custom HubSpot module or require a tailored HubSpot CMS or CRM setup, please don’t hesitate to Contact Us.