Wie kann ich ein Product-Template ansprechen?

Deutsch Diskussion Technische Fragen & Antworten
1

Hallo zusammen,

ich würde gerne bestimmte Dinge ausblenden, wenn ein Produkt ein bestimmtes Template zugeordnet ist. Was ich in der theme.css.liquid probiert habe:

{% if template_suffix == 'product.preorder' %} 
  .product_inventory {
    display: none;
  }
  {% endif %}

Aber hier passiert nichts..

Diesen Snippet habe ich noch in der product-form.liquid gefunden. Kann ich es vielleicht hier reinbasteln?

{%- liquid
      assign default_text = 'products.product.add_to_cart' | t
      assign button_text = 'products.product.add_to_cart' | t
      if template == 'product.preorder'
        assign default_text = 'products.product.preorder' | t
        assign button_text = 'products.product.preorder' | t
      endif
      unless current_variant.available
        assign button_text = 'products.product.sold_out' | t
      endunless
    -%}

Grüße

Robb

2

@PinkybreakShop – die css-Datei wird ja als “externe” Datei inkludiert. Damit hat die keinen Template-Kontext, aus dem Du as Suffix oder andere Parameter ableiten könntest.

Wenn du’s so machen magst, kannst Du eine eigene CSS-Datei anlegen, und diese in der theme.liquid nur dann inkludieren, wenn die von Dir genannte if-Abfrage true ergibt.

Alternativ kannst Du (und das ist der Weg, wie’s oft gemacht wird), eine CSS Klasse mit dem Template-Namen (z.B. template-product-preorder) auf den Body-Tag legst – das kannst Du mit Deiner if-Abfrage ja beeinflussen. Die betreffenden Regeln im CSS kannst Du dann mit den Selektor body.template-product-preorder scopen; z.B. so:

body.template-product-preorder h1 {
  font-family: "Comic Sans MS";
}

LG, Mario

3

Hey - danke für die Antwort.

ich habe jetzt so viel probiert, dass ich maximal verwirrt bin :slightly_smiling_face:

Also Variante 1 wäre: ich lege unter Assets ein neues asset an. Dort schreibe ich die CSS rein, die kommen soll, wenn die if abfrage true ergibt.

Die if Abfrage mache ich in die theme.liquid? Oder in der product-form.liquid? Wie spreche ich dort meine CSS Datei an?

{%- if template == 'product.preorder' -%}
...?
{%- endif -%}

Und Variante 2:

Wo genau soll ich den Codeschnipsel einfügen? Ich hab es mal testweise in die theme.liquid gesetzt, da passiert nichts.

Dann habe ich es in die theme.css.liquid eingefügt. Auch hier nichts. Wenn ich es so einfüge, funktioniert es für “normale” Produkte und auch nur mit der h1, nicht mit dem gewünschten Attribut:

.template-product h1 {
  font-family: "Comic Sans MS";
}

So nicht:

.template-product .product_inventory {
 display: none;
}

Scheinbar fühlt sich das preorder Produkt nicht angesprochen..

Danke & Gruß

Robb

4

Wurde im anderen Thema gelöst. Kann hier also geschlossen werden. Danke!

1 Like