WordPressテーマSANGOの質問

記事一覧カードのサムネイル画像の縦横比を変えたい

アバター
shunP

先日他テーマからSANGOへ変更しました。
質問なのですが、
トップページの記事一覧のカードに表示されるアイキャッチ画像が
トリミングされてしまいます。(Regenerate Thumbnails実施済み)
前テーマでは全て4:3でアイキャッチを作成していたので、
出来ればこの比率で表示したいです。
カードの幅はこのままで少し長くなるイメージです。

宜しくお願いします。

他テーマからSANGOに移行される方へ(作成中)
コメントへの回答
サルワカくん
サルワカくん
2018/02/13

以下の方法で対応可能かと思います。
①子テーマのfunctions.phpに下記のコードを追記します。

//サムネイル画像の高さを390pxにオーバーライド(解説)
function my_change_thumb_size() {
  add_image_size( 'thumb-520', 520, 390, true );
}
add_action( 'after_setup_theme', 'my_change_thumb_size', 11);
//END サムネイル画像をオーバーライド

②子テーマのstyle.cssに下記のコードを追記

#main .cardtype__img {
    padding-bottom: 75%;
}

③プラグイン「Regenerate Thumbnail」を実行

うまくいったかどうかご報告頂けると幸いです。

アバター
shunP
2018/02/14

早速のご連絡有難う御座います。
上記方法で試してみたのですが、画像の下部がトリミングされてしまいます。
ただ、記事内の関連記事などのカードはきれいに表示されています。
恐らくTOPページのカードは日付部分がトリミングされている?

サルワカくん
サルワカくん
2018/02/14

すみません、#main cardtype__imgではなく#main .cardtype__imgです。ドットが抜けてました。
(コメントは修正済みです)。

アバター
shunP
2018/02/15

コードを修正して再度やってみたところ、きれいに表示されました!

ありがとう御座います!