# magequest/magento2-module-lite-youtube

> A Magento 2 module that adds Paul Irish's Lite YouTube implementation support.

`composer require magequest/magento2-module-lite-youtube`

Canonical URL: https://packagento.com/magequest/magento2-module-lite-youtube

## At a glance

- **Vendor**: magequest (https://packagento.com/magequest.md)
- **Latest version**: 1.1.0 — released 2025-05-08
- **Pricing**: Free
- **Package type**: Magento 2 module
- **Status**: active, accepting new buyers

## Installation

Packagento is licence-gated, so even free packages need a licence on a project before Composer can resolve them.

1. **Sign in or create an account** at https://packagento.com/customer/account/.

2. **Add the package to your account.** Open https://packagento.com/magequest/magento2-module-lite-youtube and complete the free checkout. A licence is minted automatically.

3. **Create or pick a project, then activate the licence on it.**
   - Projects represent the Magento installs you deploy to. Manage them at https://packagento.com/projects/.
   - Activate the new licence on the project you'll deploy this package to. Activation is what generates the Composer credentials scoped to that project.

4. **Add the project credentials to your Magento codebase.**

   Grab the project's public + private key from https://packagento.com/projects/ (open the project, then its Credentials tab), and add them to `auth.json`:

   ```json
   {
     "http-basic": {
       "packagento.com": {
         "username": "ppk_live_...",
         "password": "psk_live_..."
       }
     }
   }
   ```

   Add the Packagento Composer repository to `composer.json`:

   ```json
   {
     "repositories": [
       { "type": "composer", "url": "https://packagento.com" }
     ]
   }
   ```

5. **Install and apply.**

   ```bash
   composer require magequest/magento2-module-lite-youtube:*
   bin/magento setup:upgrade
   bin/magento setup:di:compile
   bin/magento cache:flush
   ```

## What it does

A Magento 2 module that adds Paul Irish's Lite YouTube implementation support.

## README

YouTube videos, but performant. For Magento 2.

<div>
    <img src="https://img.shields.io/badge/magento-2.4-orange.svg?logo=magento&longCache=true&style=for-the-badge" alt="Magento 2.4"/>
    <img src="https://img.shields.io/badge/Hyv%C3%A4%20Themes-Supported-brightgreen?style=for-the-badge&longCache=true" alt="Hyvä Themes Supported"/>
    <img src="https://img.shields.io/packagist/v/magequest/magento2-module-lite-youtube?style=for-the-badge" alt="Packagist Version">
    <img src="https://img.shields.io/badge/License-MIT-blue.svg?longCache=true&style=for-the-badge" alt="MIT License"/>
</div>

### Overview
A Magento 2 module that adds performant YouTube embeds (with no user experience impact) based on [Paul Irish's Lite YouTube](https://github.com/paulirish/lite-youtube-embed) implementation.

Includes further enhancements, such as image quality (size), WebP support, custom placeholder images, image lazy loading and a Page Builder content type.

### Features
* Allows use of `<lite-youtube>` element anywhere on the storefront
* Can be used in CMS Pages/Blocks, attribute output or even code
* Adds a Page Builder content type for easier use (with admin preview)
* Choose default placeholder image quality (size)
* WebP image format used where browsers support
* Optionally add custom placeholder image
* Choose whether placeholder images are lazy loaded
* Critical CSS added to `<head>` to negate [CLS (Cumulative Layout Shift)](https://web.dev/cls/)
* Remaining CSS/JS only loaded when `<lite-youtube>` elements exist on the page

### Installation
```
composer require magequest/magento2-module-lite-youtube
bin/magento module:enable MageQuest_LiteYouTube
bin/magento setup:upgrade
```

### Usage
See [Paul Irish's Lite YouTube](https://github.com/paulirish/lite-youtube-embed) README for basic usage.

> Note: the progressive enhancement option is not recommended with this implementation as both button and imagery can be lazy loaded and by doing so helps reduce CLS (https://web.dev/cls/).

#### Additional Controls
The following additions are implemented via [this fork of Lite YouTube](https://github.com/johnhughes1984/lite-youtube-embed):

* Default placeholder image quality: `quality="hqdefault|sddefault|maxresdefault"`
  * `hqdefault` is default
  * See overview of sizes and availability [here](https://github.com/paulirish/lite-youtube-embed/blob/master/youtube-thumbnail-urls.md)
* Custom placeholder image: `image="<image-url>"`
* Disable placeholder image lazy load: `lazy="false"`

### Compatibility
* Magento Open Source / Commerce Edition 2.4.x
* Supports Magento 2 Full Page Cache (including Varnish)
* Supports both Luma/Blank and Hyvä Themes based storefronts
* **Does not support Internet Explorer** 

### FAQs
##### Can I use the module if a site doesn't have/use Page Builder?

Yes, you can just add `<lite-youtube>` elements manually to CMS Blocks/Pages, attributes or anywhere else that supports HTML input.

##### Why does the minified CSS also contain the critical CSS?

Because the CSS is required on both the admin panel and the storefront, I ran into issues with the critical CSS not being recognised in the admin panel and didn't want to maintain 2 separate CSS files for the sake of 10 lines of CSS. 

### Contributing
Issues and pull requests welcomed.

## Changelog

All notable changes to this project will be documented in this file.

The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).

### [Unreleased]

### [1.0.0] - 2021-11-17
#### Added
* Initial Lite YouTube support
* Page Builder content type
* Default placeholder image quality (size) selection
* Default placeholder image WebP support
* Custom placeholder image option
* Lazy load placeholder images

## Recent Versions

| Version | Released |
|---|---|
| 1.1.0 | 2025-05-08 |
| 1.0.1 | 2022-12-22 |
| 1.0.0 | 2021-11-18 |

## Dependencies

### Require

| Package | Constraint |
|---|---|
| magento/framework | >=103.0.0 |

## Quality

Latest release (1.1.0) passes the Packagento QA pipeline. Verdicts below are per-cell (Magento line × PHP version) for the matrixed tools, and run-once for the static / security tiers.


### Compatibility

Each Magento line is installed on its supported PHP versions, then the module is built (DI compile + static-content deploy). Cells show passed / failed / untested; staircase gaps render as `–`.

| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | Pass | Pass | – | – |
| 2.4.8 | – | Pass | Pass | – |
| 2.4.9 | – | – | Pass | Pass |


### Code Quality

Advisory checks against the module's source. Never affect the Compatibility verdict — a phpcs finding can't make a module incompatible.

#### Static Analysis

Coding standards (phpcs), mess detection (phpmd), copy-pasted code (cpd), PHP cross-version compatibility, composer.json validity. Each runs once for the whole module.

| Tool | Status | Findings | Summary |
|---|---|---|---|
| PHPCS | Pass | 0 |  |
| PHPMD | Pass | 0 |  |
| Cpd | Pass | 0 |  |
| Composer validate | Info | 1 | valid; 1 advisory note (composer validate --strict) |

#### PHPStan

Type-checks the module against a real Magento install. Re-runs per Magento + PHP version because resolvable symbols differ between releases.

| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | Pass | Pass | – | – |
| 2.4.8 | – | Pass | Pass | – |
| 2.4.9 | – | – | Pass | Pass |


### Tests

Unit and integration suites run per Magento + PHP cell. Test failures speak to the module's behaviour, not its compatibility with a line, so they're reported here separately.

#### Unit Tests

| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | N/A | N/A | – | – |
| 2.4.8 | – | N/A | N/A | – |
| 2.4.9 | – | – | N/A | N/A |

#### Integration Tests

| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | N/A | N/A | – | – |
| 2.4.8 | – | N/A | N/A | – |
| 2.4.9 | – | – | N/A | N/A |


### Security

Dependency-advisory audit (composer audit) plus a source malware scan. A malware detection fails the version outright.

| Tool | Status | Findings | Summary |
|---|---|---|---|
| Composer audit | Pass | 0 |  |
| Malware scan | Pass | 0 |  |

## Licence and pricing

Free. A licence is still minted on checkout and bound to your project for Composer access — no payment step.

Refundable within 14 days of first purchase via https://packagento.com/account/refunds/.

## Install via Claude Code or any MCP client

The Packagento MCP server can run the licence + project + Composer steps above in one tool call:

```
purchase_and_install_packages(
  composer_names=["magequest/magento2-module-lite-youtube"],
  project_id="proj_xxx"
)
```

This handles cart, checkout, licence minting, project activation, and writes auth.json credentials. Connect a client with `claude mcp add packagento https://mcp.packagento.com`. Full setup at https://packagento.com/docs/mcp-setup.

## Vendor

magequest is a Magento 2 vendor on Packagento. See https://packagento.com/magequest.md for their full catalogue.

