# HTML 5 - Video

The HTML5 video element allows you to embed videos in the Shopping Experiences without relying on external video platforms like YouTube or Vimeo.

{% hint style="success" %}
**Data protection with external video platforms**

Videos from external video platforms may generally only be played if the corresponding cookie consents are obtained.

Therefore, it cannot be ensured that 100% of all page visitors will see the displayed videos.

The HTML 5 video element pulls the videos from your Shopware media library.\
**Thus, no cookie consent is required.**
{% endhint %}

<figure><img src="/files/HIKXCqs43Dof6tqSXTI4" alt=""><figcaption></figcaption></figure>

### Video Settings

<figure><img src="/files/m4ihSX5CbZaMqwA1T6Z1" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="232">Function</th><th>Description</th></tr></thead><tbody><tr><td>Upload video (1)</td><td>Here you can upload/assign the video file from your Shopware media library.</td></tr><tr><td>Preview image (2)</td><td>If the video does not start automatically, you can upload a preview image/thumbnail here.</td></tr></tbody></table>

### General Settings

<figure><img src="/files/aOzU6C2WwiwGPuwX0DzV" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="258">Function</th><th>Description</th></tr></thead><tbody><tr><td>Width (1)</td><td>Here you set the width of the video in the corresponding block.</td></tr><tr><td>Height (2)</td><td><strong>auto</strong> means that the height will be automatically determined based on the format (recommended). Of course, you can also set your own values here.</td></tr><tr><td>Vertical alignment (3)</td><td>The vertical alignment is noticeable when the video is placed next to a taller element, such as a long text passage.</td></tr><tr><td>Horizontal alignment (4)</td><td>Here you can determine the horizontal alignment of the video within the block.</td></tr></tbody></table>

### Advanced Settings

<figure><img src="/files/SYwW4QxB7XaJWkhC7sPO" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="299">Function</th><th>Description</th></tr></thead><tbody><tr><td>Play on page load (1)</td><td>If sound is enabled, this may be disturbing. Always choose carefully.</td></tr><tr><td>Enable video controls (2)</td><td>Videos that are primarily used as design elements should not have controls.</td></tr><tr><td>Mute video by default (3)</td><td>If (1) is active, this function should possibly be deactivated.</td></tr><tr><td>Loop video (4)</td><td>If the video has finished, it will automatically start again.</td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.rh-webdesign.com/cms-bundle/en/elemente/medien/html-5-video.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.