Liquid, JavaScript, Themes
Hallo Zusammen
Ich frage mich wie ich es umsetzten kann am Besten einen Reservierungs button unter dem In den warenkorb button zu bekommen? Wir nutzen das stiletto theme.
kann mir da jemand helfen?!
Alternativ frage ich mich auch ob es im Stiletto theme auf der Prdoukt seite eine dropdown/Drawer möglichkeit gibt eines Kontakt/Fragen zum Produkt Formular!=?
Auf Hilfe wäre ich dankbar.
Ecomman
Hey @EComMan1
Du möchtest also deinen Kunden die Option anbieten ein Produkt zu "pre-ordern", sprich, zu reservieren. Was hast du bis jetzt alles ausprobiert wenn ich fragen darf, denn deine Fragen sind nicht ganz klar, ob du bereits Dinge oder Booking Apps implementiert hast oder nicht. Wenn doch, welchen "Reservierungs button" hast du implementiert der sich nicht direkt unter dem ATC Button platziert? Ist das eine App?
Hier wäre es ggf. zu überlegen ob die Stiletto Theme Dokumentation nicht die bessere Resource wäre denn viele User die täglich mit diesem Theme arbeiten kenne ich selber leider nicht. Die Theme Entwickler sind hier auch sehr hilfreich und du kannst denen jederzeit Fragen senden über deren Facebook Seite hier.
Für beide Anforderungen musst wahrscheinlich in den Shopify Liquid-Code sowie gegebenenfalls ein wenig CSS und JavaScript anpassen. 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!
Schritte:
Gehe in dein product-template.liquid
oder eine ähnliche Datei, die das Produktlayout darstellt und suche nach dem "In den Warenkorb"-Button-Code. Es könnte so aussehen:
<button type="submit" name="add" id="AddToCart" ... >
In den Warenkorb
</button>
Direkt darunter den Reservierungs-Button-Code einfügen:
<a href="#reservierung" class="reserve-button">Reservieren</a>
Dropdown/Drawer für ein Kontaktformular auf der Produktseite:
Wieder in der product-template.liquid
oder einer ähnlichen Datei den folgenden Code an der Stelle einfügen, an der du den Dropdown/Drawer-Button anzeigen möchtest:
<button id="toggleContactForm">Fragen zum Produkt?</button>
<div id="contactFormDrawer" style="display: none;">
{% include 'contact-form' %}
</div>
Füge etwas JavaScript hinzu, um den Drawer ein- und auszublenden:
document.getElementById('toggleContactForm').addEventListener('click', function() {
var drawer = document.getElementById('contactFormDrawer');
if(drawer.style.display === "none") {
drawer.style.display = "block";
} else {
drawer.style.display = "none";
}
});
Den CSS hinzufügen, um das Kontaktformular und den Button anzupassen. Das Ganze 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
hallo Gabe
ich habe leider keine richtigen apps gefunden. wir möchten auch keine App die Kosten.
Es muss doch aber eine einfache möglcihkeit geben einen resivert button zu machen!?
Wie meinst du genau "eine einfache möglichkeit geben einen reservieren button zu machen"? Hast du eine bestimmte Vorstellung wie man das implementieren könnte? Wenn ja, dann können wir das gerne hier näher 👁️ . 😉
Nicht vergessen, ein Reservierungsbutton muss ja in das Shopify Kernsystem eingreifen, bzw. in das INventar des Backends, so dass das Produkt auch im Backend den Reservierungs-Tag bekommt, also so einfach ist das nicht.
Die einfachste Methode wäre ein CTA Button auf der Product Page der zu einer Formular Page führt, den du im Bereich "Pages" erstellt hast, den der Kunde ausfüllen muss und es als E-Mail an deine E-Mail senden, und du das Produkt dann manuell für den Kunden reservierst. Der Vorteil hier ist, dass du den Kunden dann per E-Mail auf dem Laufenden halten kannst bzgl. den Status der Reservierung.
Ich habe jetzt 3 weitere Threads zum Thema für dich gegoogelt die, tbh, nicht sonderlich hilfreich sind:
Diese App bietet auch einen kostenlosen Plan:
VG,
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
Teil 2 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 16, 2024Teil 1 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 9, 2024Anpassungen des benutzerdefinierten Codes an Shopify-Themes (CSS) leicht gemachtIn diesem...
By Gabe Aug 28, 2024