Downloading the Extension

Email: After purchasing the extension from our store, you will receive an email with the link to download the extension.

Store: You can also download the extension from the Downloads section of our store. If you are new to our store, create an account using the same email address you used when purchasing.

Click to download the extension package — mod_youtube_gallery_3.3.zip

System Requirements

• Joomla 4.x, 5.x, or 6.x (Joomla 3 is not supported)
• PHP 8.0 or higher
• Modern web browser (Chrome, Firefox, Safari, Edge)

Install the Extension

• Log in to the backend of your Joomla website.
• Go to System > Install > Extensions.
• Drag and drop mod_youtube_gallery_3.3.zip or browse to select the file.
• Click Upload and Install.
• A success message appears when installation completes.
• Go to Content > Site Modules, click New, and choose Youtube VideoList Gallery.

Tip: For the authentic youtube.com look, set Gallery Layout to YouTube and Colour Theme to YouTube Dark on the Layout tab.

Note: This module is compatible with Joomla 4, 5, and 6 only.

Gallery Layout

Choose how the player and playlist are arranged on the page:

• YouTube (website style): 16:9 player with a scrollable playlist beside it — closest to youtube.com.
• Sidebar: Clean modern list layout with flexible themes.
• Grid: Thumbnail grid below the main player.
• Stacked: Vertical list under the player.
• Cinema: Immersive 21:9 widescreen stage with a framed shell and circular play button.

Colour Theme

• YouTube Dark: Default dark watch-page palette.
• Light: Light surfaces for editorial sites.
• Soft: Soft light background with teal-friendly accents.
• Dark: Full dark mode for Cinema and night layouts.

Layout Options

• Playlist Position: Place the playlist on the Right or Left of the player (YouTube, Sidebar, and Cinema layouts).
• Player Width (%): Share of the row for the player (40–85). The playlist uses the remainder. Example: 70 = 70% player.
• Gap: Space between player and playlist. Example: 16px.
• Corner Radius (px): Rounds the player stage and playlist items. Example: 12.

On desktop, the playlist column height syncs to the player so the layout stays aligned like YouTube. On mobile, the player and playlist stack vertically.

Video Playlist

On the Videos tab, click Add in the repeatable playlist field to add each video.

• YouTube URL: Paste a full watch, embed, Shorts, or youtu.be link. Example: https://www.youtube.com/watch?v=dQw4w9WgXcQ
• Auto-fill: After you paste a URL, the module fetches the title and thumbnail automatically and shows a preview in the admin.
• Title: Editable after auto-fill if you want a custom label in the playlist.
• Thumbnail: Filled automatically; used as the poster before playback.
• Start time: Add ?t=30 or &t=30 to the URL to start at 30 seconds.
• End time: Add &end=120 to stop at 120 seconds.

Drag rows to reorder videos. Add as many entries as you need — there is no fixed limit.

Front end: Visitors see a poster and play button first. The YouTube iframe loads only when they click play or select a playlist item (unless Autoplay is enabled).

Display

• Show Titles: Show or hide video titles in the playlist.
• Enable Search: Adds a search box above the playlist to filter videos by title.

Playback

• Autoplay First Video: Load and play the first video when the page loads. Browsers usually require mute for autoplay.
• Mute on Autoplay: Mute when autoplay runs — recommended for Chrome, Firefox, Safari, and Edge.
• Allow Fullscreen: Let visitors use the YouTube fullscreen control.
• Show Related Videos: Passes YouTube’s rel parameter. YouTube may still limit related videos to your channel.
• Loop: Off, Current video, or Current video (playlist param) — loops the active embed.

Privacy & Performance

• Embeds use youtube-nocookie.com until the visitor plays a video.
• A loading spinner appears while the iframe initialises.
• Click-to-play avoids loading third-party content until the user chooses a video.

Accent Colour

Set the accent used for the active playlist border, “Now” badge, and play button. YouTube red is #ff0000.

Extra CSS

Add optional CSS scoped to the module instance. Unsafe rules (such as expression(), @import, or javascript:) are stripped automatically.

Each module outputs a unique root ID (#jx-ytg123) and CSS variables you can override:

• --jx-ytg-accent — accent colour
• --jx-ytg-radius — corner radius
• --jx-ytg-gap — gap between player and playlist
• --jx-ytg-list-w — playlist column width in pixels

Advanced

• Module Class Suffix: Extra class on the module wrapper for template-specific styling.
• Layout: Alternative Joomla module layout override if you add custom tmpl files.

Multiple Instances

Publish several module instances on the same page — each gets its own playlist, settings, and scoped CSS. Instances do not conflict.

Updates

• Automatic updates: The module registers an update server with Joomla’s Extension Manager.
• Manual updates: Install a newer mod_youtube_gallery zip via System > Install — existing module settings are preserved on upgrade.
• Download key: Enter your license key in the module’s update site settings if prompted.

Technical Notes

• Joomla 5 services architecture (service provider, Dispatcher, Helper).
• Vanilla JavaScript — no jQuery on the front end.
• 12 language packs included (en-GB, es-ES, fr-FR, de-DE, it-IT, pt-BR, nl-NL, pl-PL, ru-RU, ja-JP, zh-CN, ar-AA).

Note: Always back up your site before updating extensions.

Key Features (v3.3)

• Five layouts: YouTube, Sidebar, Grid, Stacked, and Cinema
• Four themes: YouTube Dark, Light, Soft, and Dark
• Auto-fill from URL: Title and thumbnail from any supported YouTube link
• Playlist search: Filter videos by title on the front end
• Click-to-play poster: Faster pages and fewer cookies until playback
• Privacy embed: youtube-nocookie.com domain
• Synced playlist height: Desktop layout aligned to the player
• Playback options: Autoplay, mute, loop, fullscreen, related videos
• Responsive: Mobile-friendly stack and touch targets
• Joomla 4, 5 & 6: PHP 8.0+ with modern extension structure

Browser Compatibility

Works in Chrome, Firefox, Safari, and Edge. Autoplay with sound is blocked by most browsers — use Mute on Autoplay or let visitors click play for sound.

Live Demo

Try all five layouts on our demo site: Youtube VideoList Gallery demo.