Wacomより「macOS10.14.5にアップデートするとタブレットが動作しなくなるトラブル」 公式FAQペイントソフト CLIP STUDIO PAINT 無料体験版のダウンロード

賢威7.1人気記事(PV数ランキング)の画像サイズを変更する

木漏れ日

注意
※現在はこのブログでは賢威7.1は使用していませんが、使用していた頃に行なったカスタマイズです

賢威7.1のPV数ランキング(人気記事)の画像は、デフォルトだとアイキャッチ画像が正方形で出てきます。
(背景画像+テキストのリストは例外)

が、かなり前(おそらくテーマ変更前)にアップロードしている画像の場合は横長で出てきていました。

この画像のサイズの違いはずっと気になっていたのですが、変え方もわからないしと放置していました。

しかし先日『シンプルなリスト』だったPV数ランキングを『画像+テキストのリスト』にしてみると、

画像が大きくなったせいで縦の長さが揃っていないのが目立つ」&「正方形ではスペースを取り過ぎる」という事態に。

ということで、元の画像が横長が多いのだから横長で揃えたい、と試してみました。

画像のサイズを揃える

ここで「元々はこんな感じでした」と出せれば良いのですが、あいにく画像が残ってはおりません。
(元々写真とか撮るタイプの人間ではないので、こんなところで弊害が出ています)

画像のサイズが揃っていないのは、テーマを変更したことでサムネイル画像の設定が変更されたため、その前にアップロードした画像と後にアップロードした画像で違う設定が適用されているのだと思われます。

画像を揃えるためにサムネイルを作成し直すプラグイン「Regenerate Thumbnails」を利用してみます。

これは賢威7導入マニュアルで紹介されているプラグインです。

パソコン画像サイズを統一するために便利なプラグイン「Regenerate Thumbnails」

このプラグインを試すと、なるほど画像のサイズは揃いました。

・・・すべて正方形に。
(・・・長方形に・・・したかったんですよ・・・)

という訳で、このプラグインによる画像の再作成は画像サイズを決めた後にやらなければなりません。

賢威デフォルトのPV数ランキング(人気記事)の画像

気を取り直して、続けます。

賢威にテーマ変更した後にアップロードしたり、プラグインでサムネイルを作成し直したりした画像の場合、PV数ランキング(人気記事)は下のようになります。

順番に「王冠アイコンのリスト」「シンプルなリスト」「画像+テキストのリスト」です。
(画像は縮小しています)

人気記事王冠人気記事シンプルリスト人気記事 画像+テキスト

こんなにスペース取らなくていいんだよ・・・と言いたくなります。

画像のサイズを変更する

※以下は賢威マニュアルの「賢威7.1のfunctions.phpで設定可能な項目」内の「賢威で生成されるサムネイル画像の大きさを設定する」を参考にしてます。

画像のサイズを変更するには、「functions.php」の以下のようなコードを付け加えます。

このコードは「thumbnail」の変更なので、これを付け加えるとトップページのアイキャッチ画像に適用されます。

コード
add_filter( "keni_post_thumbnail_size", "set_keni_post_thumbnail_size", 10 ); 
function set_keni_post_thumbnail_size() {
 return array( 160, 160 );
}

PV数ランキング(人気記事)内画像の場合は、それぞれ違うサイズ(大中小等)の画像の変更になりますので、コードを少し変えます。

PV数ランキング(人気記事)で使用される画像サイズ

  1. 王冠アイコンのリスト⇒中サイズ(middle)
  2. メダルアイコンのリスト⇒中サイズ(middle)
  3. シンプルなリスト⇒極小サイズ(ss)
  4. 画像+ランキング番号のリスト⇒極小サイズ(ss)
  5. 画像+テキストのリスト⇒大サイズ(large)
  6. 背景画像+テキストのリスト⇒この方法では変更できません

サイズによるコードの変更は、3カ所ある「thumbnail」と、最後の「array(160,160)」の()内の横縦の数字を変えます。

大サイズの場合は「thumbnail」部分を「large」に、中サイズの場合は「middle」、小サイズの場合は「small」、極小サイズの場合は「ss」とし、「array( 160, 160 )」の()内の数字を変更したいサイズ(⁅横⁆,⁅縦⁆)にします。

※別の場所で設定してある部分(「画像+テキストのリスト」の横幅など)は変更されず、画像が拡大・縮小されます。

 

では、実際に変更してみます。

画像のサイズを知りたい時はChromeの拡張機能が便利です。

茂み画像サイズを知る|Google Chromeの拡張機能

王冠アイコンのリスト

元の画像サイズは200×200pxです。

人気記事王冠

王冠アイコンのリストの画像は中サイズが適用されるので、画像の中サイズ(middle)を変更して200×100にしてみます。

以下のコードを「functions.php」に加えます。

コード
add_filter( "keni_post_middle_image_size", "set_keni_post_middle_image_size", 10 );
function set_keni_post_middle_image_size() {
    return array( 200, 100 );
}

人気記事middle変更

下の「テスト2」が変更後アップロードした画像です。200×100pxとなりました。

上は変更前にアップロードした画像で、100×100pxになりました(小さくなったのは別の場所で何らかの設定をしてあるのだと思います)

シンプルなリスト

元の画像サイズは100×100pxです。

極小(ss)の画像サイズを変更して100×50pxとし(コードは上記を参照して変更してください)、「テスト2」のみ画像をアップロードし直してみます。

人気記事SS変更

画像+テキストのリスト

『画像+テキストのリスト』の元の画像サイズは320×320pxです。

人気記事

大(large)の画像サイズを変更して320×160pxとし(コードは上記を参照して変更してください)、「テスト2」の画像をアップロードし直します。

人気記事large変更

『画像+テキストのリスト』の場合、横幅320pxは別の場所で指定されているようです。

横幅を違うサイズにすると、拡大又は縮小されます。

画像を再生成する

前述したとおり、この画像に対する設定の変更は、変更後にアップロードした画像にのみ適用されています。

過去にアップロードした画像をすべてアップロードし直すのは大変なので、先程のプラグイン『Regenerate Thumbnails』で一括再生成します。

これで画像は自分で設定したサイズで揃います。

パソコン画像サイズを統一するために便利なプラグイン「Regenerate Thumbnails」

下は320×220pxで統一してあります。

人気記事完成

『最近の投稿』の画像サイズを変更する

『最近の投稿』をサムネイル付きにしている場合はこちらも変わります。

  1. シンプルなリスト⇒極小サイズ(ss)
  2. 画像+テキストのリスト⇒大サイズ(large)
  3. 背景画像+テキストのリスト⇒この方法では変更できません

 ※人気記事で何を選択しているかによって、適応サイズは変わることもあるようです。

 

『シンプルなリスト』の元の画像サイズは100×100pxです。

最近の投稿

極小サイズ(ss)を変更して100×50pxとし、「テスト2」のみ画像をアップロードし直してみます。

最近の投稿シンプルリスト

「テスト2」は100×50pxに変更されました。

変更の適用されていない「テスト」は50×50pxとなりました。

このような感じで色々試して好みのサイズにしてみてください。