Cocoonのアイキャッチ画像の設定場所

Cocoon
  • 記事タイトルの下にアイキャッチ画像を表示させたい
  • 表示させた画像は、横幅いっぱいに表示させたい
  • 横幅が100%までいかないのなら、せめて中央表示させたい

これがCocoonのアイキャッチ画像設定への私の希望です。

記事の編集画面には記事個別のアイキャッチ画像の設定場所がありますが、そこに画像を設定するだけでは思ったように表示してくれませんでした。

タイトル下には表示してくれましたが、横幅いっぱいではなくしかも左端によってました( ̄▽ ̄;)

そら
そら

この記事では同じ不満をもった方に、アイキャッチ画像の設定について紹介します(^^♪

Cocoonのアイキャッチ画像♪記事タイトル下の表示/非表示を設定

「Cocoon設定」→「画像」タブの順にクリックしてください。

本文画像設定で設定します。

「アイキャッチの表示」項目が設定をする場所になります。

アイキャッチを表示させたい時は「本文上にアイキャッチを表示する」にチェックをいれてください。

Cocoonのアイキャッチ画像♪記事タイトル下の中央に表示させたい

「アイキャッチの表示」項目が設定をする場所になります。

アイキャッチを表示させたい時は「アイキャッチの中央寄せ」にチェックをいれてください。

Cocoonのアイキャッチ画像♪記事タイトル下で横幅いっぱいに表示させたい

「アイキャッチの表示」項目が設定をする場所になります。

アイキャッチを表示させたい時は「アイキャッチをカラム幅に引き伸ばす」にチェックをいれてください

Cocoonのアイキャッチ画像♪設定してない時に表示さる画像

下にスクロールして「NO IMAGE設定」で画像を指定します。
この画像が、アイキャッチ画像を設定していない記事のサムネイル画像になります。
(一覧表示の時などに表示されます)
この画像は、サムネイル(正方形)で表示されます。
16:9の画像サイズでも中心の長方形部分に画像がちゃんと表示されている画像がおすすめですね。

Cocoonのアイキャッチ画像設定したのに検索表示の画像が変わってない場合

アイキャッチ画像を変更設定しているのに、以前に指定した画像が表示されているという場合は、キャッシュが原因の場合がありますので、キャッシュを削除してみてください。

Google chrome の場合は 「設定」→「プライバシーとセキュリティ」の「閲覧履歴データの削除」を実行してみてください。

Cocoonのアイキャッチ画像の設定場所 まとめ

アイキャッチ画像についての私が調べて設定した内容を記事にしました。
最後まで読んでくれてありがとうございます(^^♪

コメント

タイトルとURLをコピーしました