Documentation

Features

• Privacy-focused external services – YouTube, Vimeo, SoundCloud with a GDPR-compliant consent layer
• Site-wide privacy settings – Centralised backend configuration for privacy layer text, links and headings
• Media library – Reusable media assets across your entire website
• Automatic playlists – Playlists are created automatically once there are two or more items
• Full accessibility – Subtitles, chapters, audio description, sign language, keyboard navigation
• HLS streaming – Adaptive bitrate streaming with hls.js 1.6.16 (Chrome / Firefox / Edge / Desktop Safari) and native HLS on iOS / iPadOS – both variants are integrated into VidPly’s subtitles, transcripts and quality menus
• DASH streaming – MPEG-DASH via dash.js 5.2.0 (modern UMD) with adaptive quality and subtitles (integrated into video/audio formats)
• Import via URL – Paste a media URL into the backend to automatically detect the type, embed online media and pre-populate the title, artist and poster
• SoundCloud support – GDPR consent layer, followed by playback via the SoundCloud widget (optional opt-in for developers to use standardised VidPly controls – see privacy layer)
• Buffer loading indicator – Centred loading indicator that appears automatically whilst the media is buffering
• Optional download button – Toggle function per media item; progressive sources (MP4/WebM/MP3) are used automatically; for pure HLS/DASH elements, add a progressive fallback file
• Floating Player – Optional custom picture-in-picture: a movable, resizable window on the page (per media record)
• Modern player – Responsive PiP in the browser, quality switching, playback speed, overlay with keyboard shortcuts
• Structured data (JSON-LD) – VideoObject / AudioObject (as well as ItemList on gallery pages) for SEO rich results – see Developer Quick Start
• TypeScript codebase – The included VidPly player is now written in strict TypeScript and contains .d.ts declarations
• Conditional loading of assets – Only the JavaScript files required for your media types are loaded
• List view & detail page – Add a VidPly list view content element for one or more scrollable rows (horizontal shelf or responsive grid), optional pagination and sorting controls per row, category chips on cards, and links to a VidPly detail page with short and long (RTE) descriptions, categories and slug or ?media= URLs; linked translations follow the configuration for the default language row (see List view and detail page)

Quick Start

Install

composer require mpc/mpc-vidply

1. Database update → Admin tools → Maintenance → Analyse database structure
2. Integrate site set → Site Management → Sites → Your site → Sets → Add mpc/mpc-vidply
   (or add mpc/mpc-vidply to dependencies in config/sites/<site>/config.yaml)
3. Clear caches

Create media

‘List’ module → VidPly Media

The quickest way: Use ‘Import from URL’ at the top of the form – enter a YouTube, Vimeo, SoundCloud or streaming link (.m3u8 / .mpd) or an external MP4/MP3 link from the whitelist. VidPly recognises the type and fills in the metadata automatically. See the editor guide.

Or select the media type manually:

• Video – Upload MP4 or WebM files, or add HLS/DASH streaming URLs (with progressive fallbacks)
• Audio – Upload MP3 or OGG files, or add HLS/DASH streaming URLs (with progressive fallbacks)
• YouTube – Paste a video URL
• Vimeo – Paste the video URL
• SoundCloud – Paste the track/set URL

Add player to page

Page module → Add content → VidPly player – Select one or more media titles (a playlist will be created if you select two or more). For information on player options, subtitles, playlists and privacy, see the editor manual.

Create a media library (list view)

Add a VidPly List View content element for searchable list rows and a VidPly detail page for displaying individual media items (slug URLs, categories, detailed descriptions). Step-by-step guide: List View & Detail.

Documentation

Start with the documentation index for target-group-based navigation (editors, administrators, developers).

Troubleshooting

Prerequisites

• TYPO3: 13.4+ or 14.x (Core, Fluid, Extbase)
• PHP: 8.2+ (8.3 recommended)
• Composer: Required
• Browser: Chrome 90+, Firefox 88+, Safari 14+

fluid_styled_content is optional. VidPly registers its own TypoScript for rendering front-end content (lib.mpcVidplyContentElement) and provides a compatible default layout for tt_content headers and container classes.

Licence

GNU General Public Licence v2.0 or later

Author

Matthias Peltzer