How to Set Up the Reveal Video with Text Overlay Section in Concept

Add and arrange overlay content blocks

• Under the section, click Add block.
• Choose from the available blocks:
  • Subheading — add a short introductory line.
  • Heading — add a headline, adjust its size, and choose highlighting options.
  • Text — add a description and customize its typography.
  • Button — add a call-to-action button with a link, size, and style.
  • Link — add a simple text link.
  • Icon — use a built-in icon or upload a custom icon image.
  • Image — add an image within the overlay content.
  • Custom Liquid — insert custom Liquid content.
  • Spacing — control vertical spacing between blocks on desktop and mobile.
  • App — insert a supported app block.
• Drag the blocks to change their display order.
• Click Save.

The video reveal works without content blocks, but overlay text and other content appear only when blocks are added.

Customize highlighted text

• Open a Heading or Text block.
• Add your content and choose a Highlighted text style.
• If using the Scribble style, configure Highlighted scribble.
• In a Heading block, you can enable Highlighted reveal for an additional heading animation.
• Click Save.

Configure colors and overlay

• Open the section's Colors settings.
• Adjust Text, Background, and Background gradient as needed.
• Customize Highlight colors and gradients for highlighted text.
• Set the Button text and background colors.
• Choose an Overlay color and adjust Overlay opacity to help text remain readable over the video.
• Click Save.

Enable the parallax effect

• Open the section settings.
• Enable Parallax if you want the additional scrolling effect.
• Preview the page while scrolling.
• Click Save.

The scroll-based video reveal works independently of the optional Parallax setting.

Section behavior

• The video begins in a cropped view and expands as the customer scrolls.
• If content blocks are present, the overlay fades in after the video begins to reveal.
• The video autoplays, is muted, and loops without visible playback controls.
• Separate video sources and cover images can be supplied for desktop and mobile.
• Highlighted reveal affects the heading; Parallax is an additional section-level scroll effect.

Troubleshooting

• The video does not appear: Check that a Shopify video or supported YouTube/Vimeo URL is configured, and preview the storefront.
• The reveal effect is not visible: Scroll through the section on the actual storefront rather than relying on a static Theme Editor preview.
• The mobile video looks incorrect: Check Video mobile, Video URL mobile, and Cover image mobile.
• Overlay text does not appear: Add a content block and make sure it is not empty.
• Text is difficult to read: Adjust Overlay color, Overlay opacity, and content position.
• Video does not autoplay: Browser autoplay policies and visitor settings may affect playback. The theme requests muted autoplay.

Need Further Assistance

If you encounter any issues or need additional help with your Concept theme, please contact our support team through the Ticket System.