{"id":13518428,"url":"https://github.com/plan2net/webp","last_synced_at":"2026-01-15T04:05:11.338Z","repository":{"id":30486776,"uuid":"125105577","full_name":"plan2net/webp","owner":"plan2net","description":"Create a WebP copy for images (TYPO3 CMS)","archived":false,"fork":false,"pushed_at":"2025-08-28T05:01:54.000Z","size":572,"stargazers_count":65,"open_issues_count":12,"forks_count":39,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-10-02T02:48:34.154Z","etag":null,"topics":["extension","typo3","webp"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/plan2net.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2018-03-13T19:45:34.000Z","updated_at":"2025-08-28T05:01:58.000Z","dependencies_parsed_at":"2025-08-25T10:11:58.117Z","dependency_job_id":"eba7bb99-ec91-4d21-a6af-b470e37096f4","html_url":"https://github.com/plan2net/webp","commit_stats":{"total_commits":63,"total_committers":11,"mean_commits":"5.7272727272727275","dds":0.2063492063492064,"last_synced_commit":"e629617ce46814652e302a09de8e2f8f9f226c65"},"previous_names":[],"tags_count":31,"template":false,"template_full_name":null,"purl":"pkg:github/plan2net/webp","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/plan2net%2Fwebp","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/plan2net%2Fwebp/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/plan2net%2Fwebp/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/plan2net%2Fwebp/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/plan2net","download_url":"https://codeload.github.com/plan2net/webp/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/plan2net%2Fwebp/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28420813,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-14T10:47:48.104Z","status":"ssl_error","status_checked_at":"2026-01-14T10:46:19.031Z","response_time":107,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["extension","typo3","webp"],"created_at":"2024-08-01T05:01:44.721Z","updated_at":"2026-01-15T04:05:11.317Z","avatar_url":"https://github.com/plan2net.png","language":"PHP","funding_links":[],"categories":["PHP"],"sub_categories":[],"readme":"# WebP for TYPO3 CMS\n\n## What does it do?\n\nAdds an automagically created _WebP_ copy for every processed jpg/jpeg/png/gif image in the format\n\n    original.ext.webp\n    \n## What is WebP and why do I want it?\n\n\u003e WebP is a modern image format that provides superior lossless and lossy compression for images on the web. Using WebP, webmasters and web developers can create smaller, richer images that make the web faster.\n\u003e  \n\u003e  WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller than comparable JPEG images at equivalent SSIM quality index.\n\u003e  \n\u003e  Lossless WebP supports transparency (also known as alpha channel) at a cost of just 22% additional bytes. For cases when lossy RGB compression is acceptable, lossy WebP also supports transparency, typically providing 3× smaller file sizes compared to PNG.\n\n   — source: https://developers.google.com/speed/webp/\n\n## Installation\n\nAdd via composer: \n\n    composer require \"plan2net/webp\"\n\n* Install and activate the extension in the Extension manager \n* Flush TYPO3 and PHP Cache\n* Clear the processed files in the Install Tool or Maintenance module\n* Add rewrite rules for your webserver (see examples for Apache and nginx below)\n\n## Update\n\n* Save the extension settings at least once (through `Admin Tools \u003e Settings \u003e Extension Configuration \u003e webp`) after an update to save the new default settings in your local configuration\n\n## Requirements\n\nYou can either use the installed Imagemagick or GraphicsMagick you already use for TYPO3 image manipulation if it supports webp (see below) or you can use any other external binary available on your server (e.g. [_cwebp_](https://developers.google.com/speed/webp/docs/cwebp)).\n\nYou can test the support of GraphicsMagick with e.g.:\n\n    gm version | grep WebP\n\n(should return `yes`)\n\nor using ImageMagick with e.g.: \n\n    convert version | grep webp\n\n(should return a list of supported formats including `webp`)\n\nThese are examples, check your system documentation for further information on how to verify webp support on your platform.\n\n## Extension settings\n\n![Extension settings](Resources/Public/Documentation/extension_settings.png)\n\nYou can set parameters for the conversion in the extension configuration. \n\n### `parameters`\n\n```\nparameters = image/jpeg:-quality 85 -define webp:lossless=false|image/png:-quality 75 -define webp:lossless=true|image/gif::-quality 85 -define webp:lossless=true\n```\n\nYou find a list of possible options here:\n\nhttps://www.imagemagick.org/script/webp.php\nhttp://www.graphicsmagick.org/GraphicsMagick.html\n\nIf you want to use an external binary, you have to supply an option string with exactly two `%s` placeholders for the original file and the target file name.\nE.g.:\n\n```\nimage/jpeg::/usr/bin/cwebp -jpeg_like %s -o %s|image/png::/usr/bin/cwebp -lossless %s -o %s|image/gif::/usr/bin/gif2webp %s -o %s\n```\n\nhttps://developers.google.com/speed/webp/docs/cwebp\n\n*Warning*\n\nTry to set a higher value for `quality` first if the image does not fit your expectations,\nbefore trying to use `webp:lossless=true`, as this could even lead to a\nhigher filesize than the original!\n\n### `convert_all`\n\n    # cat=basic; type=boolean; label=Convert all images in local and writable storage and save a copy in Webp format; disable to convert images in the _processed_ folder only\n    convert_all = 1\n    \nSince version `1.1.0` all images in every local and writable storage will be saved as a copy in Webp format by default (instead of just images modified by TYPO3 in the storage's processed folder). If you want to revert to the previous behaviour, set this flag to `false` (disable the checkbox).\n\n### `silent`\n\n    # cat=basic; type=boolean; label=Suppress output (stdout, stderr) from the external converter command\n    silent = 1\n    \nSince version `2.2.0` you can suppress output (stdout, stderr) from the external converter (Linux only).\n\n### `hide_webp`\n\n    # cat=basic; type=boolean; label=Hide .webp files in backend file list module\n    hide_webp = 1\n\n`.webp` files are hidden by default in the backend file list module. If you want to show them to the users, disable this option.\n\nIf you need a more customized behaviour for hiding or showing the generated files (e.g. for a specific BE user group),\nyou can always remove or change the `$GLOBALS['TYPO3_CONF_VARS']['SYS']['fal']['defaultFilterCallbacks']` settings\n(see `ext_localconf.php` for details) in your own extension.\n\n### `exclude_directories`\n\n    # cat=basic; type=string; label=Exclude processing of images from specific directories (separated by semicolon)\n    exclude_directories =\n\nHere you can exclude processing of images from specific directories.\nExample value: `/fileadmin/demo/special;/another-storage/demo/exclusive`\n\n### `use_system_settings`\n\n    # cat=basic; type=boolean; label=Use the system GFX \"processor_stripColorProfileCommand\"/\"processor_stripColorProfileParameters\" setting for the MagickConverter converter\n    use_system_settings = 1\n\nWhen set (default) the value from `$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_stripColorProfileCommand']` or\n`$GLOBALS['TYPO3_CONF_VARS']['GFX']['processor_stripColorProfileParameters']` is appended automatically to the\nconfiguration options for the `MagickConverter` converter, so you don't need to repeat the settings.\n\n## Webserver example configuration\n\nPlease **adapt** the following to _your specific needs_, this is **only an example** configuration.\n\n### nginx\n\nAdd a map directive in your global nginx configuration:\n\n    map $http_accept $webp_suffix {\n        default   \"\";\n        \"~*webp\"  \".webp\";\n    }\n\nIf you use _Cloudflare_ the following might better suit your needs:\n\n    map $http_accept $webpok {\n        default   0;\n        \"~*webp\"  1;\n    }\n\n    map $http_cf_cache_status $iscf {\n        default   1;\n        \"\"        0;\n    }\n\n    map $webpok$iscf $webp_suffix {\n        11          \"\";\n        10          \".webp\";\n        01          \"\";\n        00          \"\";\n    }\n\nAdd these rules to your `server` configuration:\n\n    location ~* ^.+\\.(png|gif|jpe?g)$ {\n            add_header Vary \"Accept\";\n            add_header Cache-Control \"public, no-transform\";\n            try_files $uri$webp_suffix $uri =404;\n    }\n\nMake sure that there are no other rules that prevent further rules or already apply to the specified image formats and prevent further execution!\n\nYou can also add a browser restriction if your audience uses old versions of Safari, etc., so no _webp_ is served to them.\n\n    location ~* ^.+\\.(png|gif|jpe?g)$ {\n        if ($http_user_agent !~* (Chrome|Firefox|Edge)) {\n            set $webp_suffix \"\";\n        }\n        …\n\n### Apache (.htaccess example)\n\nWe assume that module `mod_rewrite.c` is enabled.\n\n    RewriteEngine On\n    AddType image/webp .webp\n\nis already part of the TYPO3 htaccess template in\n`typo3/sysext/install/Resources/Private/FolderStructureTemplateFiles/root-htaccess`\n\n    RewriteCond %{HTTP_ACCEPT} image/webp\n    RewriteCond %{REQUEST_FILENAME} (.*)\\.(?i:png|gif|jpe?g)$\n    RewriteCond %{REQUEST_FILENAME}\\.webp -f\n    RewriteRule ^ %{REQUEST_FILENAME}\\.webp [L,T=image/webp]\n\n    \u003cIfModule mod_headers.c\u003e\n        \u003cFilesMatch \"\\.(png|gif|jpe?g)$\"\u003e\n            Header append Vary Accept\n        \u003c/FilesMatch\u003e\n    \u003c/IfModule\u003e\n\nMake sure that there are no other rules that prevent further rules or already apply to the specified image formats and prevent further execution!\n\nYou can also add a browser restriction if your audience uses old versions of Safari, etc., so no _webp_ is served to them.\n\n    RewriteCond %{HTTP_ACCEPT} image/webp\n    RewriteCond %{HTTP_USER_AGENT} ^.*(Chrome|Firefox|Edge).*$ [NC]\n    …\n\n## Verify successful webp image generation and delivery\n\nTo make sure that everything works as expected you need to check two things:\n\n1. WebP image generation on the webserver\n2. successful delivery of WebP images to the client\n\n### WebP image generation\n\nGo to `fileadmin/_processed_` and check the subfolders for files with `.webp` extension. For every processed image file there should be a second file with the same filename plus `.webp` extension:\n\n```\ncsm_foo-bar_4f3d6bb7d0.jpg\ncsm_foo-bar_4f3d6bb7d0.jpg.webp\n```\n\n### Delivery of WebP images to the client\n\nOpen a processed jpg or png image (see above) in your browser, e.g. `https://domain.tld/fileadmin/_processed_/b/2/csm_foo-bar_4f3d6bb7d0.jpg`\n\nCheck the response headers in the developer tools of your browser. Despite the file suffix `.jpg`, you should get `Content-Type: image/webp`.\n\n![Extension settings](Resources/Public/Documentation/headers.png)\n\n## Troubleshooting and logging\n\nIf something does not work as expected take a look at the log file.\nEvery problem is logged to the TYPO3 log (since version 2.0), normally found in `var/log/typo3_*.log`\n\nConverted files that are larger than the original are removed automatically (since version 2.1.0)\nand the conversion will not be retried with the same configuration.\n\nIf you find that your webp images don't look like the original images (much darker, for example), make sure you have the correct profile set in the system setting `GFX/processor_colorspace` (e.g. `sRGB`). Remember to clean up any processed files after this change.\n\n## Removing processed files\n\nYou can remove the created .webp files at any time within the TYPO3 CMS backend.\n\n* Go to Admin Tools \u003e Remove Temporary Assets\n* Click the _Scan temporary files_ button\n* In the modal click the button with the path of the storage\n\nAlthough the button names only the path of the `_processed_` folder, all processed files of the storage are actually deleted!\n\n## Alternatives\n\nYou can get an equal result with using the Apache _mod_pagespeed_ or nginx _ngx_pagespeed_ modules from Google https://developers.google.com/speed/pagespeed/module/ with a configuration like:\n\n    pagespeed EnableFilters convert_jpeg_to_webp;\n    pagespeed EnableFilters convert_to_webp_lossless;\n    \nbut that requires more knowledge to set up.\n\n## Drawbacks to keep in mind\n\nNote that this extension produces an additional load on your server (each processed image is reprocessed) and possibly creates a lot of additional files that consume disk space (size varies depending on your! configuration).\n\n## Inspiration\n\nThis extension was inspired by [Angela Dudtkowski](https://www.clickstorm.de/agentur/)'s _cs_webp_ extension that has some flaws and got no update since early 2017. Thanks Angela :-) \n\nThanks to Xavier Perseguers for the _Cloudflare_ hint.\n\nThanks to Marcus Förster for simplifying the Apache rewrite rules.\n\n## Spread some love\n\nSend us a postcard from your favourite place and tell us how much you love TYPO3 and OpenSource:\n\u003e plan2net GmbH, Sieveringerstraße 37, 1190 Vienna, Austria\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fplan2net%2Fwebp","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fplan2net%2Fwebp","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fplan2net%2Fwebp/lists"}