私のwordpressテーマの1つのテンプレートでこのようなサムネイルを使用しました→
<?php the_post_thumbnail( 'medium' ); ?>
ブラウザではこんな感じです→
<img
width="300"
height="220"
src="http://example.com/image-300x220.jpg"
class="attachment-medium size-medium wp-post-image"
alt=""
srcset="
http://example.com/image-300x220.jpg 300w,
http://example.com/image.jpg 640w"
sizes="(max-width: 300px) 100vw, 300px"
>
私の最初の質問は、height = autoをどのように置くかということです。これを達成するのに役立つ関数はありますか? responsive-img
など
一言で言えば、私はCSSを介して幅を制御する必要がありますかWordPressはこれを行うためのいくつかの機能を提供する?
あなたのimg URLから高さの値を削除したい場合は、この関数を使用できます。
add_filter( 'post_thumbnail_html', 'remove_thumbnail_height', 10, 5 );
function remove_thumbnail_height( $html, $post_id, $post_thumbnail_id, $size, $attr ) {
$html = preg_replace( '/height=\"\d*\"/', "", $html );
return $html;
}
これは高さを空の値に置き換えます。 Auto
プロパティの値としてheight
を使用することはできません。それはW3バリデータによって検証されません。ただし、CSSで高さを自動に設定することができます。
.wp-post-image {
height: auto;
}
あなたはこのようなものを使うことができます、
2番目のパラメータは、次のように属性の配列として使用できます。
the_post_thumbnail('medium', ['class' => 'img-responsive', 'alt' => get_the_title()]);
ブートストラップフレームワークを使用していない場合は、スタイルシートに
.img-responsive{
width: 100%;
}