FROM CACHE - de_header
Gelöst

Formular Angebot anfragen

Niko1896
Tourist
6 0 3

Hallo,

 

ich würde gerne ein Formular einfügen mit dem der Kunde ein Angebot einholen kann.
Wenn der Kunde sich gerade diesen Artikel anschaut, wir nehmen mal als Beispiel ein blaues (mehrere Farben vorhanden) Trikot mit der SKU 123456, und klickt nun auf den Angebot anfordern Button , dann soll ein Formular erscheinen wo der Produktname und die SKU schon drin stehen. Er fügt dann nur noch seinen Namen, Email und Kommentar ein. Das Formular über contact_Vorlage bekomme ich hin, aber diese Programmierung nicht.

Schön wäre es auch, wenn das Formular wie ein Popup aufgeht, damit der Kunde auf der Seite bleibt.

 

Ist dies Möglich und kann man das relativ unkompliziert hinbekommen oder ist da schon größere Hilfe nötig.

1 AKZEPTIERTE LÖSUNG
Gabe
Shopify Staff
16752 2646 3926

Erfolg.

Hey @Niko1896 

 

Danke für die Bilder und um ein Pop-up-Formular auf deiner Webseite zu implementieren, das automatisch mit dem Produktnamen und der SKU gefüllt wird, wenn ein Nutzer auf den Button "Angebot anfordern" klickt, kannst du folgende allgemeine Schritte befolgen:

  • Button zum Öffnen des Pop-up-Formulars hinzufügen: Du musst einen Button auf deiner Produktseite hinzufügen, den die Nutzer anklicken können, um ein Angebot anzufordern. Dieser Button sollte so programmiert sein, dass er das Pop-up-Formular auslöst.
  • Das Pop-up-Formular erstellen: Das Formular selbst kann mit HTML gebaut und mit CSS gestaltet werden, um zum Design deiner Webseite zu passen. W3Schools bietet eine umfassende Anleitung, wie du ein Pop-up-Formular mit CSS und JavaScript erstellen kannst​​.
  • Formularfelder mit Produktinformationen automatisch ausfüllen: Um das Formular mit dem Produktnamen und der SKU automatisch auszufüllen, kannst du Smart-Tags oder URL-Parameter verwenden. Die Prefill-Funktion von Popupsmart ermöglicht es dir, dynamischen Textersatz zu verwenden, um Benutzerinformationen zu sammeln und in die Formularfelder einzufügen. Beispielsweise kannst du das Formular so konfigurieren, dass beim Klicken des Angebot-anfordern-Buttons die URL Parameter wie ?productName=BlueJersey&sku=123456 enthält, welche das Pop-up-Formular dann lesen und verwenden kann, um die Felder vorab auszufüllen​​.

  • Das Pop-up-Formular als Modal anzeigen: Du kannst JavaScript verwenden, um das Formular als Modal-Pop-up erscheinen zu lassen, was sicherstellt, dass es vor dem aktuellen Inhalt erscheint und der Nutzer auf derselben Seite bleibt. Dies ist eine gängige Praxis, um die Aufmerksamkeit des Nutzers auf das Formular zu lenken und die Navigation weg von der Seite zu verhindern.

  • Anpassen und Speichern des Pop-up-Formulars: Mit Popupsmart kannst du das Erscheinungsbild deines Pop-up-Formulars anpassen, Formularfelder hinzufügen, das Targeting einrichten und es bei Bedarf mit deinem E-Mail-Automatisierungsdienst integrieren. Du kannst das Formular so einrichten, dass es auf bestimmte Auslöser wie einen Button-Klick reagiert, und es dann zum Veröffentlichen speichern​​.

Für eine nicht-technische Person könnte die Einrichtung eines solchen Systems eine Herausforderung sein, und es könnte notwendig sein, die Hilfe eines Webentwicklers in Anspruch zu nehmen. Der Entwickler kann beim Erstellen des Button-Triggers helfen, die Prefill-Parameter einrichten und sicherstellen, dass das Pop-up-Formular korrekt über alle Browser und Geräte funktioniert.

 

Wenn du es selber auf deiner Produktseite 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 obige ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!

 

Dieser Prozess erfordert auch kein umfangreiches Programmierwissen, dennoch Kenntnisse in HTML, CSS, JavaScript und möglicherweise serverseitigem Scripting, falls du die Aktion des Formulars anpassen möchtest. Wenn diese Fähigkeiten über deine aktuellen Kenntnisse hinausgehen, könntest du in Betracht ziehen, ein No-Code-Tool wie Popupsmart zu verwenden, das den Prozess vereinfacht, oder einen Entwickler für Unterstützung zu beauftragen.

 

