Liquid、JavaScriptなどに関する質問
テーマ「minimal 」を使用しています。
トップページのセクション「コレクションリスト」ですが、1行あたりのコレクション数を8にしたいです。また、その行数を10程度に増やしたいです。どなたか助けてください。
I am using the theme "minimal". In the section "Collection list" on the top page, I want to set the number per line to 8. I also want to have 10 rows. Please help someone.
通常、無料テーマはセクションに対応しているので、テーマ>カスタマイズ>コレクションに進むと、商品数や行数をGUI上で変えれるかと思います。
ありがとうございます。
minimalのテーマでは、該当のセクションは
一行に5個まで、そして行数は変えられないのです。
なので困っております。。
TOPに表示される、featured collectionであれば、変更できました。
1. section/featured-collection.liquidをコード編集で開く
2. "id": "num_per_row" と、 "id": "num_rows", の "max": の値を希望するものに変える(ここが1行の表示数と最大行数の設定を実現している箇所です)。
3. 保存して、テーマのカスタマイズでセクションにいき、featured collectionを表示すると、添付のようにスライドバーで8と10が選べるようになるので設定して保存します。
ただし、これだけだと逆に何も表示されなくなってしまいます。理由は以下のように、Minimalは、表示数で場合分けしてスタイルを変更しているので、元々ある数値以外は条件になくて、表示処理自体実行されなくなります。
{% case products_per_row %} {% when 3 %} {% assign grid_item_width = 'medium--one-third post-large--one-third' %} {%- assign product_width = 410 -%} {% when 4 %} {% assign grid_item_width = 'medium-down--one-half post-large--one-quarter' %} {%- assign product_width = 335 -%} {% when 5 %} {% assign grid_item_width = 'medium-down--one-half post-large--one-fifth' %} {%- assign product_width = 335 -%} {% endcase %}
ですので、とりあえずその他としてelseを追加してみます。
{% case products_per_row %} {% when 3 %} {% assign grid_item_width = 'medium--one-third post-large--one-third' %} {%- assign product_width = 410 -%} {% when 4 %} {% assign grid_item_width = 'medium-down--one-half post-large--one-quarter' %} {%- assign product_width = 335 -%} {% when 5 %} {% assign grid_item_width = 'medium-down--one-half post-large--one-fifth' %} {%- assign product_width = 335 -%} {% else %} {% assign grid_item_width = 'medium-down--one-half post-large--one-tenth' %} {%- assign product_width = 100 -%} {% endcase %}
結果として、添付のように1行に元々設定可能な数以上表示されました。
ただし、テーマのコードを見る限り、Minimalは、表示数がデザインに深く影響する設計のようですので、現状の最大値に意味があると思います。
ご希望の数を表示したい場合は、素直にその数を対応している別のテーマを使われた方が無難だと思います。
ご丁寧にありがとうございます!!!
確かに影響が怖いので、他のテーマを探してみます。
でも非常に助かりました!
感謝いたします!
リエンゲージメントの自動化で売り上げ向上へ!素敵なオンラインストアを作成し、見込み顧客の携帯へ広告を直接に送信する、またはSNSなどで宣伝すると、お客様がストアに行き着...
By Mirai Mar 24, 2024Shopifyは世界で最も革新的なブランドと起業家をサポートしています。個人起業家やあらゆる規模のビジネスの成長を後押しするために、Shopify アカデミーではShopif...
By SarahF_Shopify Mar 22, 2024オンラインストア運営はとてもやりがいのある活動です。新しい注文が入った時の喜びや世界中のお客様とやりとりできる可能性、商品に対して最高のレビューをもらった時の満足感は、毎日の...
By Mina Mar 13, 2024