zusätzlichen Text auf Produktseite unter dem Preis anzeigen (Lieferzeit anzeigen)

[julefrms]

Bei unserem alten Theme (Dawn) hatte ich via Code einen Text unter dem Preis auf der Produktseite engefügt. Je nach Lieferant wurde dann eine Lieferzeit angezeigt. Zb. "Lieferzeit 1-3 Werktage" 

Nun haben wir das neue Impact Theme und ich würde hier auch gerne wieder je nach Lieferant und Warenverfügbarkeit an zwei verschiedenen Standorten die jeweilige Lieferzeit unter dem Preis auf der Produktseite anzeigen. Gibt es hierfür eine Lösung? Es wird Json benutzt beim impact theme, womit ich mmich leider nicht auskenne. 

[soenmez]

Hallo julefrms,

vielen Dank für deine Frage hier im Community Forum.

Erstmal herzlichen Glückwunsch zum Upgrade auf das neue Impact-Theme.

Das Einbinden individueller Lieferzeiten je nach Lieferant und Warenverfügbarkeit ist durchaus möglich, erfordert aber ein Verständnis für Liquid und JSON.

Bevor du mit Änderungen an deinem Theme anfängst, denke daran, immer ein Backup zu erstellen.

Schritt 1: Erstelle benutzerdefinierte Metafelder
Zuerst müssen benutzerdefinierte Metafelder für jeden Ihrer Lieferanten erstellen werden, um die Lieferzeiten zu speichern. Dafür können Apps wie „Metafields Guru“ oder „Metafields2“ verwendet werden.

Metafields Guru 

Metafields2 

Schritt 2: Fülle die Metafelder aus
Fülle die Metafelder für jeden Lieferanten mit den entsprechenden Lieferzeiten aus.

Schritt 3: Ändere die Liquid-Datei
Nun können die angelegten Metafelder unter dem Preis angezeigt werden, hier ein Code-Snippet:

{% if product.metafields.global.supplier_time %}
    <p>{{ product.metafields.global.supplier_time }}</p>
{% endif %}

Schritt 4: Bearbeiten Sie die JSON-Datei
Zum Schluss muss die JSON-Datei Ihres Themes bearbeitet werden, um die Änderungen anzuzeigen. Gehen zum Theme-Code und suche die product.json.liquid Datei. Füge den Abschnitt des Lieferanten hinzu, wo du anzeigen möchten.

[julefrms]

Vielen Dank für die schnelle Antwort. 

Lässt es sich so auch realisieren für einen Lieferanten mehrere Lieferzeiten anzugeben? Wir haben mehrere Lagerorte, so ist es zum Beispiel bei einem Produkt so, dass es eine Lieferzeit von 1-3 Werktagen hat wenn es in Lager 1 liegt, wenn es jedoch in Lager 2 liegt hat es eine Lieferzeit von 3-4 Tagen... 

[Gabe]

Hey @julefrms 

Das Impact Theme ist toll und wird sicherlich die Customer Experience enorm verbessern! Baust du das für einen Klienten?

Tipp: Du könntest für jeden Lieferanten mehrere Lieferzeiten speichern, indem du mehrere Metafelder für jeden Lieferanten verwendest und jedes Metafeld kann für eine bestimmte Lagerort-Lieferzeit-Kombination stehen, wie z. B. zwei Metafeldern für einen Lieferanten, die für zwei verschiedene Lagerorte stehen:

1. Metafeld: lieferant_zeit_lager1
2. Metafeld: lieferant_zeit_lager2

IF-Statement auf der Produktseite entsprechend anpassen, wie z. B.

{% if product.metafields.global.lieferant_zeit_lager1 %}
    <p>Lieferzeit für Lager 1: {{ product.metafields.global.lieferant_zeit_lager1 }}</p>
{% endif %}

{% if product.metafields.global.lieferant_zeit_lager2 %}
    <p>Lieferzeit für Lager 2: {{ product.metafields.global.lieferant_zeit_lager1 }}</p>
{% endif %}

