From installation to acceptance: control the conversion, obtain preview images the privacy-friendly way, deviate per sales channel - and prove that it works.
Shopware 6.7 with Storefront, PHP 8.2 or newer. The built-in task scheduler is enough for fetching preview images in the background.
On compiling: the plugin script and styles are compiled into the theme bundle. A theme:compile is therefore required after installation and after every update.
Installation
Upload the ZIP in the admin under Extensions, install and activate it. Then enter the licence key. The settings live in the menu under Marketing, entry "Lite YouTube".
From the second deployment onwards, plugin:update StawLiteYoutube takes the place of the installation.
Licence
Without a valid licence the menu entry shows an activation screen instead of the interface, with the detected shop domain, a field for the key and a button to activate.
The key is stored on the server and never reaches the browser. Verification runs against plugins.staw.io, checking the combination of key and domain. A valid check holds for 15 minutes so that not every click in the admin triggers a request.
If the licence server is unreachable: the plugin keeps running for three days on the last valid check. If the server answers clearly with invalid, it locks immediately.
What happens without a licence: administration is locked and no more preview images are fetched. The storefront keeps running and already converted videos stay converted - visitors notice nothing.
Sales channel
At the top you define which sales channel the settings apply to. "Default - all sales channels" is the base setting. If a single channel is selected, the values set there apply to that channel only.
If a channel deviates from the default, a note lists the affected fields. "Reset to default" removes all its own values, after which it follows the default again.
Conversion
Conversion active is the main switch. With it off, the page is delivered unchanged.Only these paths restricts the conversion to individual pages, one path per line. If the field is empty it applies everywhere. A star at the end acts as a wildcard, so /hunting/* covers everything below /hunting.
For a comparison: enter a single test page first, measure, then empty the field again. That way the gain can be proven before the whole shop is switched over.
Exclude these paths takes individual pages out. This list is checked first and beats the include list - useful for landing pages where a video should play immediately.
Privacy and preview image
Load without cookies fetches the player from youtube-nocookie.com instead of youtube.com on click. It should stay on.
For the preview image there are three routes:
Store in the shop - recommended. The server fetches each image once and stores it in the shop. Best appearance with full cookie and IP freedom.
Load directly from YouTube - looks identical, but transmits the visitor IP address to Google on page view already. The privacy gain is therefore only partial.
No preview image - dark background with a play button. Until the click there is not a single outbound connection.
While the image is missing only applies with local storage: a freshly added video has no stored image yet because fetching runs in the background. Until then, either a temporary image is loaded from YouTube or none is shown. Anyone wanting no connection to Google at all picks "no preview image" here.Format and size: YouTube delivers every image as JPEG and as WebP. WebP is considerably smaller at the same resolution, so "automatic" tries it first. The size is an upper limit, not a promise - maxresdefault is the sharpest but does not exist for every video; if a size is missing, the next smaller one is used.
Why this looks convoluted: if a preview image is missing, YouTube answers with status code 404 but still returns valid image data in the body, a grey placeholder. On the server the status code can be evaluated; in the browser it cannot, where loading never formally fails. The storefront script therefore checks the actual image width: anything below 200 pixels is the placeholder, and the next entry in the chain is tried.
On aspect ratios: maxresdefault and mqdefault are close to 16:9, sddefault and hqdefault are 4:3 and carry black bars. Those are cropped in the storefront, so nothing of them is visible.
Load preview image lazily sets the loading attribute to lazy, so images of videos inside closed modals are not fetched on page view.
Managing preview images
The tab shows which videos the shop knows about and how their images stand.
As soon as a page with a video is delivered, the server fetches the preview image automatically - only after the page has reached the visitor, so it costs no waiting time. At most four images are fetched per page view so a page with many videos does not block a process. The hourly task remains as a net for anything that did not work.
On caching: while an image is missing on a page, that page is deliberately kept out of the page cache - otherwise the placeholder would freeze there although the real image has long arrived. Videos that gave up after three attempts do not count, so a single broken video cannot exclude a page permanently.
Queue videos - paste video IDs or complete YouTube addresses, separated by comma or space. That fills the store before a page goes live.
Fetch pending now - works through ten entries per click, for anyone who does not want to wait.
Retry failed - an entry rests after three failed attempts. If the cause was temporary, the button puts it back in the queue.
Refetch on a row loads exactly that image again, for instance when the channel changed it.
Remove deletes image and entry. On the next page view the video is queued again automatically.
The images live in the public file system under staw-lite-youtube, which works with S3 or other remote storage too. If the file system cannot provide a public address, the plugin serves them through a route of its own with a cache header of one year.
What is converted and what is not
Converted are all iframes with an address from youtube.com or youtube-nocookie.com - whether from a template, from a product description in the editor or from a shopping experience element.
Left untouched are:
iframe markup inside script, template, textarea, noscript and HTML comments
iframes from other providers such as Vimeo or Google Maps
iframes a lazy loader fetches through data-src
links to YouTube - this is exclusively about embedded players
Acceptance checklist
On a product page with two videos:
Look at the page source, not the DOM in the developer tools. No iframe with a youtube.com address may remain.
In the console, document.querySelectorAll('lite-youtube').length gives the number of videos on the page.
customElements.get('lite-youtube') returns the class.
Network view before the click: no requests to youtube.com, no YouTube cookies. With local preview images, no request to i.ytimg.com either.
After the click the video starts straight away, without a second click, on iOS and Android too.
Open a modal, start the video, close the modal: the sound stops.
Switch between the tabs of the product page - the video stays operable.
PageSpeed Insights before and after on the same page, note the values.
Points to note
Full cookie and IP freedom: with "load directly from YouTube" a connection to Google still occurs on page view. To rule that out, use "store in the shop" together with the placeholder "no preview image".
After changing settings clear the page cache as well, otherwise the old pages keep being delivered.
With a consent tool that places its own overlays on videos, check that two overlays do not end up on top of each other.
The image download runs through i.ytimg.com - done by the server, not the visitor, and only once per video. WebP is supported by all current browsers; only shops that must serve very old ones pick "JPEG only".
Support
Questions and requests come straight to us - support is from the developer, not from a queue. You can also request a feature through the Plugin Suite in the admin.
Availability
Directly from Stone & Water
Available now
Monthly7,99 €
Half-yearly39,99 €16 % cheaper
Best valueYearly74,99 €25 % cheaper
All prices net, plus VAT.
You buy the licence directly from us and receive an invoice from us. Installation by upload in the admin without SSH, updates through our licence platform, support straight from the developer.
The plugin will be listed in the official Shopware Community Store. Installation and automatic updates then run through the plugin manager in the backend, billing through your Shopware account. We will link it here as soon as it is available.