以前にウェブサイトに又拍雲アクセラレーションを導入し、又拍雲を使用してWordPressサイトを高速化、今日早速バグに遭遇しました。
私がWordPressの新しいエディターを無効化するの記事に画像を追加したところ、画像が表示されませんでした。編集インターフェースでは画像アドレスが又拍雲のものに置き換えられていましたが、フロントエンドでは画像が表示されませんでした。ソースコードを確認すると、ブログのリソースリンクが残っていました。
<p><img src="https://edgeone.naibabiji.com/wp-content/uploads/2019/04/naibabiji.com_2019-05-06_14-49-40.jpg" alt="禁用Wordpress新版编辑器" width="600" height="377" class="aligncenter size-full wp-image-744" srcset="https://edgeone.naibabiji.com/wp-content/uploads/2019/04/naibabiji.com_2019-05-06_14-49-40.jpg 600w, https://edgeone.naibabiji.com/wp-content/uploads/2019/04/naibabiji.com_2019-05-06_14-49-40-150x94.jpg 150w" sizes="(max-width: 600px) 100vw, 600px" /></p>
ソースコード内に不可解にも追加されているのが確認できますsrcset=””とsizes=””の2つの属性があり、URLはブログの古いアドレスです。
調べてみると、WordPressがバージョン4.4以降、自動でレスポンシブ画像を設定する機能を追加したためで、又拍云プラグインはこの部分を置き換えられないようです。そのため、この自動レスポンシブ画像属性のコードを無効化する必要があります。
WordPressのデフォルトのレスポンシブ画像生成機能を無効化する
関数ファイルに以下の内容を追加して保存するだけです。
//disable srcset on images
function disable_srcset( $sources ) {
return false;
}
add_filter( 'wp_calculate_image_srcset', 'disable_srcset' );また、Naibaがテストしたところ、画像にこのclass属性が含まれていなければ、レスポンシブ画像の属性も生成されません。
class=”aligncenter size-full wp-image-744″
また、対応するWordPressプラグインもあります。Disable Responsive Images Complete