Code überall dort einfügen, wo die Lieferzeit angezeigt werden soll, wie z. B. in der product.json.liquid oder eine andere relevante Datei. Du musst halt herausfinden, welche Lieferzeit für ein bestimmtes Produkt anzuzeigen ist, basierend auf der aktuellen Verfügbarkeit in den verschiedenen Lagern. Dies könnte zusätzliche Logik im Code verlangen oder eine App.

[julefrms]

Hallo Gabe, 

meine Antwort kommt sehr spät - ich habe das Thema etwas vernachlässigt. In Zukunft sollen die Lieferzeiten im Shop aber endlich richtig angezeigt werden! 

Leider bin ich im Thema Metafelder so gar nicht gut.. In dem Code fehlt noch die gewissen Logik richtig? 

Also:

wenn Produkt von Marke X lagernd in Lager A -> Lieferzeit 1-3 Werktage

wenn Produkt von Marke X lagernd in Lager B -> Lieferzeit 2-5 Werktage

Das Impact Theme hat ja extra ein Inventory.liquid Snippet. 

Bisher habe ich die Lieferzeit hier nur nach Vendor angegeben. Dies habe ich im Code so hinterlegt, ohne Metafelder zu benutzen. Könnte man nicht nur den Code noch zusätzlich anpassen, dass die Lieferzeit nicht nur nach Marke, sondern auch nach Lager angegeben wird? Weiterhin ohne Metafelder? 

[Gabe]

Hey @julefrms 

Ja, es ist möglich, die Lieferzeit sowohl nach Marke als auch nach Lagerstandort anzupassen, ohne Metafelder zu verwenden. Dafür musst du Logik in deine Liquid-Dateien integrieren, die auf der Verfügbarkeit der Produkte in den verschiedenen Lagern basiert. 

Zuerst musst du klären, wie die Information über die Lagerverfügbarkeit strukturiert ist. Je nachdem, wie deine Produktdaten organisiert sind, könnte diese Information direkt in den Produkteigenschaften enthalten sein oder durch eine App verwaltet werden. In deinen Liquid-Dateien musst du die Logik einbauen, um die Lieferzeiten basierend auf der Marke und dem Lagerstandort zu bestimmen. Hier ist ein einfacher CASE Pseudocode:

{% assign brand = product.vendor %}
{% assign location = product.metafields.global.location %} // oder wie auch immer die Lagerinformation strukturiert ist

{% case brand %}
 {% when 'Marke X' %}
   {% if location == 'Lager A' %}
     <p>Lieferzeit 1-3 Werktage</p>
   {% elsif location == 'Lager B' %}
     <p>Lieferzeit 2-5 Werktage</p>
   {% endif %}
 // Füge hier weitere Marken und Bedingungen hinzu
{% endcase %}

Diesen Code musst du dort einfügen, wo die Lieferzeit auf deiner Produktseite angezeigt werden soll. Das könnte die Datei product.liquid, product.json.liquid oder ein anderes relevantes Snippet sein. 

• Die Variablen brand und location im Codebeispiel sind nur Platzhalter. Du musst sie entsprechend deiner eigenen Datenstruktur anpassen.
• Dieser Ansatz setzt voraus, dass du Informationen über die Lagerverfügbarkeit in deinen Produktdaten hast. Wenn diese Informationen nicht verfügbar sind, musst du sie eventuell durch eine App oder einen anderen Prozess erfassen.

Oben und auch hier siehst du, wie man einen Liquid-Code-Snippet erstellt, um die geschätzte Lieferzeit basierend auf dem Lagerbestand anzuzeigen. In diesem Fall verwendet der Nutzer Metafelder, um Informationen über die Lieferanten und den Lagerbestand zu speichern und anzuzeigen. Dieser Ansatz erfordert ein gewisses Verständnis von Liquid und möglicherweise Metafeldern, aber es ist eine anpassbare Lösung, die speziell auf deine Bedürfnisse zugeschnitten werden kann.

