WordPress 6.7 の画像サイズが変わってしまう問題

folder_openWEB制作
ワードプレス

WORDPRESS6.7がリリースされましたが、この更新は少し待ったほうが良いでしょう。

昨日、クライアントのWebサイトの作業中に画像サイズが縮小されたり比率が違うという問題に気付きました。
前日までは問題なく見えたのに、なぜこのようなことが起こるのだろうか?

これは、Wordpress6.7 がimg-size属性に値「auto」を割り当ててしまう事が原因です。
この一部のテーマ、プラグインなどでは、Chromeブラウザなどのデフォルト値が使用されてしまうため、画像が正しく表示されないということがわかりました。
これはブラウザのユーザーエージェントスタイルシートのデフォルトの動作です。

不具合が多かったのはWpBakeryPagebuilder やElementerなどを使用したサイトです。

修正するにはfunctions.phpに以下のコードを追加して、画像の幅と高さの属性を使用して画像に明示的な寸法を設定することでサイズを上書きできます。

add_filter(
        'wp_content_img_tag',
        static function ( $image ) {
                return str_replace( ' sizes="auto, ', ' sizes="', $image );
        }
);
add_filter(
        'wp_get_attachment_image_attributes',
        static function ( $attr ) {
                if ( isset( $attr['sizes'] ) ) {
                        $attr['sizes'] = preg_replace( '/^auto, /', '', $attr['sizes'] );
                }
                return $attr;
        }
);

このバグはWordpressに報告されている様ですが、自己責任で使用してください。

前の投稿
WooCommerceでグループ商品の初期値を1にする方法

関連記事

keyboard_arrow_up