ブログで商品やサービスの比較記事を書きたいときに便利なのが
Cocoonのランキング機能です。
初心者さんでも、画像と説明文を登録するだけで
“おすすめランキングボックス” が簡単に作れます✨
この記事では、はじめての方でもさーばーように
ランキングの作り方 → 記事への表示方法
までやさしく紹介します。
１．Cocoonランキング機能とは？
Cocoonには、
✔ 人気記事ランキング
✔ おすすめ商品ランキング
✔ サービス比較ランキング
などをキレイに表示できる機能が最初から入っています。
ポイントはここ👇
| 特徴 | 内容 |
|---|---|
| デザインが整っている | 画像・バッジ・ボタン付きで見やすい |
| アフィリエイトに使いやすい | 公式サイトボタンにリンクを設定できる |
| ブロックで簡単に挿入できる | 初心者でも安心 |
読者が選びやすくなるので、
クリック率や成約率アップにもつながります📈
２．ランキングを作る（中身を登録）
STEP１：ランキング画面を表示
1️⃣ WordPress管理画面→ Cocoon設定→「ランキング」 をクリック
（※独立メニュー or Cocoonメニュー配下）
STEP２：「新規追加」をクリック
2️⃣ ランキング一覧 → 新規追加 をクリック
STEP３：
3️⃣ ランキング名（管理用）を入力
例：おすすめサーバーランキング
4️⃣ 「項目（アイテム）」を追加
→ ランキングに載せたい商品やサービスを登録
各項目で入力する内容👇
- ラベル（1位 / 2位 など）
- タイトル（名前）
- 画像（ロゴやバナー画像）
- 説明文
- ボタンテキスト
- リンクURL（アフィリエイト可）
5️⃣ 入力が終わったら → 公開
これでランキング完成です✨
３．ランキングを記事に表示する方法
２つの方法があります👇
「ブロックから追加する方法」と「ショートコードを使う場合」があります。
「ブロックから追加する方法」を覚えていたらOKです。
🧱②ブロックから追加する方法（初心者向け）
- 記事編集画面で「＋」をクリック
- Cocoonブロック → ランキング を選択
- 挿入したいランキングをプルダウンから選択
視覚的に選べるので安心😊
🎨デザインを整えるポイント
初心者さん向けにおすすめの設定👇
| 項目 | コツ |
|---|---|
| タイトル | 短くシンプル |
| 画像 | 正方形 or 横長の高品質画像 |
| 説明文 | 2〜3行まで |
| ボタン文言 | 公式〇〇はこちら のように明確 |
スマホでもバランス良く表示されます📱✨
💡アフィリエイトで使うときの注意
- 必ず承認済みのリンク を使用する
- 広告であることがわかるようにする
- 比較は読者目線で行う
例：
「初心者に優しいサーバー」「料金が安い」「高速表示」
読者のメリットを明確に伝えるほど成約に繋がりやすいです💴✨
🚫表示されないときの対処
- 公開状態になっているか？
- id番号が間違っていないか？
- キャッシュを削除したか？
これで解決することが多いです👌
🌱まとめ：ランキングでわかりやすい記事に！
| やったこと | 効果 |
|---|---|
| ランキング作成 | 比較が伝わる |
| 記事に表示 | 行動導線が生まれる |
| 画像＋ボタン設置 | クリック率アップ |
読者の「どれがいいのかわからない…！」を解消
→ 信頼されて買われるブログに育ちます✨
