What does it do? 

This extensions adds a video local hosted preview to videos that has been embedded with fluid_styled_content (e.g. Text & Media content element) to the frontend. All the third party stuff will only be loaded/embedded if the user clicks on the preview image to view the video which helps in case of performance and providing more privacy for your website users.

Screenshots 

Composer 

If your TYPO3 installation works in composer mode, please execute following command:

composer req jweiland/video-shariff
vendor/bin/typo3 extension:setup --extension=video_shariff

If you work with DDEV please execute this command:

ddev composer req jweiland/video-shariff
ddev exec vendor/bin/typo3 extension:setup --extension=video_shariff

ExtensionManager 

On non composer based TYPO3 installations you can install video_shariff still over the ExtensionManager:

1. Login

   Login to backend of your TYPO3 installation as an administrator or system maintainer.

2. Open ExtensionManager

   Click on Extensions from the left menu to open the ExtensionManager.

3. Update Extensions

   Choose Get Extensions from the upper selectbox and click on the Update now button at the upper right.

4. Install video_shariff

   Use the search field to find video_shariff. Choose the video_shariff line from the search result and click on the cloud icon to install video_shariff.

Next step 

Configure video_shariff.

Why the Site Set must be added 

Adding the Site Set is mandatory for video_shariff to work correctly on TYPO3 v13+ sites. Without it, none of the extension's TypoScript is loaded, which has the following consequences:

• The Shariff-wrapped video output (two-click privacy layer) is not rendered - videos from YouTube and Vimeo would be embedded directly, defeating the entire purpose of video_shariff.
• The preview image rendering (thumbnail + overlay text) is not initialized, so the VideoPublicUrlViewHelper and VideoPreviewImageViewHelper have no configuration to fall back to.
• Constants such as lib.video_shariff.defaultThumbnail and the language overrides for the preview text are not available.
• The plugin's frontend assets (JavaScript, CSS) are not included.

In short: if the Site Set is not added, the extension is installed but silently inactive on the frontend. Adding the Site Set is therefore a required step, not an optional one.

Adding the Site Set via the backend 

1. Open Site Management

   In the TYPO3 backend, navigate to the Site Management module on the left and choose Sites.

2. Edit the site configuration

   Select the site for which video_shariff should be activated and open it for editing.

3. Switch to the "Sets for this Site" tab

   Within the site configuration, switch to the tab Sets for this Site (in some installations labelled Site Sets).

4. Select Video Shariff

   From the list of available Site Sets, activate Video Shariff (internal key jweiland/video-shariff). The label is defined by the extension in Configuration/Sets/video-shariff/config.yaml.

   

5. Save

   Save the site configuration. TYPO3 will flush the relevant caches so the Site Set takes effect immediately on the next frontend request.

Adding the Site Set via YAML 

If you manage your site configuration in version control, you can add video_shariff as a dependency directly in the site's config.yaml:

dependencies:
  - jweiland/video-shariff

This is equivalent to selecting the Site Set in the backend and is the preferred approach for site packages that are deployed via Composer.

Available settings 

The Site Set exposes its configuration through Configuration/Sets/video-shariff/settings.definitions.yaml. The settings are grouped under the videoShariff category and can be edited from the TYPO3 backend via Site Management → Settings, or overridden per-site in the site's config.yaml / settings.yaml.

Relationship to the legacy TypoScript include 

On TYPO3 v12 and earlier, video_shariff was activated by adding the static template Video shariff (video_shariff) to a TypoScript template record - see TypoScript. On TYPO3 v13+ the Site Set replaces that include; you should not add both, as the Site Set already imports the same TypoScript via:

@import 'EXT:video_shariff/Configuration/TypoScript/setup.typoscript'

Verifying the Site Set is active 

After saving the site configuration you can verify that the Site Set is active by:

• Opening the Template module, selecting a page within the site and checking that lib.video_shariff constants appear in the Constant Editor.
• Rendering a page that contains a YouTube or Vimeo video - the video must now be wrapped by the Shariff preview image instead of being embedded directly.

Lib 

lib.video_shariff.defaultThumbnail = EXT:site_package/Resources/Public/Images/FunnySunnyThumbnail.png*

Language 

plugin.tx_videoshariff._LOCAL_LANG.default.preview\.text = I am a custom preview text...
plugin.tx_videoshariff._LOCAL_LANG.de.preview\.text = Ich bin ein angepasster Vorschautext...

Update to version 4.0.0 

Version 4.0.0 is mainly focussed on TYPO3 13 LTS related fixes.

Update to version 3.1.0 

With version 3.1.0 we have removed the TypoScript access (TSFE) from VideoPreviewImageViewHelper. In our opineon all needed data should be transferred as ViewHelper arguments. That's why we have added a new argument fallbackThumbnailFile with following default value:

EXT:video_shariff/Resources/Public/Images/DefaultThumbnail.png

If you want to use your fallback thumbnail in your own fluid templates use VH as following:

<jw:videoPreviewImage fileReference="{mediaElement}" fallbackThumbnailFile="EXT:site_package/Resources/Public/Icons/FallbackIcon.png"/>

We have kept the TypoScript constant to be more compatible with earlier video_shariff versions. So, it's still possible to define a fallback thumbnail globally or on a page base:

lib.video_shariff.defaultThumbnail = EXT:video_shariff/Resources/Public/Images/DefaultThumbnail.png

The only difference is, that we made the constant available as setting in FLUIDTEMPLATE of fluid_styled_content and news:

lib.contentElement {
  settings.video_shariff.defaultThumbnail = {$lib.video_shariff.defaultThumbnail}
}

plugin.tx_news {
  settings.video_shariff.defaultThumbnail = {$lib.video_shariff.defaultThumbnail}
}

We have updated fluid templates of video_shariff already to set that new setting as argument for VideoPreviewImageViewHelper. Please make sure to also update your own fluid templates to get the new implementation working.

Version 5.0.0 

• [FEATURE] Added Site Set setting videoShariff.defaultThumbnail (category videoShariff) so the fallback thumbnail used when no provider-specific preview image can be fetched is now configurable per-site from the backend Settings editor or from a site package's config.yaml, replacing the previous hard-coded lib.video_shariff.defaultThumbnail constant lookup.
• [TASK] Compatibility fixes for TYPO3 14.
• [TASK] Replaced deprecated renderStatic() with instance render() method in all ViewHelpers.
• [TASK] Constructor injection of OnlineMediaHelperRegistry in VideoPreviewImageViewHelper and VideoPublicUrlViewHelper.
• [TASK] Replaced deprecated StandaloneView with RenderingContextFactory + TemplateView in functional tests.
• [TASK] Updated GetOnlineMediaHelperTrait — deprecated in favour of direct constructor injection.
• [TASK] Bumped phpstan/phpstan requirement to ^2.0.
• [TASK] Bumped typo3/coding-standards requirement to ^0.9.
• [TASK] Updated PHPUnit XML schema reference to version 11.5.
• [TASK] Added PHP 8.4 to CI matrix.

Version 4.0.0 

• [TASK] Compatibiliy fixes for TYPO3 13 LTS.
• [TASK] Documentation settings changed from settings.cfg to guides.xml

Version 3.2.0 

• [TASK] Fixed Broken badge url
• [TASK] Documentation ChangeLog page added
• [BUGFIX] Prevent TypeError when returning public

Version 3.1.0 

• [FEATURE] Add VH argument fallbackThumbnailFile
• [TASK] Remove TypoScript access from VH
• [BUGFIX] Prevent duplicate EXT: parsing
• [DOCS] Please read update instructions before updating. Maybe you have to update your templates!!!