web-dev-qa-db-ja.com

the_post_thumbnail応答srcsetにカスタムイメージサイズが入力されない

Wordpress 4.4で新しい レスポンシブ画像機能 を使用しようとしていますが、カスタム画像サイズでthe_post_thumbnailを使用しようとすると、特定の問題が発生し続けます。カスタムの画像サイズは使用できないようです。

次のコードは、imgが存在するsrcsetタグを生成します。

<?php the_post_thumbnail('medium',  array( 'class' => 'img-responsive' )); ?>

これは、imgタグが関数に渡されたmediumサイズのように見えることです。

<img width="300" height="225" src="path/to/image-300x225.jpg" class="img-responsive wp-post-image" alt="Image" srcset="path/to/image-300x225.jpg 300w, path/to/image-768x576.jpg 768w, path/to/image.jpg 1024w" sizes="(max-width: 300px) 100vw, 300px">

ただし、カスタムイメージサイズを使用するように変更を加えると、srcsetが消えます。誰もがここで何が起こっているのか知っていますか?

カスタム画像サイズを追加する方法は次のとおりです。

add_image_size ('my-custom-size', 1050, 626, true );

これがコードの中でどのように見えるかです:

<?php the_post_thumbnail('my-custom-size',  array( 'class' => 'img-responsive' )); ?>

そして、これが出力するものです。my-custom-sizeは読み込まれておらず、代わりにwp-post-imageの代わりにmy-custom-sizeを追加しています。

<img width="1024" height="626" src="path/to/image-1024x626.jpg" class="img-responsive wp-post-image" alt="Image">

私が間違っていることを理解するのを手伝ってください!

9
Moose

この答えが決定的であることを確認するのに十分な情報はありませんが、これが試みです。

まず、アップロードする画像が実際に定義したサイズよりも大きいことを確認してください。私は人々が小さすぎる画像をアップロードしてからこの種の結果を常に得ているのを見ます。

第二に、WPは同じ縦横比の画像サイズのSrcsetリストのみを構成します。カスタムサイズと他の画像サイズの縦横比が異なる場合は、縦横比が一致する新しいサイズの選択を作成できます。

第三に、新しい画像サイズを変更または追加した後は、常に既存のサムネイルを再生成する必要があります。サムネイルの再生成という素晴らしいプラグインがあります。

4