Hey @mrserious
Danke für die Screenshots und den Vorschaulink! Ich sehe auch du hast viele Fragen zu wie du dein Theme ändern kannst. Darf ich dazu fragen ob du auch andere Themes zum Shop hinzugefügt hast die das besser können was du dir vorstellst, als beispielsweise das standard Dawn Theme es kann (scrolle mal beispielsweise in dieser Demo runter)?
Das frage ich weil ich sehe du verbringst sehr viel Zeit mit dem tüfteln am Theme, anstatt am aufbauen eines erfolgreichen Business. Ich sehe oft Shops die sich zu sehr mit den technischen Dingen des Themes beschäftigen und dabei das eigentliche Business vernachlässigen...und dann meistens nach ein paar Wochen oder Monate schließen sie wieder leider.
Nun zu deiner Frage:
Das Anpassen des Aussehens und der Platzierung von Elementen auf der PDP erfordert das Bearbeiten der entsprechenden Liquid- und CSS-Dateien im Dawn Theme.
Hier eine allgemeine Anleitung, zu wie du das erreichen kannst, bitte dich aber darauf vorbereiten, dass das relativ komplex sein wird. Wie gesagt, andere Themes zu testen wäre hier der beste Weg oder unsere Page Builder Apps zu verwenden.
- Euro-Zeichen hinter den Preis setzen:
Das haben wir bereits hier besprochen. Wenn das aber nicht ausreicht, dann oeffne die Liquid-Datei, die den Preis rendert (normalerweise in product-template.liquid oder einer ähnlichen Datei). Sie suchen nach etwas, das so aussieht:
{{ product.price | money }}
Ändere zu:
{{ product.price }} €
- Text "inkl. MwSt." und "zzgl. Versandkosten" hinzufügen:
Füge direkt nach der Preisanzeige den folgenden Code ein:
<span class="tax-and-shipping"> inkl. MwSt. zzgl. Versandkosten</span>
- Stil des "inkl. MwSt." und "zzgl. Versandkosten" Textes anpassen:
Füge dem CSS (normalerweise in theme.scss.liquid oder einer ähnlichen Datei) den folgenden Stil hinzu:
.tax-and-shipping {
font-size: 0.75em; /* oder eine andere gewünschte Größe */
margin-left: 5px;
}
- "Auf Lager" Symbol zwischen "In den Warenkorb legen" und den Trust Badgets verschieben:
Finde den Code, der das "Auf Lager" Symbol rendert. Es könnte so aussehen:
{% if product.available %}
<span>Auf Lager</span>
{% endif %}
Schneide diesen Code-Abschnitt aus und füge ihn dort ein, wo er zwischen dem "In den Warenkorb legen" Button und den Trust Badges erscheinen soll.
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!
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
