# ナビゲーションメニュー、コレクションを設定。linklist.titleで表示させたコレクション名の横に、そのコレクションの画像を表示させたい。 **URL:** \ **Category:** 技術的なQ＆A\ **Created:** [May 24, 2022, 2:35pm UTC](https://community.shopify.com/t/linklist-title/123442 "2022-05-24T14:35:35Z")\ **Posts on this page:** 4\ **Page:** 1 ## AI-generated summary Shopifyのナビゲーション（linklist）で、各コレクション名（linklist.title）の横にそのコレクション画像（collection.image）を動的に表示したいという相談。画像例の添付あり。 解法はLiquid（Shopifyのテンプレート言語）で、linklistのfor文内に条件分岐を入れて画像を出力すること。image_urlとimage_tagフィルタを用いてレンダリング。 - link.type が 'collection_link' であること - link.object.image（コレクション画像）が設定されていること 提示されたロジックと関連ドキュメントの参照により、依頼者は問題を解決済みと報告。実装のポイント（条件の組み合わせ）が学びになった旨のフィードバックあり。 最新動向として、別参加者が「メニュー横に画像を出すテーマカスタムの依頼方法」についての案内を求めており、これにはまだ具体的な回答がなく、スレッドは一部継続中。
**Author:** ![hana5](https://avatars.discourse-cdn.com/v4/letter/h/d07c76/32.png) [@hana5](https://community.shopify.com/u/hana5)\ **Post date:** [May 24, 2022, 2:35pm UTC](https://community.shopify.com/t/linklist-title/123442/1 "2022-05-24T14:35:35Z")
表題に記載した通りですが、 現在PCではサイドバーにグロナビを表示させて、設定したコレクションを表示させています。 そのコレクションの横に、コレクションに設定した画像を表示させたいです。 ※linklist.titleにあわせて、collection.imageを表示させたいといった方がよいでしょうか。 ![side-bar.jpg](https://canada1.discourse-cdn.com/shopifyforum/original/3X/b/5/b5c48702bac6ab3447a029e2e742a81e074ca4dc.jpeg) 動的に上記のような対応は可能なものでしょうか、それとも１つ１つliタグでimgとテキストリンクを囲っていくしかないでしょうか。 恐れ入りますが、こちらご回答いただけますと幸甚です。 ---
**Author:** ![Jizo\_Inagaki](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/jizo_inagaki/32/149480_2.png) [@Jizo\_Inagaki](https://community.shopify.com/u/Jizo_Inagaki)\ **Post date:** [May 27, 2022, 2:03pm UTC](https://community.shopify.com/t/linklist-title/123442/2 "2022-05-27T14:03:03Z")
linklistのfor文の中で以下のようにすれば表示されるかなと思います。 ```markup {% if link.type == 'collection_link' and link.object.image %} {{ link.object.image| image_url: width: 150 | image_tag }} {% endif %} ``` linklisitから個別のlinkオブジェクトを取り出して扱う際に、以下両方が真であれば画像を出力するという流れとなります。 - link.typeで対象がコレクションオブジェクトか否か - 対象コレクションに画像が設定されているか否か 各部の詳細はドキュメントの以下などで確認ください。 参考: [https://shopify.dev/api/liquid/objects/linklist#linklist-links](https://shopify.dev/api/liquid/objects/linklist#linklist-links) [https://shopify.dev/api/liquid/objects/link#link-type](https://shopify.dev/api/liquid/objects/link#link-type) [https://shopify.dev/api/liquid/objects/link#link-object](https://shopify.dev/api/liquid/objects/link#link-object) [https://shopify.dev/api/liquid/objects/collection#collection-image](https://shopify.dev/api/liquid/objects/collection#collection-image) [https://shopify.dev/api/liquid/filters/html-filters#image\_tag](https://shopify.dev/api/liquid/filters/html-filters#image_tag) ---
**Author:** ![hana5](https://avatars.discourse-cdn.com/v4/letter/h/d07c76/32.png) [@hana5](https://community.shopify.com/u/hana5)\ **Post date:** [June 2, 2022, 11:42pm UTC](https://community.shopify.com/t/linklist-title/123442/3 "2022-06-02T23:42:41Z")
こちらお礼が遅れてしまい申し訳ございません。 おかげさまで解決することができました。 ありがとうございます！ - link.typeで対象がコレクションオブジェクトか否か - 対象コレクションに画像が設定されているか否か 上記を組み合わせることで実装できるというのも大変勉強になりました！ 重ねて御礼申し上げます。 ---
**Author:** ![plustech](https://avatars.discourse-cdn.com/v4/letter/p/aca169/32.png) [@plustech](https://community.shopify.com/u/plustech)\ **Post date:** [April 14, 2023, 1:36am UTC](https://community.shopify.com/t/linklist-title/123442/4 "2023-04-14T01:36:30Z")
こちらのメニューの横に画像を出すテーマのカスタムを依頼したいのですが、どのようにすればよいかご教授ください。よろしくお願い致します。