【EC-CUBE4.2】商品一覧ページの商品画像をWebPに対応する方法

画像をリサイズできるTwigフィルターのプルリクエストがリバーとされたので本記事は利用できません。

https://github.com/EC-CUBE/ec-cube/pull/5821

EC-CUBE4.2で商品一覧ページの商品画像をWebPに対応する方法です。

カスタマイズディレクトリに以下のservices.yamlを設定してください。

liip_imagine:
    resolvers:
        default:
            web_path:
                web_root: '%kernel.project_dir%'
                cache_prefix: 'html/upload/cache'
    loaders:
        default:
            filesystem:
                data_root: '%kernel.project_dir%'
    webp:
        generate: true
    filter_sets:
        cache: ~
        resize:

以上で設定完了です。

画像URLにアクセスするとWebP対応のブラウザの場合はWebPに変換された画像ファイルに転送され、WebPに未対応のブラウザ位の場合は通常の画像ファイルが表示されます。