Es gibt auch Shopify-Apps, die dir helfen können, geschätzte Lieferzeiten anzuzeigen. Diese Apps bieten oft erweiterte Funktionen wie die Möglichkeit, Lieferzeiten basierend auf Postleitzahlen oder bestimmten Kriterien festzulegen. Sie können auch Funktionen wie einen Lieferkalender oder Zeitfenster für die Zustellung bieten. Apps sind eine gute Wahl, wenn du eine benutzerfreundliche Lösung suchst und bereit bist, für zusätzliche Funktionen zu zahlen.

---
Habt ihr auch den Shop auf die Weihnachtssaison umgestellt? Jetzt ist die Zeit wo Online Shopper nach 🎁 👀!

Hast du weitere Fragen zum Shop? Gebe einfach ein Suchbegriff oben in der Suchleiste der Community Landingpage ein, denn das Thema haben wir sehr wahrscheinlich schon besprochen. Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

[julefrms]

Ich denke da liegt mein Problem. Ich weiß nicht wie das Lager strukturiert ist. Metafelder nutze ich nicht. Es ist einfach nur Ware auf Lager über das Shopify System. Angelegt sind zwei Standorte. (Unser wirkliches Warenlager und ein weiteres Lager names "FTP" - hier wird der bestand mit den Hersteller Lagern automatisch über eine App abgeglichen) Gibt es eventuell eine Möglichkeit das mir jemand den Code schreibt? Natürlich gegen Zahlung. 

der aktuelle Code sieht so aus: 

PRODUCT INVENTORY COMPONENT
----------------------------------------------------------------------------------------------------------------------

This component is used to display the inventory of a given product

********************************************
Supported variables
********************************************

* product: the product from which the inventory is extracted (required)
* low_threshold: the inventory quantity threshold below which the inventory is shown as "red"
* form_id: if specified, define the form ID linked to this input
* Zeile 34 für Änderung an 2-10 Tagen Lieferzeit
{%- endcomment -%}

<variant-inventory {% if form_id %}form="{{ form_id }}"{% endif %}>
  {%- for variant in product.variants -%}
    {%- if variant == product.selected_or_first_available_variant -%}
      {%- assign variant_selected = true -%}
    {%- else -%}
      {%- assign variant_selected = false -%}
    {%- endif -%}

    {%- if variant.available -%}
      {%- if variant.inventory_management and variant.inventory_policy == 'deny' and variant.inventory_quantity <= low_threshold and low_threshold > 0 -%}
        <span {% unless variant_selected %}hidden{% endunless %} data-variant-id="{{ variant.id }}" class="text-with-icon text-error">{%- render 'icon' with 'warning' -%} {{- 'product.inventory.low_stock_with_quantity_count' | t: count: variant.inventory_quantity -}}</span>
      {%- else -%}
        {%- if variant.inventory_policy == 'continue' and variant.inventory_quantity <= 0 and variant.requires_shipping -%}
          {%- if variant.incoming and variant.next_incoming_date -%}
            {%- capture next_incoming_date -%}{{ variant.next_incoming_date | date: format: 'date' }}{%- endcapture -%}
            <span {% unless variant_selected %}hidden{% endunless %} data-variant-id="{{ variant.id }}" class="text-with-icon text-warning">{%- render 'icon' with 'warning' -%} {{- 'product.inventory.incoming_stock' | t: next_incoming_date: next_incoming_date -}}</span>
          {%- else -%}
            <span {% unless variant_selected %}hidden{% endunless %} data-variant-id="{{ variant.id }}" class="text-with-icon text-warning">{%- render 'icon' with 'warning' -%} {{- 'product.inventory.oversell_stock' | t -}}</span>
          {%- endif -%}
        {%- else -%}
            <span {% unless variant_selected %}hidden{% endunless %} data-variant-id="{{ variant.id }}" class="text-with-icon text-success">{%- render 'icon' with 'success' -%} {{- 'product.inventory.in_stock' | t -}}{% if product.vendor ==  'Winderen' or 'TransHorse® Sport' or 'DeNiro'or 'Kavalkade' %}, Lieferzeit 1-3 Werktage </span>
  {% endif %}
        {%- endif -%}
      {%- endif -%}
    {%- elsif variant.incoming -%}
      {%- if variant.next_incoming_date -%}
        {%- capture next_incoming_date -%}{{ variant.next_incoming_date | date: format: 'date' }}{%- endcapture -%}
        <span {% unless variant_selected %}hidden{% endunless %} data-variant-id="{{ variant.id }}" class="text-with-icon text-warning">{%- render 'icon' with 'warning' -%} {{- 'product.inventory.incoming_stock' | t: next_incoming_date: next_incoming_date -}}</span>
      {%- else -%}
        <span {% unless variant_selected %}hidden{% endunless %} data-variant-id="{{ variant.id }}" class="text-with-icon text-warning">{%- render 'icon' with 'warning' -%} {{- 'product.inventory.oversell_stock' | t -}}</span>
      {%- endif -%}
    {%- endif -%}
  {%- endfor -%}
