FROM CACHE - de_header
Gelöst

Sale Badges bei den Produkten ausblenden

Annina12
Tourist
12 2 2

Hallo

 

Ich möchte bei den Produkten überall die Sale Badges ausblenden und nur den durchgestrichenen Preis anzeigen lassen. Könnt Ihr mir weiterhelfen? Ich verwende das DAWN-Theme.

 

Dankeschön 🤗

1 AKZEPTIERTE LÖSUNG

Gabe
Shopify Staff
15805 2505 3740

Erfolg.

Hey @Annina12 

 

Danke für die Fragen und bei so einem Fall wäre ein befristeter Vorschaulink zu einem Beispiel sehr hilfreich das schneller zu analysieren.

 

Und du möchtest den Vergleichspreis anzeigen zusammen mit dem regulären Preis aber nicht die Sales Badges. Wie ist es mit dem Ausverkauft Badge? Vielleicht gefällt dir nicht, wie die Sales Badges des Dawn Themes aussehen? Oder werden die Badges eines Themes direkt über deinen Produktbildern platziert? Das kann dazu führen, dass deine Kunden deine Produkte nicht mehr gut sehen können.

 

Was auch immer der Grund dafür ist, es ist mit etwas Coding möglich, die Produkt-Badges deines Themes zu deaktivieren, wenn du das so möchtest.

 

Denke bitte auch daran, dass die Entfernung der Sales Badges deine Conversions ggf. reduzieren kann. Das was für dich nicht unbedingt toll aussieht, ist ggf. nicht dieselbe Erfahrung für deine Kunden. Wir denken oft, dass die Kunden alles genauso sehen wie wir als Shopinhaber es sehen. Das ist aber nicht immer korrekt und um mehr darüber zu erfahren, suche in Google nach dem Thema UX-Design Prinzipien.

 

Im Folgenden stelle ich aber ein paar Möglichkeiten vor, wie du die integrierten Produktabzeichen deines Shopify-Themes deaktivieren kannst. Siehe einen Thread dazu hier.

 

Dann hier ein paar weitere links dazu:

Dass sieht so aus wie aus meinem eigenen Test-Dawn Theme abgebildet:

 

01-14-ws8z0-uvncp.png

 

Wenn du es selber programmieren möchtest dann bitte immer in einer Themekopie/ Testumgebung zuerst testen und zusammen mit einem Experten/Programmierer. Du kannst ein Backup deines Themes erstellen, bevor man den Code bearbeitet, oder den Code wiederherstellen, falls dies nötig sein sollte. Du könntest auch einen unserer Experten engagieren indem du denen eine E-Mail rüberschießt. Unsere Experten antworten meist sehr schnell.

Änderungen zu deinem Theme Code können auch 1) die Page Loading Speeds negativ beeinflussen und 2) dein Theme aus den Theme Updates ausschließen. Das folgende ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!

 

Aber ggf geht das auch über dem oben-abgebildeten CSS-Editor!

 

Um die Sale Badges in deinem Shopify Dawn-Theme auszublenden und nur den durchgestrichenen Preis anzuzeigen, kannst du das CSS deines Themes anpassen, um die Sale Badges auszublenden. Füge hierfür den folgenden Code am Ende deiner base.css-Datei hinzu:

 

.badge.price__badge-sale.color-accent-2 {
    display: none !important;
}

 

Und für die PDP:

 

.price__badge-sale {
   display: none !important;
}

 

  1. Diese Anpassungen sollten die Sale Badges auf den Produktkarten und den Produktseiten verbergen.

  2. Anpassung der Liquid-Dateien: Eine weitere Möglichkeit besteht darin, die Anzeige der Badges direkt in den Liquid-Dateien deines Themes zu ändern. Suche in der Datei card-product.liquid nach dem entsprechenden Code-Segment, das für die Anzeige der Sale Badges verantwortlich ist, und kommentiere es aus oder entferne es. Hier ist ein Beispiel für den auszukommentierenden Codeabschnitt:

 

{%- if card_product.available == false -%}
  <span
    id="Badge-{{ section_id }}-{{ card_product.id }}"
    class="badge badge--bottom-left color-{{ settings.sold_out_badge_color_scheme }}"
  >
    {{- 'products.product.sold_out' | t -}}
  </span>
{%- elsif card_product.compare_at_price > card_product.price and card_product.available -%}
  <span
    id="Badge-{{ section_id }}-{{ card_product.id }}"
    class="badge badge--bottom-left color-{{ settings.sale_badge_color_scheme }}"
  >
    {{- 'products.product.on_sale' | t -}}
  </span>
{%- endif -%}

 

Entferne oder kommentiere den Abschnitt für die Sale Badges, um sie auszublenden. Denk daran, immer eine Sicherungskopie deines Themes zu erstellen, bevor du Änderungen vornimmst. Dies ermöglicht es dir, bei Bedarf zu einer früheren Version zurückzukehren.

---
Habt ihr auch den Shop auf die Weihnachtssaison und den Winterschlussverkauf umgestellt? Jetzt ist die Zeit wo Online Shopper nach 🎁 oder Schnäppchen 👀!

