Hero - Showcase [+ only]
Hero to showcase a product image.
Note: This section is only available in Framework+, a paid version of Framework.
View a live demo of this section.
Modules
How to Use This Section
The Hero - Showcase section creates a compelling above-the-fold layout specifically designed to highlight your product with a large, prominent image alongside descriptive content. This section works exceptionally well for SaaS landing pages, product announcements, and feature spotlights where visual impact is crucial for conversions.
When you add this section through the page editor’s drag-and-drop interface, you’ll find it provides a balanced two-column layout that automatically adapts to different screen sizes. The Theme Rich Text module handles your headline, description, and call-to-action buttons, while the Theme Image module showcases your product screenshot, mockup, or hero graphic.
Choose this section when you need to immediately communicate your product’s value proposition with both visual and textual elements. It’s particularly effective for homepage heroes, product page headers, or dedicated landing pages where you want visitors to quickly understand what you’re offering.
In the page editor, you can customize the rich text content to include multiple heading levels, bullet points, and styled buttons that match your brand. The image module supports high-resolution uploads and includes built-in optimization for fast loading times. You can also control the section’s background color and spacing through the section settings panel.
Pro tip: For maximum impact, use high-quality product screenshots or professional mockups in the image module. Keep your headline concise but benefit-focused, and include a single, clear call-to-action button. This section performs best when the image and text work together to tell a cohesive story about your product’s key benefits.
The section inherits styling from your theme’s global settings, ensuring consistent typography and colors across your site.