【STREETIST】アイキャッチ(サムネイル)を設定する方法

「【STREETIST】アイキャッチ(サムネイル)を設定する方法」のアイキャッチ画像

今回は、WordPressテーマSTREETISTでアイキャッチ(サムネイル)を設定する方法を解説します。

記事にアイキャッチを設定すると、以下の画像のように記事上や記事一覧に画像が表示されます。

※記事上のアイキャッチは非表示に設定することも可能です。

タイトル下に表示されるアイキャッチ

記事一覧に表示されるサムネイル

アイキャッチ画像の推奨サイズ

アイキャッチはコンテンツ幅800pxで表示されます。

iMacのようなRetinaディスプレイのPCでも綺麗に表示させたいなら1600pxの横幅で、縦は好きなサイズで設定してください。

サイトの表示速度を重視させるなら、800pxで設定してもいいでしょう。

画質を重視する場合の画像サイズ例

  • 1600px × 900px(16:9)
  • 1600px × 837px(SNSのアイキャッチによく使われる比率)

表示速度を重視する場合の画像サイズ

  • 800px × 450px(16:9)
  • 800px ×418px(SNSのアイキャッチによく使われる比率)

アイキャッチ(サムネイル)を設定する方法

アイキャッチを設定する項目は、記事投稿画面の右サイドバーにあります。

新エディター(ブロックエディター)と旧エディターでは表示のされ方が多少異なります。

ブロックエディターのアイキャッチ設定

クラシックエディターのアイキャッチ設定

「アイキャッチ画像を設定」をクリックすると、画像アップロード画面になります。

そこへ画像をドロップすると、画像がアップロードされてアイキャッチが設定できます。

画像をアップできたら、画像のプレビューと細かい設定が出てきます。

アイキャッチの代替テキストはテーマ側で自動で挿入されるので、ここでは特に設定しなくても大丈夫です。

画像がアップできたら、「アイキャッチ画像を設定」をクリックして完了です。

この記事を書いた人

WP Avenue開発者

WP Avenue開発者

WordPressテーマ「STREETIST」開発者です。
テーマの使い方やバージョン情報などを書いています。

WP Avenue | WordPressテーマ販売サイト

投稿者の記事一覧

コメント(2件)

  • アバター t.m より:

    テーマを購入し使用させていただいております。
    非常に扱いやすく、シンプルでとても気に入っています。

    一つ質問なのですが、
    Twitterなどでシェアする際のOGP設定について
    カスタマイズ>共通設定>画像関連設定>Twitter・Facebookなどのシェアに使われる画像
    の部分をオリジナル画像に変更してもOGPが変更されず
    デフォルトのままになります。

    これはどこで設定すれば改善しますか?
    お手数ですが、ご回答お願いいたします。

    • WP Avenue開発者 WP Avenue開発者 より:

      テーマのご購入誠にありがとうございます。

      OGP画像の変更を行ったのはシェアした後でしょうか?

      一度シェアした後ですと、キャッシュが残り変更が反映されません。

      以下の記事を参考に、変更の反映をお試しください。
      https://keyama.hatenablog.com/entry/2020/04/20/234253

      ご確認宜しくお願い致します。

コメントする

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

twenty + 10 =