Hoffe das hilft dir weiter! 😉

 

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

5 ANTWORTEN 5

Gabe
Shopify Staff
16752 2646 3926

Hey @Niko1896 

 

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

 

Das Erstellen eines Angebotsanfrage-Formulars in Shopify mit vorausgefüllten Produktinformationen wie Name und SKU ist durchaus möglich, allerdings erfordert es einige Schritte zur Einrichtung und Anpassung.

 

Shopify bietet mit der Forms-App eine Möglichkeit, Formulare zu erstellen, die entweder als Pop-up oder Inline-Formular in deinem Shop erscheinen können. Die Forms-App ermöglicht es, verschiedene Arten von Formularen zu konfigurieren, darunter solche, die für Marketingzwecke, zur Kundengewinnung oder für spezifische Anfragen wie Angebotsanfragen genutzt werden können. Du kannst das Aussehen des Formulars anpassen, um es deiner Marke anzupassen, und bestimmte Felder hinzufügen, wie zum Beispiel Vorname, Nachname, E-Mail-Adresse oder Telefonnummer.

 

Für die spezifische Anforderung, Produktinformationen automatisch in das Formular zu integrieren, gibt es keine direkte Standardlösung in Shopify. Es erfordert wahrscheinlich ein gewisses Maß an benutzerdefinierten Anpassungen. In der Regel werden hierfür benutzerdefinierte Skripte oder Apps verwendet, die auf der Produktseite eingebunden werden und die erforderlichen Informationen automatisch in das Formular eintragen.

 

Es gibt auch verschiedene Apps im Shopify App Store, die erweiterte Formularfunktionen bieten und möglicherweise die gewünschten Anpassungen unterstützen. Alternativ kannst du auch die Dienste eines Shopify-Entwicklers in Anspruch nehmen, der dir bei der Erstellung eines maßgeschneiderten Formulars helfen kann.

 

Um ein Angebotsanfrage-Formular in deinem Shopify-Shop zu erstellen, das automatisch Produktinformationen wie Name und SKU einfügt, gibt es mehrere Apps im Shopify App Store, die dir helfen können:

  1. AAA Form Builder: Custom Forms: Diese App ermöglicht es dir, benutzerdefinierte Formulare einfach und ohne Programmierkenntnisse zu erstellen. Sie bietet Funktionen wie Drag & Drop-Formularerstellung, bedingte Logik, Online-Zahlungssammlung und Integrationen mit Drittanbietern wie Mailchimp und Klaviyo. Du kannst deine Formulare mit persönlicher Markenbildung gestalten und sie an beliebigen Stellen in deinem Shop anzeigen​​.

  2. Formify: Custom Checkout Forms: Diese App revolutioniert den Checkout-Prozess, indem sie es dir ermöglicht, benutzerdefinierte Formulare direkt im Checkout-Prozess zu erstellen. Mit Formify kannst du spezifische Bestelldetails, zusätzliche Versandinformationen oder persönliche Präferenzen der Kunden erfassen, und das alles ohne Codierung​​.

  3. Acerill Form Builder: Diese App bietet unbegrenzte Formulare und Einreichungen, flexible Verhaltensweisen bei Einreichungen (z. B. E-Mail, Google Sheets, Shopify-Integrationen) und unterstützt verschiedene Integrationen. Sie bietet auch eine kostenlose Version an, mit der du unbegrenzte Formulare und Einreichungen erstellen kannst​​.

  4. Custom Form Builder by Websyms: Diese App bietet vollständig anpassbare Felder und das Aussehen des Formulars. Sie kann Formulareinreichungen in der App oder per E-Mail speichern, automatische Antworten einrichten und unterstützt Integrationen mit Mailchimp, Stripe und PayPal​​.

Zusammenfassend lässt sich sagen, dass die Erstellung eines solchen Formulars möglich ist, aber je nach den genauen Anforderungen und deinem technischen Know-how entweder durch die Verwendung von Apps oder durch benutzerdefinierte Entwicklungen realisiert werden muss.

Weitere Informationen zur Forms-App findest du im Shopify Help Center und Details zu Pop-up-Formularen sind ebenfalls dort verfügbar.

---
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

Niko1896
Tourist
6 0 3

Hi Gabe,

 

danke dir für die ausführliche Antwort.

Ich habe Bilder angehangen um dies einmal darzustellen.

 

Angebot anfordern.pngAngebot anfordern1.png

 