giphy

 

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.

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

Lösung in ursprünglichem Beitrag anzeigen

3 ANTWORTEN 3

Gabe
Shopify Staff
15805 2505 3740

Erfolg.

Hey @Annina12 

 

Danke für die Fragen und bei so einem Fall wäre ein befristeter Vorschaulink zu einem Beispiel sehr hilfreich das schneller zu analysieren.

 

Und du möchtest den Vergleichspreis anzeigen zusammen mit dem regulären Preis aber nicht die Sales Badges. Wie ist es mit dem Ausverkauft Badge? Vielleicht gefällt dir nicht, wie die Sales Badges des Dawn Themes aussehen? Oder werden die Badges eines Themes direkt über deinen Produktbildern platziert? Das kann dazu führen, dass deine Kunden deine Produkte nicht mehr gut sehen können.

 

Was auch immer der Grund dafür ist, es ist mit etwas Coding möglich, die Produkt-Badges deines Themes zu deaktivieren, wenn du das so möchtest.

 

Denke bitte auch daran, dass die Entfernung der Sales Badges deine Conversions ggf. reduzieren kann. Das was für dich nicht unbedingt toll aussieht, ist ggf. nicht dieselbe Erfahrung für deine Kunden. Wir denken oft, dass die Kunden alles genauso sehen wie wir als Shopinhaber es sehen. Das ist aber nicht immer korrekt und um mehr darüber zu erfahren, suche in Google nach dem Thema UX-Design Prinzipien.

 

Im Folgenden stelle ich aber ein paar Möglichkeiten vor, wie du die integrierten Produktabzeichen deines Shopify-Themes deaktivieren kannst. Siehe einen Thread dazu hier.

 

Dann hier ein paar weitere links dazu:

Dass sieht so aus wie aus meinem eigenen Test-Dawn Theme abgebildet:

 

01-14-ws8z0-uvncp.png

 

Wenn du es selber programmieren möchtest dann bitte immer in einer Themekopie/ Testumgebung zuerst testen und zusammen mit einem Experten/Programmierer. Du kannst ein Backup deines Themes erstellen, bevor man den Code bearbeitet, oder den Code wiederherstellen, falls dies nötig sein sollte. Du könntest auch einen unserer Experten engagieren indem du denen eine E-Mail rüberschießt. Unsere Experten antworten meist sehr schnell.

Änderungen zu deinem Theme Code können auch 1) die Page Loading Speeds negativ beeinflussen und 2) dein Theme aus den Theme Updates ausschließen. Das folgende ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!

 

Aber ggf geht das auch über dem oben-abgebildeten CSS-Editor!

 

Um die Sale Badges in deinem Shopify Dawn-Theme auszublenden und nur den durchgestrichenen Preis anzuzeigen, kannst du das CSS deines Themes anpassen, um die Sale Badges auszublenden. Füge hierfür den folgenden Code am Ende deiner base.css-Datei hinzu:

 

.badge.price__badge-sale.color-accent-2 {
    display: none !important;
}

 

Und für die PDP:

 

.price__badge-sale {
   display: none !important;
}

 

  1. Diese Anpassungen sollten die Sale Badges auf den Produktkarten und den Produktseiten verbergen.

  2. Anpassung der Liquid-Dateien: Eine weitere Möglichkeit besteht darin, die Anzeige der Badges direkt in den Liquid-Dateien deines Themes zu ändern. Suche in der Datei card-product.liquid nach dem entsprechenden Code-Segment, das für die Anzeige der Sale Badges verantwortlich ist, und kommentiere es aus oder entferne es. Hier ist ein Beispiel für den auszukommentierenden Codeabschnitt:

 

{%- if card_product.available == false -%}
  <span
    id="Badge-{{ section_id }}-{{ card_product.id }}"
    class="badge badge--bottom-left color-{{ settings.sold_out_badge_color_scheme }}"
  >
    {{- 'products.product.sold_out' | t -}}
  </span>
{%- elsif card_product.compare_at_price > card_product.price and card_product.available -%}
  <span
    id="Badge-{{ section_id }}-{{ card_product.id }}"
    class="badge badge--bottom-left color-{{ settings.sale_badge_color_scheme }}"
  >
    {{- 'products.product.on_sale' | t -}}
  </span>
{%- endif -%}

 

Entferne oder kommentiere den Abschnitt für die Sale Badges, um sie auszublenden. Denk daran, immer eine Sicherungskopie deines Themes zu erstellen, bevor du Änderungen vornimmst. Dies ermöglicht es dir, bei Bedarf zu einer früheren Version zurückzukehren.

---
Habt ihr auch den Shop auf die Weihnachtssaison und den Winterschlussverkauf umgestellt? Jetzt ist die Zeit wo Online Shopper nach 🎁 oder Schnäppchen 👀!

giphy

 

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.

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

Annina12
Tourist
12 2 2

Vielen Dank, Gabe! Das funktioniert so super.🤗

Gabe
Shopify Staff
15805 2505 3740

Freut mich zu hören! 😉 

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog