How to add a video to a page
In this article, you will learn how to integrate dynamic multimedia assets into your pages, select embed configurations, and define playback functionality in the editor.
What you will need:
- An active SystemeScale account.
- A page layout open in edit mode.
- A localized video file or a public link from an external video hosting site (such as YouTube, Vimeo, or others).
General Process for Adding a Video
1
Place the Element Block
Open your page editor canvas workspace. Locate the Video component element inside the left elements tray, and drag and drop it onto your layout.
2
Access Element Properties Panel
Click on the newly placed placeholder block within your page view, then select the Video settings icon to reveal the properties configuration framework inside the left sidebar panel.
Core Integration Embed Options
SystemeScale supports three flexible integration avenues to host and present video material:
- Direct Link: Paste a direct URL path from standard third-party streaming platforms (such as YouTube or Vimeo) to quickly loop external network playback.
- Custom Embed: Input specialized raw HTML/JS element tags to deploy advanced responsive third-party frame scripts or customized player frameworks directly.
- Upload File: Upload a video file asset stored directly on your computer to save it within the platform's cloud cloud directory network.
Configuring Key Playback Parameters
For your streaming assets to present correctly, you should adjust two primary behavioral options found within the settings side panel menu:
- Autoplay: Set this variable to On to command the asset container to load and initialize playback automatically when a viewer visits the destination page. Select Off to display a static player frame that pauses until the user manually selects the play button block.
- Controls: Select On to reveal common interactive controls (such as play, pause, volume adjust, closed captioning, or absolute full-screen toggles) across the bottom row wrapper. Select Off to hide tracking controllers for an uninterrupted, clean visual frame stream.
πΌοΈ
Thumbnail Optimization and Layout Curation
When choosing the localized Upload file system configuration option, you can add a customized thumbnail poster image asset. This static design covers the streaming player view completely until the page viewer engages the media block container. For clean presentation, we recommend uploading thumbnail images with matching resolution dimensions to avoid player cropping on high-resolution screens.
Was this article helpful?