# Dawnテーマでのランキングバッジ表示のためのコード編集

**URL:** <https://community.shopify.com/t/dawn/275307>\
**Category:** 技術的なQ＆A\
**Tags:** css, html\
**Created:** [December 7, 2023, 7:59am UTC](https://community.shopify.com/t/dawn/275307 "2023-12-07T07:59:17Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

Dawnテーマのトップ画面に、1位・2位などのランキングバッジ付きで商品を表示しようとしているが、参考コードを編集しても任意のコレクションが正しく紐づかず、サンプル画像・商品名・価格が表示されてしまう問題が発生。

**投稿者の状況:**
- コードの知識が少なく、初歩的なミスや不足情報がある可能性を認識
- 参考リンクが途中で文字化けしており、正確な情報源が不明

**提案された解決策:**
UnReact社の西川氏が、ノーコードでランキングバッジを挿入できるアプリ「シンプルランキング表示|お手軽ベストセラー」を代替案として紹介。高いデザイン性を持ち、コード編集不要で実装可能。

**現状:**
具体的なコード修正方法や技術的な解決策はまだ提示されておらず、質問は未解決のまま。

<div class="post-metadata">

**Author:** ![Ayane](https://avatars.discourse-cdn.com/v4/letter/a/ac91a4/32.png) [@Ayane](https://community.shopify.com/u/Ayane)\
**Post date:** [December 7, 2023, 7:59am UTC](https://community.shopify.com/t/dawn/275307/1 "2023-12-07T07:59:17Z")

</div>

お世話になっております。

テーマDawnを使用しており、トップ画面にランキングの表示を1位、2位などのバッジ付きで表示したく

下記を参考にコード編集しましたがどうしてもカタログに任意のコレクションが紐づかないのか

サンプルの画像と商品名、価格が出てしまいます。

[https://community.shopify.com/topic/1846951](https://community.shopify.com/topic/1846951)

コードの知識が少なく、

---

<div class="post-metadata">

**Author:** ![Ayane](https://avatars.discourse-cdn.com/v4/letter/a/ac91a4/32.png) [@Ayane](https://community.shopify.com/u/Ayane)\
**Post date:** [December 7, 2023, 1:30pm UTC](https://community.shopify.com/t/dawn/275307/2 "2023-12-07T13:30:45Z")

</div>

なぜか途中で切れておりました。申し訳ございません。

コードの知識が少なく、もしかすると初歩的なところで躓いていたら申し訳ございません。

解決に必要な情報が不足しておりましたらご指摘ください。

---

<div class="post-metadata">

**Author:** ![Nishi\_3](https://avatars.discourse-cdn.com/v4/letter/n/8c91f0/32.png) [@Nishi\_3](https://community.shopify.com/u/Nishi_3)\
**Post date:** [August 7, 2024, 8:25am UTC](https://community.shopify.com/t/dawn/275307/3 "2024-08-07T08:25:52Z")

</div>

はじめまして

株式会社UnReactの西川と申します。

弊社のアプリ「[シンプルランキング表示｜お手軽ベストセラー](https://apps.shopify.com/sa-022-ur-ranking-app?locale=ja)」も有効な解決策の一つとしてご紹介させていただきます。

 ![CI_ciLKxu4QDEAE=.webp](https://canada1.discourse-cdn.com/shopifyforum/original/3X/a/4/a4756f8431ae73581a7d54b978e1a4cdd2317110.webp)

高いデザイン性のランキングバッジをノーコードで挿入できるアプリです。

 ![CLn78u-ru4QDEAE=.webp](https://canada1.discourse-cdn.com/shopifyforum/original/3X/5/0/50547e5eaf14df84f0188f7ff75c9050121c26a5.webp)

下記、参考情報です。

[シンプルランキング表示｜お手軽ベストセラー](https://apps.shopify.com/sa-022-ur-ranking-app?locale=ja)

[Shopifyにランキングバッジを導入するアプリについて徹底解説｜ご利用ガイド](https://unreact.jp/shopify-apps/sa-022-ur-ranking-app/guide)

その他にも 45 個の Shopify アプリを開発しているので、ストア運用の際に参考にして頂ければ幸いです。

[参考アプリ一覧](https://apps.shopify.com/partners/unreact5?locale=ja&page=1)
