Video

Video Section

This section allows you to add a headline, description, and a fully customizable video block to your Shopify store. Ideal for promotional content, brand storytelling, or product demos.

Headline Settings

  • Headline Text: Example: Video Heading Set the main headline of your video section.

  • Subheading Text: Example: Add subheading text or information about the video. Display optional context or descriptive text beneath the headline.

  • Text Alignment (Desktop & Mobile): Align text left, center, or right independently for desktop and mobile.

  • Headline Font Size:

    • Desktop: 37px

    • Mobile: 37px Customize headline size for both screen sizes.

  • Line Height: Set the line spacing for the headline (optional, default is "inherit").

  • Headline Text Color: Example: #000000 (black)

Subheading Settings

  • Font Size:

    • Desktop: 16px

    • Mobile: 16px

  • Line Height: Optional, default is inherit.

  • Text Color: Example: #2C2C2C

Font Customization

  • Enable Custom Fonts: Toggle to use your own typefaces.

  • Headline Font: Example: Sans-serif

  • Subheading Font: Example: Sans-serif

Section Design

  • Display on Devices: Choose All Devices, Desktop Only, or Mobile Only.

  • Background Color: Set a solid color (e.g., #FFFFFF) behind the section.

  • Background Image (Optional): Upload or choose a background image.

  • Image Overlay Color: Add a color overlay over the background image.

  • Background Size: Default: Cover

Spacing Settings

  • Padding Top/Bottom:

    • Desktop: 42px

    • Mobile: 44px

  • Padding Left/Right:

    • Desktop: 180px

    • Mobile: 19px

  • Element Spacing:

    • Gap between text and elements: 12px

    • Vertical space between subheading and video:

      • Desktop: -50px

      • Mobile: 15px

Video Settings

  • Hero Video Upload: Upload a video or paste an external MP4 link.

  • Playback Options:

    • Play Inline

    • Autoplay

    • Loop

    • Mute

    • Enable Play/Pause Button

  • Video Shadow: Optional shadow effect. Default: None

  • Aspect Ratio: Choose between None or standard 16:9.

  • Margins: Adjust video placement:

    • Top Margin: 0px

    • Bottom Margin: 0px

  • Lazy Loading: Improves page performance by loading the video only when visible.

Video Sizing

  • Desktop Video Dimensions:

    • Width: 1400px

    • Height: 500px

  • Mobile Video Dimensions:

    • Width: 800px

    • Height: 190px

  • Border Radius: Example: 13px for rounded video corners.

Accessibility & Metadata

  • Video Alt Text: Add descriptive alt text for accessibility.

  • Metadata: Include any structured data or additional info about the video.

PreviousImageNextBenefits Cards Pro 2

Last updated