ショートコードの「カテゴリー記事一覧」で表示される画像は【 アスペクト比 1:1 】つまり正方形の画像が表示されます。選択肢はありません。
THE THOR で使用する画像比率は 16:9 や 4:3 などもあるので 1:1 に固定されているのは少し不便ですね。他の画像にあわせて比率を変更したいときもあると思います。
※使用されている画像が正方形にトリミングされたものなので表示される部分が増えることはありません。
この記事で紹介するのは、
「カテゴリー記事一覧」の画像比率を変更するカスタマイズ
です。
このカスタマイズはショートコード「カテゴリー記事一覧(新着順)(ランダム順)(ランク順) 」の全てに適用されるのでご注意ください。
それ以外にも影響が出る可能性があるよ
カスタマイズは自己責任でよろしくな
THE THOR カテゴリー記事一覧 の画像を16:9にするカスタマイズ
以下のCSSを追加CSSにコピペ。
操作手順
外観 → カスタマイズ → 追加CSS
外観 → カスタマイズ → 追加CSS
アスペクト比 16:9 の場合
.content .archiveScode .eyecatch-11:before {
padding-top: 56.25%;
}
アスペクト比 4:3 の場合
.content .archiveScode .eyecatch-11:before {
padding-top: 75%;
}
以上でカスタマイズか完成です。
カスタマイズのサンプル画像
-
- 16:9
-
- 4:3
不具合があったらコメントで教えてほしいのだ
なんせ自サイトでしかテストできんからなぁ
CSSは初心者向け書籍とネット情報で十分に学ぶことができます（体験談）
あとがき
アスペクト比を変更すると縦幅が狭くなるので横に並ぶタイトルや抜粋とのバランスが難しくなります。それでも「出来ないよりは出来た方が良い」かな？
選択肢が増えるのは良いことだと思います。興味のある方はお試しください。
ではまた次回のカスタマイズでお会いしましょう！