Ich suche mir meinen Artikel aus, den ich gerne möchte und kann dann ein Angebot anfordern. Dies ist für Kunden interessant, die für ihre Mannschaft einen kompletten Satz davon bestellen möchten. Deswegen bin ich sehr daran interessiert, dass der Artikelname, sowie die SKU von dem angezeigten Artikel in das Formular übernommen wird. Ich habe das Theme Reformation, wo schon dieses Art Popup von rechts rauskommt, wie auf dem zweiten Bild. So stelle ich mir das vor. Leider habe ich nicht das richtige bei deiner Antwort gefunden, um das zu realisieren.

Gabe
Shopify Staff
16752 2646 3926

Erfolg.

Hey @Niko1896 

 

Danke für die Bilder und um ein Pop-up-Formular auf deiner Webseite zu implementieren, das automatisch mit dem Produktnamen und der SKU gefüllt wird, wenn ein Nutzer auf den Button "Angebot anfordern" klickt, kannst du folgende allgemeine Schritte befolgen:

  • Button zum Öffnen des Pop-up-Formulars hinzufügen: Du musst einen Button auf deiner Produktseite hinzufügen, den die Nutzer anklicken können, um ein Angebot anzufordern. Dieser Button sollte so programmiert sein, dass er das Pop-up-Formular auslöst.
  • Das Pop-up-Formular erstellen: Das Formular selbst kann mit HTML gebaut und mit CSS gestaltet werden, um zum Design deiner Webseite zu passen. W3Schools bietet eine umfassende Anleitung, wie du ein Pop-up-Formular mit CSS und JavaScript erstellen kannst​​.
  • Formularfelder mit Produktinformationen automatisch ausfüllen: Um das Formular mit dem Produktnamen und der SKU automatisch auszufüllen, kannst du Smart-Tags oder URL-Parameter verwenden. Die Prefill-Funktion von Popupsmart ermöglicht es dir, dynamischen Textersatz zu verwenden, um Benutzerinformationen zu sammeln und in die Formularfelder einzufügen. Beispielsweise kannst du das Formular so konfigurieren, dass beim Klicken des Angebot-anfordern-Buttons die URL Parameter wie ?productName=BlueJersey&sku=123456 enthält, welche das Pop-up-Formular dann lesen und verwenden kann, um die Felder vorab auszufüllen​​.

  • Das Pop-up-Formular als Modal anzeigen: Du kannst JavaScript verwenden, um das Formular als Modal-Pop-up erscheinen zu lassen, was sicherstellt, dass es vor dem aktuellen Inhalt erscheint und der Nutzer auf derselben Seite bleibt. Dies ist eine gängige Praxis, um die Aufmerksamkeit des Nutzers auf das Formular zu lenken und die Navigation weg von der Seite zu verhindern.

  • Anpassen und Speichern des Pop-up-Formulars: Mit Popupsmart kannst du das Erscheinungsbild deines Pop-up-Formulars anpassen, Formularfelder hinzufügen, das Targeting einrichten und es bei Bedarf mit deinem E-Mail-Automatisierungsdienst integrieren. Du kannst das Formular so einrichten, dass es auf bestimmte Auslöser wie einen Button-Klick reagiert, und es dann zum Veröffentlichen speichern​​.

Für eine nicht-technische Person könnte die Einrichtung eines solchen Systems eine Herausforderung sein, und es könnte notwendig sein, die Hilfe eines Webentwicklers in Anspruch zu nehmen. Der Entwickler kann beim Erstellen des Button-Triggers helfen, die Prefill-Parameter einrichten und sicherstellen, dass das Pop-up-Formular korrekt über alle Browser und Geräte funktioniert.

 

Wenn du es selber auf deiner Produktseite 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 obige ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!

 

Dieser Prozess erfordert auch kein umfangreiches Programmierwissen, dennoch Kenntnisse in HTML, CSS, JavaScript und möglicherweise serverseitigem Scripting, falls du die Aktion des Formulars anpassen möchtest. Wenn diese Fähigkeiten über deine aktuellen Kenntnisse hinausgehen, könntest du in Betracht ziehen, ein No-Code-Tool wie Popupsmart zu verwenden, das den Prozess vereinfacht, oder einen Entwickler für Unterstützung zu beauftragen.

 

Hoffe das hilft dir weiter! 😉

 

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

Niko1896
Tourist
6 0 3

Danke dir Gabe,

 

ich habe jetzt diese App S:Request a Quote & Hide Price probiert, und die ist genau das, was ich gesucht habe.
Kann ich nur empfehlen. Ein toller und schneller Support

Gabe
Shopify Staff
16752 2646 3926

Super freut mich und die Demo habe ich jetzt getestet - nicht schlecht! Kostenloser Plan auch verfügbar!

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