ブログを作ってきて、嬉しい事がありました。
僕の書いた記事が人の役に立っていたのです。
こんなに嬉しいことはありません。
Twitterでリプをくださった方々、どうもありがとうございました!!
そしてこう思いました。

役に立った記事をサイト上部に固定表示したい、、
同じような思いをお持ちの方の、参考になれば嬉しいです。
【Cocoon】サイト上部に記事を配置する方法|おすすめカード

Cocoonのデフォルトでは、新しい記事から順番に、上からずらっと並んで表示されます。
↓このような表示です。

今回の記事を読むと、おすすめの記事をサイト上部に表示できるようになります。

多くの方に役立つ記事を目立つ場所に表示すると、誰かの役に立つサイトになります。
役に立てばサイトになれば、アクセス数も増えるでしょう。

読者さんも、サイト運営者も WIN – WIN だね!
Cocoonの設定をしよう

さっそく設定していきましょう。
Cocoon(コクーン)での設定となります。
メニューを作ろう
まず、メニューを作ります。
メニューって何?という方は、こちらも参考になるかと思います。

ダッシュボードより、「外観」➡「メニュー」をクリックします。

「新しいメニューを作成しましょう」をクリックします。

①メニュー名を入力します。
②「メニューを作成」をクリックします。

これでメニューが作成できました。
メニューにおすすめの記事を入れよう
作成したメニューに、おすすめの記事を入れます。
①「投稿」をクリックします。
②「すべて表示」をクリックします。
③ サイト上部に表示したい記事に✔を入れます。(表示上、4つ選ぶのがおすすめです。)
④「メニューに追加」をクリックします。

①ドラッグ&ドロップで、記事の並び順を決めます。
上の記事ほど左に表示され、下の記事ほど右に表示されます。
②「メニューを保存」をクリックします。

これで、メニューにおすすめの記事が入りました。
おすすめカードを表示しよう
メニューにおすすめの記事が入ったら、おすすめカードを表示しましょう。
「Cocoon設定」をクリックします。
「おすすめカード」をクリックします。

おすすめカードを表示する場所を決めよう
おすすめカードを表示する場所を選択します。
今回は「フロントページのみで表示」を選びました。

「おすすめカード」用のメニューを選択しよう
メニュー選択より、先ほど作成した「おすすめカード」を選択します。

表示スタイルを設定しよう
表示スタイルを選択します。
写真マークにカーソルを合わせると、プレビューが表示されますので、お好みのものを選択します。
今回は「画像のみ」を選択しました。

画像は「アイキャッチ画像」が表示されます。
余白の設定をしよう
「カード余白」と「カードエリア左右余白」はお好みで✔を入れます。
どちらも、写真マークにカーソルを合わせると、プレビューが表示されます。
「変更をまとめて保存」をクリックします。

これで、おすすめカードの表示ができました。
サイトを確認しよう

サイトにアクセスし、表示を確認しましょう。

おすすめの記事がサイト上部に表示されました。
まとめ:おすすめカードを表示して、サイト訪問者を必要な情報に案内しよう

サイトのトップページ上部は、読者さんを迎える玄関のような場所ですね。
お客様を迎えるにあたり、必要な情報にたどり着きやすいように、おすすめカードを配置できると良いと思います。
さいごに、この記事のポイントをまとめます。
- おすすめカードを表示すると、おすすめの記事をサイト上部に表示できる
- おすすめカードの表示に先駆けて、記事とメニューを作成する
- サイト訪問者が、必要な情報にたどり着きやすいように配置できると良い

サイト運営者が見てもらいたい記事を表示しておくのも良いかもしれないね!

記事の種類が増えてきたら、カテゴリを表示するのも良さそうだよ。
様々な使い方ができると思います。ぜひお試しください。
コメント
コメント一覧 (2件)
はじめまして、みけねこといいます。
Twetterフォロワーさんのブログを訪問しています。
無料WordPressテーマCocoonでも色々な装飾ができるんですね。
無料テーマもだいぶ機能が増えてきた印象ですね(^^)/
ブログ頑張って下さいね(^^)/
みけねこさん、はじめまして。
ご訪問いただきまして、どうもありがとうございます。
そして、コメントをどうもありがとうございました。
はじめてのコメントをいただけて、とても嬉しいです。
ブログ頑張ります!