Button bei ausverkaufen Artikel

[TL-Andi]

Hallo zusammen,

ich habe ein gekauftes Theme mit dem ich auch echt zufrieden bin, doch eine Sache stört mich.

In der Mobilenansicht werden bei der Kategorieansicht die Produkte die verfügbar sind ein Button für den Warenkorb angezeigt und bei den ausverkauften wird dort nichts angezeigt. Ich möchte aber gerne das dort dann einfach Ausverkauft als Buttonform steht.

Laut dem Themeherstellen soll ich das in der product-grid-hover-4.liquid ändern, aber ich bekomme es nicht hin.

Vielleicht könnt Ihr mir helfen, wie ich das evtl umsetzen kann.

Hier mal Bilder wie es ist und wie ich es mir vorstelle:

Laut Themehersteller ist das dieser Bereich in der Liquid Datei:

{%- unless sold_out -%}
				<div class="product-card__form mobile" data-handle="{{ product.handle }}" data-title="{% if group_product == blank and external == blank %}{{ 'products.product.add_to_cart' | t }}{% else %}{{ 'products.product.buy_product' | t }}{% endif %}">
					{% if group_product == blank and external == blank %}
						{%- if variant_count > 1 and settings.sortby_variants == blank -%}
							<a class="btn btn-link" href="{{ product_url }}">{{ 'products.product.view_product' | t }}</a>
                          
						{% else %}
						<form action="/cart/add" method="post" enctype="multipart/form-data" class="form-addtocart" data-product-form>
								<input type="hidden" name="id" value="{{ variant.id }}" />
								<div class="wpbingo-qty">
									<button type="button" class="js-qty-adjust wpbingo-qty__adjust wpbingo-qty__adjust--minus" aria-label="{{ 'cart.general.reduce_quantity' | t }}">
										<i class="feather-minus"></i>
									</button>
									<input type="text" name="quantity" class="js-qty-number wpbingo-qty__number" value="1" min="0" aria-label="quantity" pattern="[0-9]*">
									<button type="button" class="js-qty-adjust wpbingo-qty__adjust wpbingo-qty__adjust--plus" aria-label="{{ 'cart.general.increase_quantity' | t }}">
										<i class="feather-plus"></i>
									</button>
								</div>
								<button class="js-btn-addtocart btn btn--add-to-cart"
									type="submit"
									value="Submit"
									title="{{ 'products.product.add_to_cart' | t }}">
								</button>
							</form>
						{% endif %}
					{% elsif group_product == blank and external != blank %}
					<a class="btn btn-link" href="{{ external }}">{{ 'products.product.view_product' | t }}</a>
					{% else %}
						<a class="btn btn-link" href="{{ product_url }}">{{ 'products.product.view_product' | t }}</a>
					{% endif %}
				</div>
			{%- endunless -%}

Wäre super wenn Ihr mir helfen könntet. Danke und LG
Andreas

[Ben310]

Hmm, Ausverkauft als Buttonform - du möchtest also den Verkauf fortsetzen, auch wenn Artikel nicht vorrätig ist? Hast du es im Produktstamm ausprobiert “Verkauf fortsetzen, auch wenn Artikel nicht vorrätig ist” zu aktivieren?

Anonsten was du brauchst ist ein zusätzlicher Code-Block für sold_out == true, der den Button “Ausverkauft” anzeigt. Probier mal folgendes:

Ersetze in deinem obigen Code:

{%- unless sold_out -%}
  
    ...
  

{%- endunless -%}

Mit:

{%- if sold_out -%}
  
    
  

{%- else -%}
  
    {% if group_product == blank and external == blank %}
      {%- if variant_count > 1 and settings.sortby_variants == blank -%}
        {{ 'products.product.view_product' | t }}
      {% else %}
        
      {% endif %}
    {% elsif group_product == blank and external != blank %}
      {{ 'products.product.view_product' | t }}
    {% else %}
      {{ 'products.product.view_product' | t }}
    {% endif %}
  

{%- endif -%}

Und einen Button-Styling musst du auch erstellen im CSS.

[TL-Andi]

Hallo Ben310,

genau so wollte ich es haben Danke

LG Andreas