YARPPのサムネイルの画像サイズの変更

サムネイルの画像変更

YARPP のサムネイルは120ｘ120で固定されており、変更することはできません。wordpressのサムネイルは150ｘ150なので関連ページの画像表示は縮小表示されてしまうので荒くなってしまいます。

ぎょぴグループのサイトはマガジン形式のテーマを使っているサイトが多くサムネイルは長方形なので左右に圧縮されて表示されてます。

そこでCSSに下記のコードを追加してます。

/* 関連記事 (YARPP)  */
.yarpp-thumbnail > img, .yarpp-thumbnail-default {
width: 横サイズ !important;
height: auto !important;
}
.yarpp-thumbnails-horizontal .yarpp-thumbnail {
max-width: 横サイズ !important;
height: auto !important;
}

もとのサムネイル画像によって表示される大きさは変わってしまいますが、きれいに表示されていると思います。

こちらのサイト参考にさせていただきました。

モバイル・スマホ・HTML5のSEO塾.com

 

1 Share

1 User

2 Pockets

YARPPカスタマイズ WordPress関連記事サムネイル/アイキャッチ（横長）と画像設定 ...

https://www.seojuku.com/blog/thumbnail-yarpp.html

WordPressではアイキャッチ、一般的にはサムネイル。この画像ビジュアルをスマホ時代のサイトで活用したいが、YARPPをカスタマイズするときはハードルも高い。また使用のWordPressテーマにも制約される。