🖨️ 4. Configuring Video Layouts & Display Options

Once you insert the JaJuMa Video Widget extension for Magento 2, you are presented with a powerful set of options to control the video's source, layout, and visual presentation.

Video Widget Configuration YouTube

Video Widget Configuration Vimeo

Video Widget Configuration Local

📐 4.1. Choosing a Video Layout

The Layout setting allows you to arrange your videos into common responsive patterns without writing a single line of code. This is perfect for creating visually appealing, structured content pages.

Layout Option Description Visual Representation Best Use Case
One Video (100%) A single video that spans the full width of the content area. [ ----- Video ----- ] Hero or feature videos on landing pages; primary product videos.
One Video Left A single video aligned to the left, with configurable width. Text will wrap around it. [Video] Text flows here... Illustrating a point within a blog post or detailed description.
One Video Right A single video aligned to the right, with configurable width. Text will wrap around it. Text flows here... [Video] Providing visual variety when accompanying a block of text.
Two Videos Two videos displayed side-by-side, each taking up 50% of the available width. [ Video ][ Video ] Comparing two products; showing a "before and after" transformation.
Three Videos Three videos displayed side-by-side, each taking up ~33% of the available width. [Vid][Vid][Vid] Creating a gallery of short video testimonials or product featurettes.

Video Widget Layout Example - Full Width

Video Widget Layout Example - One Video Floating Left/Right Video Widget Layout Example - Two/Three Videos in One Row

🎬 4.2. Adding Your Video Source

This is where you tell the JaJuMa Video Widget extension for Magento 2 which video to display. The required input changes based on the widget type you selected.

  • For YouTube:
    Simply copy and paste the full video URL from your browser's address bar (e.g., https://www.youtube.com/watch?v=...).
  • For Vimeo:
    Copy and paste the unique numeric Video ID from the Vimeo URL (e.g., for https://vimeo.com/123456789, you would paste 123456789).
  • For Local Videos:
    Use the Video Upload button to select and upload an .mp4 video file from your computer.

📸 4.3. Configuring Display & Responsive Options

These settings fine-tune the visual appearance of your video before it's played, ensuring it looks professional and loads efficiently.

  • Image Upload (Local Video only):
    This field allows you to upload a custom "poster" image. This is the image the user sees before they click play. A compelling poster image can significantly increase play rates.
  • Preview Image Quality (YouTube/Vimeo only):
    The widget automatically fetches a preview image from YouTube or Vimeo. This setting lets you choose the resolution. There is a trade-off to consider:
    • Lower Resolution:
      Loads faster, improving page speed. Ideal for smaller video embeds or when performance is the top priority.
    • Higher Resolution:
      Looks sharper and more professional, especially on large screens.
  • Preview Image Alt-Text (YouTube/Vimeo only):
    Text used as alt-Text for preview images.
  • Aspect Ratio (YouTube/Vimeo only):
    This is a critical setting for responsive design. Selecting the correct aspect ratio (e.g., 16:9 for most modern videos, 4:3 for older ones) ensures that the video player scales correctly on all devices, preventing the unprofessional "black bars" that appear when the ratio is mismatched.
  • Disable KB Controls (YouTube only):
    Disable keyboard controls in YouTube player (for Accessibility).

📞 Need Help?

Still have questions or need help verifying your system requirements? Our expert team is here to assist. Please don't hesitate to contact our support team for personalized assistance.


Ready to unlock these features for your store?

The JaJuMa Video Widget: Embed Videos In Magento 2 Made Easy.


Find all you need to know and more valuable insights about Hyvä and Magento.
Expertly curated by JaJuMa:

🚀 Launch the JaJuMa Hyväverse

Your central resource for everything Hyvä.

Explore the Magento Metropolis!

Your central resource for everything Magento.



Do you find all information about us and our services?

thumb-up
thumb-down