</variant-inventory>

Ist auch schon so, dass die anzeige sich sofort aktualisiert wenn der Nutzer andere Varianten anklickt, das was mir fehlt  ist die Logik je nachdem ob die Ware in Lager A oder B vorhanden ist und nochmal je nach Marke zu unterscheiden. 

Ist es sehr aufwendig diesen vorahnenden Code zu erweitern? 

[Gabe]

Hey @julefrms 

Grundsätzlich müsste der Code so erweitert werden, dass er nicht nur die Verfügbarkeit der Varianten berücksichtigt, sondern auch, aus welchem Lager (A oder B) die Produkte kommen. Für solch spezifische Anforderungen, insbesondere wenn du wenig Erfahrung mit Liquid oder Shopify-Frontend- oder Theme-entwicklung hast, wäre es ratsam, die Hilfe eines professionellen Entwicklers in Anspruch zu nehmen. 

Dabei musst du bedenken, dass Liquid in erster Linie für die Darstellung von Daten verwendet wird und möglicherweise nicht direkt auf Lagerbestandsinformationen zugreifen kann, die über eine App oder externe Quelle synchronisiert werden.

Dein aktueller Code scheint bereits einige Logik für die Anzeige von Lagerbestandsinformationen zu enthalten, allerdings ohne spezifische Unterscheidung nach Lagerort. Um diese Funktionalität zu erweitern, könntest du prüfen, ob bestimmte Eigenschaften oder Tags für Produkte existieren, die auf den Lagerort hinweisen. Sofern diese Informationen nicht direkt im Produkt oder Varianten verfügbar sind, wird es komplexer, da dann eine externe Datenquelle oder spezielle App-Integration notwendig wäre.

Eine möglichkeit wäre, im Liquid-Code zu überprüfen, welche Lagerinformationen verfügbar sind und entsprechend die Lieferzeiten anzupassen:

{% for variant in product.variants %}
 {% if variant.inventory_location == 'Lager A' %}
   {% if product.vendor == 'Marke X' %}
     <p>Lieferzeit: 1-3 Werktage</p>
   {% endif %}
 {% elsif variant.inventory_location == 'Lager B' %}
   {% if product.vendor == 'Marke X' %}
     <p>Lieferzeit: 2-5 Werktage</p>
   {% endif %}
 {% endif %}
{% endfor %}

Dieses Beispiel ist allerdings sehr vereinfacht und setzt voraus, dass die Lagerinformationen als Teil der Varianteneigenschaften in Shopify verfügbar sind, was möglicherweise nicht der Fall ist. Wenn solche Details nicht direkt zugänglich sind, wäre eine individuelle Entwicklung durch einen professionellen Shopify-Entwickler erforderlich, der sich mit der Integration von externen Datenquellen und komplexeren Logiken auskennt.

Da Liquid hauptsächlich für die Darstellung von Daten verwendet wird und die Fähigkeit, komplexe Logik zu handhaben, begrenzt ist, kann es notwendig sein, zusätzliche Anpassungen auf Server-Ebene oder durch eine spezielle App vorzunehmen, um genau die gewünschte Funktionalität zu erreichen. 

Siehe mehr dazu in diesen Threads und Ressourcen:

• Display Estimated Delivery Times On My Product Page
• Shopify Liquid code examples
• Shopify Liquid Guide (...verlangt etwas klicken bis man zum Artikel kommt)

Hoffe das hilft dir weiter! 😉