{"id":25807056,"url":"https://github.com/fdonnet/prestashop-webp-quickand","last_synced_at":"2026-05-15T03:35:25.492Z","repository":{"id":115793669,"uuid":"330243951","full_name":"fdonnet/PrestaShop-Webp-QuickAnd","owner":"fdonnet","description":null,"archived":false,"fork":false,"pushed_at":"2021-01-28T12:20:23.000Z","size":20,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-02-28T04:13:56.796Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fdonnet.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}},"created_at":"2021-01-16T19:49:52.000Z","updated_at":"2021-05-19T09:02:02.000Z","dependencies_parsed_at":null,"dependency_job_id":"36c0a8e2-699e-4379-aaa4-a5f35da7584b","html_url":"https://github.com/fdonnet/PrestaShop-Webp-QuickAnd","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/fdonnet/PrestaShop-Webp-QuickAnd","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fdonnet%2FPrestaShop-Webp-QuickAnd","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fdonnet%2FPrestaShop-Webp-QuickAnd/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fdonnet%2FPrestaShop-Webp-QuickAnd/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fdonnet%2FPrestaShop-Webp-QuickAnd/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fdonnet","download_url":"https://codeload.github.com/fdonnet/PrestaShop-Webp-QuickAnd/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fdonnet%2FPrestaShop-Webp-QuickAnd/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33052732,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-13T13:14:54.681Z","status":"online","status_checked_at":"2026-05-15T02:00:06.351Z","response_time":103,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":[],"created_at":"2025-02-27T20:56:59.063Z","updated_at":"2026-05-15T03:35:25.486Z","avatar_url":"https://github.com/fdonnet.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"!!! DO NOT USE THAT ON RECENT PRESTA VS, they integrated the webp thing well !!!\n# Prestashop - webp integration - Quick \u0026 ...\n\nTest it, not in production... \nsudo in the commands below =\u003e needed if you don't have the permission on your presta website folder (owned by www-data).\n\n\n## 1) Linux (Ubuntu)\n\nInstall webp converter \n\n    sudo apt install webp\n\n\n## 2) Webp images folder\nCreate a new folder for webp images in your actual prestashop root folder\n\n    cd /prestawebsitefolder\n    sudo mkdir imgwebp \n\nCopy your .htaccess from your standard images folder\n\n    sudo cp img/.htaccess imgwebp/\n\nAdd webp support in the new .htaccess in your imgweb folder (modify this line for Apache 2.2 and 2.4)\n\n    \u003cFiles ~ \"(?i)^.*\\.(jpg|jpeg|gif|png|bmp|tiff|svg|pdf|mov|mpeg|mp4|avi|mpg|wma|flv|webm|ico|webp)$\"\u003e\n\n\n## 3) Modify and use the bash script   \nModify the config (path etc) in the script prestawebp.sh depending on your system. Change webp quality param if needed and run it \n\n    ./prestawebp.sh\n   It will generate all your webp images in the new imgwebp folder.\n\nEdit : with the new version 2021-01-28 =\u003e the script copies only the needed files. ~~For the moment, the script will copy all our original images (no matter what) and run the convert tool only if the webp file doesn't exist... not very efficient... you can do better.~~ At the end, it will rm the old files and keep only the webp in your imgwebp folder.\n\nYou can define a cron job to run the script every night (maybe a root cron job).\n\n\n## 4) Override the \"generateHtaccess\" method in class Tools.php\nPls find an example file in override/classes folder, but pls adapt to your shop. \n\nThe goal is to locate the lines with .jpg rules and duplicate for .webp ones (drive the rewrite rules to your new webp folder imgwebp)\n\nExample :\n\n    fwrite($write_fd, $media_domains);\n    fwrite($write_fd, $domain_rewrite_cond);\n    fwrite($write_fd, 'RewriteRule ^([a-z0-9]+)\\-([a-z0-9]+)(\\-[_a-zA-Z0-9-]*)(-[0-9]+)?/.+\\.jpg$ %{ENV:REWRITEBASE}img/p/$1-$2$3$4.jpg [L]' . PHP_EOL);\n    fwrite($write_fd, $media_domains);\n    fwrite($write_fd, $domain_rewrite_cond);\n    fwrite($write_fd, 'RewriteRule ^([a-z0-9]+)\\-([a-z0-9]+)(\\-[_a-zA-Z0-9-]*)(-[0-9]+)?/.+\\.webp$ %{ENV:REWRITEBASE}imgwebp/p/$1-$2$3$4.webp [L]' . PHP_EOL);\n\nTo turn on the new rules =\u003e Go in your shop admin UI and desactivate and reactivate friendly url. It will re-create your new .htaccess file with the .webp rules.\n\n\n## 5) Fallback for 404 on webp\nIf you add new products and your webp image version in not ready yet. Put in place a protection to show the .jpg version. Script in js folder. See where you want to put this script (in your theme or better, integreated in your theme.js).\n\n    function onErrorImgWebp() {\n    this.onerror = null;\n    this.parentNode.children[0].srcset = this.parentNode.children[1].srcset = this.src;\n    }\n\nWith html picture tag you have a fallback if the visitor browser is not able to use webp but no fallback if the .webp doesn't exist yet... This script helps a little...\n\n\n## 6) Change you templates (.tpl) to use webp if available\nVery easy... Go in your templates folder in your theme (ex: catalog/_partials/miniatures/product.tpl) and allow webp with picture tag and add a call to the 404 fallback in case of error.\n\n|replace:'.jpg':'.webp' =\u003e with only that instruction in the webp srcset it will works : your new .htaccess rules (see point 4) will take care of the rest.\n\nJust an example :\n\n    \u003cpicture\u003e\n\t    \u003csource srcset=\"{$product.cover.bySize.home_default.url|replace:'.jpg':'.webp'}\" type=\"image/webp\"\u003e\n\t\t\u003csource srcset=\"{$product.cover.bySize.home_default.url}\" type=\"image/jpeg\"\u003e\n        \u003cimg\n            src = \"{$product.cover.bySize.home_default.url}\"\n            alt = \"{if !empty($product.cover.legend)}{$product.cover.legend}{else}{$product.name|truncate:30:'...'}{/if}\"\n            loading=\"lazy\"\n            data-full-size-image-url = \"{$product.cover.large.url}\"\n            onerror=\"onErrorImgWebp.call(this)\" /\u003e\n\t\u003c/picture\u003e\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffdonnet%2Fprestashop-webp-quickand","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffdonnet%2Fprestashop-webp-quickand","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffdonnet%2Fprestashop-webp-quickand/lists"}