\ポムミーの代わりはペライチ/

12月末でポムミーのサービスが終了します!

乗り換えがまだの方はペライチで無料作成
ブログクエスト カテゴリから記事を探す

Cocoonで記事一覧をタイトルのみ表示にしてスッキリ!説明文(抜粋文)を非表示にする方法

Cocoonカスタマイズ記事一覧をタイトルのみにする方法 ブログデザイン
Cocoonカスタマイズ記事一覧をタイトルのみにする方法
この記事は約3分で読めます。

この記事では、Cocoonの記事一覧に出ている説明文(抜粋文)を非表示にしてタイトルだけ表示する方法をご紹介いたします。

自分のブログトップページを見ていると、ベテランブロガーさんのブログよりごちゃごちゃしていて見ずらいなんてご経験ありませんか?

よくよくベテランブロガーさんのサイトを見てみると、記事一覧にタイトルしか表示していない(抜粋文が非表示)方が大半という事実が発覚!(例:クロネさんサルワカさんヒトデさん

今から記事一覧をタイトルのみにする方法をご紹介しますので、3分でブログトップをスッキリさせましょう。

\こんな方におすすめ/

  • アイキャッチ画像に文字が入っている方
  • アイキャッチ画像のサイズがそろっている方
  • ブログトップがごちゃごちゃしてなんだか気に食わない方
Cocoonの記事一覧をタイトルのみにする(ビフォー・アフター)
Cocoonの記事一覧をタイトルのみにする(ビフォー・アフター)
スポンサーリンク

記事一覧をタイトルのみ表示する方法

ダッシュボード > Cocoon設定インデックス をクリック。

記事一覧をタイトルのみにする設定
記事一覧をタイトルのみにする設定


投稿関連情報の表示という項目にスニペット(抜粋)の表示という項目があるので、ここの✅を外してください。

これでPCから見た時の表示はタイトルだけになります。

もし、スマホ端末だけ抜粋文を表示したくない方は、スマホ端末でスニペットを表示の✅を外して、上のスニペット(抜粋)の表示には✅を入れておいてください。

記事一覧をタイトルのみ表示にしたらこんな感じになります

記事一覧をタイトルのみに表示したら、次のように大変すっきりした見栄えになりました。

まずはPC表示のbefore & afterをご紹介します。

PC表示で見た時のbefore & after

記事一覧をタイトルのみにする方法(before)
記事一覧をタイトルのみにする方法(before)

クリックすると大きい画像で表示されます。

記事一覧をタイトルのみにする方法(after)
記事一覧をタイトルのみにする方法(after)

わかりますかね、この文字の少なさ!

ブログトップがかなりすっきりした上に、1スクロールで見える記事の数も多くなりました。

当ブログのように、アイキャッチ画像に文字が入っていて、読者に訴えかけるような見出しがある方は抜粋文を省くのをお勧めします。

スマホ表示で見た時のbefore & after

Cocoonの記事一覧をタイトルのみにする(ビフォー・アフター)
Cocoonの記事一覧をタイトルのみにする(ビフォー・アフター)


左がbefore、右がafterです。

こちらもPC表示の時と同様、1スクロールで見える記事の数が増えました。

もし私のブログのように2列表示にしたい方や、スマホ表示の時だけ見やすく大きいカードで表示したいなどの設定を変更したい方はこちらをご覧ください。

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