技術的なQ＆A

curry313 · ‎04-01-2022

DAWNテーマを使用しています。

「ホーム」のセクション「特集コレクション」および「コレクションページ」それぞれ一覧で表示される商品の【販売元】部分について、文字数を１０文字程度に変更したいです。

ご存じの方いらっしゃればご教授いただければ幸いです。

株式会社フルバランス · ‎04-01-2022

Liquidで出力する内容に対して文字数の制限を行う場合、truncateフィルターを使用します。

Dawnテーマの一覧部位に表示される商品は、共通して「product-card.liquid」というファイルを参照しています。

販売元の出力はデフォルトの状態なら24行目「product_card_product.vendor」という部分ですので、該当箇所を以下のように変更をしてください。

<div class="caption-with-letter-spacing light">{{ product_card_product.vendor |truncate : 13 }}</div>

上記コードで販売元の名称が10文字以上だった場合、「XXX…」のような形で表示されるようになります。

参考：Shopifyコレクションの商品一覧表示で単語(truncatewords)、文字数(truncate)の制限をかける方法

株式会社フルバランス（Shopify Experts）
Shopify専門のEC成長支援会社です。ECの技術・実務・成長、お悩みのことがあれば、気軽にご相談ください。
『すべてのブランドの特大成長エンジンを搭載する』株式会社フルバランス

株式会社フルバランス · ‎04-01-2022