numero2 / contao-video-thumbnail

1.0.0 2026-09-21 13:24 UTC

Requires

• php: ^8.1
• contao/core-bundle: ^5.3 || ^6.0
• doctrine/dbal: ^3.6 || ^4.0
• symfony/config: ^6.4 || ^7.0 || ^8.0
• symfony/dependency-injection: ^6.4 || ^7.0 || ^8.0
• symfony/filesystem: ^6.4 || ^7.0 || ^8.0
• symfony/http-kernel: ^6.4 || ^7.0 || ^8.0
• symfony/yaml: ^6.4 || ^7.0 || ^8.0
• twig/twig: ^3.10

Requires (Dev)

• contao/manager-plugin: ^2.0

Conflicts

• contao/core: *
• contao/manager-plugin: <2.0 || >=3.0

proprietary

• numero2 - Agentur für digitales Marketing GbR

• thumbnail
• video
• contao
• poster

Published on Packagist.org on 2026-09-22 06:37 UTC

README

Allows editors to capture a video frame as thumbnail/poster image directly in the Contao file manager - no ffmpeg or server-side binary required.

Screenshot

Requirements

• Contao 5.3 or newer

Installation

Via Contao Manager or Composer:

composer require numero2/contao-video-thumbnail

How it works

When editing a video file (.mp4, .webm, etc.) in the Contao file manager, an additional palette appears with a browser-native <video> player. Editors navigate to the desired frame using the frame-step buttons, click "Frame als Thumbnail festlegen", and save the form. The bundle then:

1. Decodes the captured JPEG from the hidden form field.
2. Writes a {basename}-poster.jpg file in the same folder as the video via Contao's VirtualFilesystem (DBAFS sync happens automatically).
3. Stores the poster file's UUID in the new tl_files.videoThumbnail column.

In the frontend, the bundle overrides the core player.html.twig template. When the player content element has no explicit poster set, the template automatically injects the captured thumbnail as the poster attribute on the <video> element. An explicit poster on the content element always takes precedence.

The file manager list view shows a green badge on videos that already have a thumbnail, plus an optional client-side toggle to display only those files.

Known limitations

• Client-side only: The frame capture runs entirely in the browser via <canvas>. Quality depends on the browser's video decoder; encrypted or DRM-protected streams cannot be captured.
• Public files only: The video must be accessible via a public URL for the browser to load it into the <video> element.