[WordPress]Jetpackの"人気の投稿"に表示されるサムネ画像サイズを変更する

WordPressのJetpackプラグインが提供している"人気の投稿"ウィジットのサムネイル画像サイズを変更する方法です。変更を行うには、プラグインのプログラムとcssの変更が必要です。

変更方法

ここでは、サムネイルのサイズを120pxする方法を説明します。

まず、下記のコードでfunction.phpを用意し、フィルタを実行します。avatar_sizeの後の数字がサムネのサイズです。

// Jetpackのサムネイルイメージサイズを変更
add_filter('jetpack_top_posts_widget_image_options', function ($options) {
    $options['avatar_size'] = 120;
    return $options;
});

次に下記のcssを適用します。

.widget_top-posts .widgets-list-layout-blavatar {
  max-width: 120px;
}

サムネ画像に枠をつけたい場合は、以下のようにborderも指定すると良いです。

.widgets-list-layout img.widgets-list-layout-blavatar {
  max-width: 120px;
  border:1px solid #ccc;
}

これで、サムネイルのサイズを変更することができます。

Jetpackの"人気の投稿"ウィジットは、サムネイル画像をプログラムで生成しているため、生成するサイズをjetpack_top_posts_widget_image_optionsフィルタで指定しています。cssの変更だけでも画像は大きくなりますが、生成している画像が小さいと画像がぼやけてしまう為、フィルタでavatar_sizeの値も変更すると良いです。

Amazonでおトクに買い物する方法