PR

【WordPressテーマCocoon】おすすめカードの設定と使い方

Cocoonの「おすすめカード」は、画像付きのおすすめメニューをテーマ内の好きな位置に挿入でき、見て欲しい記事のリンクやカテゴリーを設定することができます。
今回は、Cocoonの「おすすめカードの設定と使い方」についてご紹介します。

完成形ヘッダー下
WordPress Cocoon ヘッダー下
完成形サイドバー
WordPress Cocoon 完成形サイドバー
スポンサーリンク

おすすめカードの設定と使い方(動画)

「おすすめカードの設定と使い方(動画)」は、こちら

スポンサーリンク

おすすめカードの設定

メニューの作成

メニューの選択

WordPress管理画面から「外観→メニュー」を選択します。

WordPress Cocoon  メニュー

新規メニューの作成

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

WordPress Cocoon 新規メニューの選択

「メニュー名」を入力して「メニューを作成」ボタンを押します。

WordPress Cocoon 「メニューを作成」ボタン

メニュー項目の追加

「メニュー項目を追加」からおすすめカードを作成したいメニューを選択していきます。

WordPress Cocoon おすすめカードメニュー

全ての入力を終えたら「メニューを保存」ボタンを押します。

おすすめカードの使い方

おすすめカードの設置(ヘッダー下)

おすすめカードタブの選択

WordPress Cocoon おすすめカードタブ

おすすめカードの設定画面の表示

WordPress Cocoon おすすめカード設定画

おすすめカードの設定

おすすめカードの表示
WordPress Cocoon おすすめカードの表示

表示方法を選択します。

WordPress Cocoon おすすめカードのリスト
メニュー選択
WordPress Cocoon おすすめカードメニュー

先ほど作成したメニュー「おすすめカード」を選択します。

メニューリスト
表示スタイル

マウスカーソルを当てると、イメージが表示されますので、お好きなスタイルを選択します。

WordPress Cocoon おすすめカード表示スタイル
カード余白

お好みでチェックして下さい。

WordPress Cocoon おすすめカード余白
カードエリア左右余白

お好みでチェックして下さい。

WordPress Cocoon おすすめカード左右余白

おすすめカードの設定完了

WordPress Cocoon おすすめカード設定完了

おすすめカードの設置(サイドバー)

ウィジェットの選択

WordPress Cocoon ウィジェット

ウィジェットの設定

タイトルの入力
WordPress Cocoon おすすめカードタイトル
メニュー名

先ほど作成したメニュー「おすすめカード」を選択します。

WordPress Cocoon おすすめカードメニュー名

留意:
ウィジェットの場合は、2列で表示されますので、おすすめカードのメニューを作成される場合は、偶数となる様に作成するのが良いでしょう。(ベストは4つ)

表示スタイル
WordPress Cocoon おすすめカード表示スタイル
余白を有効にする
WordPress Cocoon おすすめカード余白

全ての入力を終えたら「メニューを保存」ボタンを押します。

ウィジェットの設定完了

WordPress Cocoon おすすめカード設定完了

おすすめカードの設定時の注意

おすすめカードは、投稿記事や固定ページ、カテゴリー等を選択してメニューを作成して、そのメニューを好きな位置に挿入するのですが、投稿記事は、アイキャッチ画像を登録していると思いますが、固定ページやカテゴリーページ等には、あまり設定されていないかと思います。
おすすめカードは、画像付きのおすすめメニューを好きな位置に挿入できるという機能の為、画像が登録されていないとおすすめカードに画像表示がされませんので、ご注意下さい。

現象

メニューを作成して「おすすめカードの設定」をしたが、おすすめカードに画像が表示されない。

<ヘッダー下>

WordPress Coconn ヘッダー下のおすすめカード

<サイドバー>

WordPress Cocoon サイドバーのおすすめカード
原因

カテゴリーページや固定ページにアイキャッチ画像が登録されていない

WordPress Coconn おすすめカードのメニュー

「暮らす」のカテゴリーに画像が登録されていない。

WordPress Cocoon カテゴリーのアイキャッチ画像
対応

カテゴリーにアイキャッチ画像を登録します。

WordPress Cocoon カテゴリー
結果

おすすめカードがキチンと表示されました。
<ヘッダー下>

WordPress Cocoon ヘッダー下のおすすめカード

<サイドバー>

WordPress Cocoon サイドバーのおすすめカード