Supplyテーマを使ってトップページにコレクションを設定すしています。商品が一覧で並びますが、画像の⇔部分に説明文の一部を表示させたいです。どのようにすればいいでしょうか?
表示する文字数は三行くらいに調整したいです。
方法をご存じの方がいらっしゃれば教えていただきたいです。
よろしくお願いします。
目的:Supplyテーマのトップページのコレクション一覧で、画像付近に商品説明の一部を表示し、文字数を3行程度に調整したい。添付画像で表示位置が示されている。
対応方法:管理画面で「アクション」→「コードの編集」を開く。Snippetsフォルダのproduct-grid-item.liquidで{{ product.title }}を見つけ、その直下に説明文出力コードを追記。
技術要点:Liquidのフィルタを使用。
記述例:{{ product.description | strip_html | truncate: 100 }} を {{ product.title }} の直下に追加。
結果:実装は正常に反映。依頼者が動作確認済みで、文字数調整も把握。議論は解決済み。
管理画面にログインして、「アクション」→「コードの編集」と進み、Snippetsフォルダ内のproduct-grid-item.liquidファイルを選択してください。
{{ product.title }}
というコードを探して、その下に以下のようにコードを追記して保存してください。
{{ product.title }}
{{ product.description | strip_html | truncate: 100 }}
100という数字が表示される文字数を指定しています。ここの数字を変更することで、任意の文字数を表示できます。
教えていただいた通り入力してみました。
うまく反映できました!ありがとうございます!!
数値の設定方法も教えていただき助かりました!