Shopifyバウンダリプロダクトコレクション以外の商品画像

Question

バウンドレステーマコレクション製品グリッド内に静的な非プロダクトイメージを挿入して、ちょっとチョップして衣料品店に余分なビジュアルコンテンツを追加したいのですが。

挿入画像が不規則に美的な理由のために配置する必要があるPROD1、PROD2、PROD3、NonProd1、Prod4、Prod5、NonProd2、Prod6、Prod7等

の線に沿って何かをするので、ここでそれらの制御座っておくと便利です。

collection.liquidや他のテンプレートを変更または置き換えてこれを達成する方法はありますか？流動的なファイルからは、私はループ状のシステムがあると思われますが、残念ながら私はそれを理解できません。

私のコレクションのサイズは変わりません。コレクションごとに異なる液体テンプレートが用意されています。

私は微調整と改造無限のテーマを私が欲しいものを得るために、そしてある日、私は木材を再び開始するつもりだけど、今のところ、これは少し私を超えている...

感謝してきました助けを求めて

Answer 1

コレクションテンプレートはforループを使用しており、forループの内部では現在の反復番号を返すforloop.indexにアクセスできます。

コレクションファイルの中に次のものを追加できます。

{% if forloop.index == 4 %} 
    <div class="non-product"> 
     <img src="SRC" alt=""> 
    </div> 
{% endif %} 

あなたはこのをより細かく制御したい場合は、数4のテーマの設定オプションを設定することができますし、コードから毎回それを変更する必要がないようにテーマ設定パネルからそれを変更します。

Answer 2

実際には、どのように管理したいのか、具体的に達成したいのかによっていくつかの方法があります。

あなたは本当にあなたがconfig/settings_schema.jsonまたは/sections

を使用することができ、画像をキュレートしたい場合はあなたがする必要があるすべてがそうのようなあなたのスキーマ内の画像やimage_pickerを定義している：

{ 
    "type": "image_picker", 
    "id": "image_id", 
    "label": "Image" 
    }, 

そして、このような選択画像を参照することができます{{ settings.image_id }}

上記はサイト設定スキーマのセクションですが、セクションはほとんど同じですが、重要なニュアンスがあるので、読める価値があります完全に提供されたソース。

また、商品の紹介画像を表示したい場合は、コレクションのループを行うことができます。最も最近のものはコレクションのハンドルです。

{% for product in collections.most-recent.products %} 
    <a href="{{ product.url }}"> 
    {{ product.featued_image }} 
    </a> 
{% endfor %} 

あなたに利用可能なオブジェクトやタグがわからない場合早見はgo toです。