Den Formularblock im Theme-Editor hinzufügen

Sami B2B Onboarding fügt Ihrem Theme einen Block B2B application form hinzu. Er zeigt ein Formular als eigenen Abschnitt in einer Seitenvorlage an, sodass Sie eigene Abschnitte darüber und darunter platzieren können, etwa ein Banner oder eine Liste der Vorteile für Großhandelskundschaft.

Hinweis

Bevor Sie beginnen: Das Formular muss veröffentlicht sein (Active unter Forms). Lassen Sie auch die App-Einbettung aktiviert, damit Ihre Einstellungen zum Shop-Zugang auf der Seite gelten. Siehe App-Einbettung aktivieren.

Eine Vorlage für das Formular wählen

Ein Abschnitt, der einer Seitenvorlage hinzugefügt wird, erscheint auf jeder Seite, die diese Vorlage nutzt. Die meisten Seiten verwenden die Standard-Seitenvorlage Ihres Themes, auch die Seite, die die App für Ihr Formular erstellt hat und die das Formular bereits enthält. Um das Formular nur auf einer Seite anzuzeigen, geben Sie dieser Seite wie in den folgenden Schritten eine eigene Vorlage.

Den Block in einer eigenen Vorlage hinzufügen

1. Den Theme-Editor öffnen

   Gehen Sie in Ihrem Shopify Admin zu Onlineshop › Themes und klicken Sie bei Ihrem aktuellen Theme auf Theme bearbeiten.

2. Eine Seitenvorlage erstellen

   Öffnen Sie oben im Theme-Editor das Vorlagenmenü (es zeigt Startseite, wenn der Editor sich öffnet). Wählen Sie Seiten und dann Vorlage erstellen. Geben Sie ihr einen Namen, zum Beispiel wholesale, basieren Sie sie auf Standardseite und klicken Sie auf Vorlage erstellen.

   Der Editor wechselt zur neuen Vorlage.

3. Den Formularabschnitt hinzufügen

   Klicken Sie in der linken Seitenleiste unter Vorlage auf Abschnitt hinzufügen, öffnen Sie den Tab Apps und wählen Sie B2B application form.

   Das Formular wird als Block in einem Abschnitt Apps hinzugefügt, und die Vorschau zeigt darin Ihr Standardformular. Im Theme-Editor sehen Sie immer das Formular selbst, auch wenn Sie in Ihrem Shop angemeldet sind.

   

   Abschnitt hinzufügen unter Vorlage, dann im Tab Apps B2B application form wählen.

4. Das Formular auswählen

   Klicken Sie in der Seitenleiste unter Apps auf B2B application form. Im Feld Form:

   • lassen Sie es leer, um Ihr Standardformular anzuzeigen, oder
   • geben Sie den Slug eines anderen Formulars ein, den kurzen Namen, nach dem der Hilfetext des Feldes fragt.

   Den Slug eines Formulars finden Sie so: Gehen Sie in der App zu Forms, klicken Sie in der Zeile des Formulars auf … (More actions) und wählen Sie Copy embed code. Fügen Sie ihn an einer Stelle ein, an der Sie ihn lesen können: Der Slug ist der Text im letzten Anführungszeichenpaar. Für das Formular Wholesale application ist das wholesale-application.

   

   Lassen Sie Form leer für Ihr Standardformular oder geben Sie den Slug eines anderen Formulars ein.

5. Speichern

   Klicken Sie oben rechts im Theme-Editor auf Speichern.

6. Einer Seite die Vorlage zuweisen

   Gehen Sie in Ihrem Shopify Admin zu Onlineshop › Seiten. Öffnen Sie die Seite, die das Formular zeigen soll, oder klicken Sie auf Seite hinzufügen, um eine zu erstellen, und geben Sie ihr einen Titel, zum Beispiel Wholesale. Wählen Sie unter Theme-Vorlage die Vorlage wholesale und klicken Sie dann auf Speichern.

   Wählen Sie sie nicht für die Seite, die die App für das Formular erstellt hat: Diese Seite enthält das Formular bereits, es würde also doppelt erscheinen.

Die Verknüpfung in Forms nutzen

Die App hat eine Verknüpfung, die den Theme-Editor mit bereitem Block öffnet.

1. Die Verknüpfung öffnen

   Gehen Sie in der App zu Forms. Klicken Sie in der Zeile des Formulars auf … (More actions) und wählen Sie Add block in theme editor.

   

   Add block in theme editor öffnet den Theme-Editor mit hinzugefügtem Formularblock.

2. Das Formular wählen und speichern

   Der Theme-Editor Ihres aktuellen Themes öffnet sich mit der Standard-Seitenvorlage und dem hinzugefügten Block B2B application form. Klicken Sie auf den Block, geben Sie den Slug des Formulars in Form ein (oder lassen Sie das Feld für Ihr Standardformular leer) und klicken Sie dann auf Speichern.

Achtung

Die Verknüpfung fügt den Abschnitt Ihrer Standard-Seitenvorlage hinzu. Jede Seite, die diese Vorlage nutzt, zeigt dann das Formular, auch die Seite, die die App dafür erstellt hat und die das Formular dadurch doppelt zeigt. Um das Formular nur auf einer Seite anzuzeigen, verwenden Sie wie oben beschrieben eine eigene Vorlage.

In Ihrem Shop prüfen

1. Die Seite als Gast öffnen

   Öffnen Sie die Seite in Ihrem Shop in einem privaten Browserfenster, damit Sie sie wie jemand sehen, der nicht angemeldet ist. Das Formular erscheint in seinem Abschnitt, zwischen Ihren anderen Abschnitten.

2. Bei Bedarf beheben, was Sie sehen

   • This form is not available right now. Der Slug in Form passt zu keinem veröffentlichten Formular. Prüfen Sie die Schreibweise oder veröffentlichen Sie das Formular unter Forms.
   • Ein anderes Formular erscheint. Form ist leer, daher zeigt der Abschnitt Ihr Standardformular. Geben Sie den Slug des gewünschten Formulars ein oder machen Sie dieses Formular zum Standard, mit … (More actions) › Set as default unter Forms.

Wenn Sie Ihren Shop sperren, bleibt eine Seite aus Onlineshop › Seiten, die das Formular zeigt, für Besuchende offen. Siehe Den Shop sperren.

Nächste Schritte

• Formular gestalten – passen Sie Schriftart, Farben und Breite des Formulars an die Seite um es herum an.
• Den Einbettungscode einfügen – setzen Sie das Formular stattdessen in einen Custom-Liquid-Abschnitt oder einen Page Builder.
• Die von der App erstellte Formularseite nutzen – teilen Sie eine fertige Seite, wenn Sie keine gestaltete brauchen.