Das Kontaktformular dient als entscheidendes Instrument zur Erleichterung der Kommunikation zwischen Einzelpersonen oder Unternehmen. Es bietet Benutzern eine bequeme und organisierte Möglichkeit, Kontakt aufzunehmen und ihre Fragen zu äußern. Sie können damit auch Bewerbungen, Kontaktanfragen und Meinungsumfragen entgegennehmen.
Mithilfe des Abschnitts „Kontakt“ können Sie ganz einfach eine Kontaktseite auf Ihrer Website erstellen.
In diesem Artikel:
-
- Hinzufügen eines Kontaktbereichs zu einer Seite
- Kontaktformular verwalten
- Inhalt des Kontaktformulars
- Formularfelder verwalten
- Arten von Feldern
- Inline-Formular und Popup-Formular
- Layout verwalten
- Style-Kontaktformular
- Kontaktformulareinstellungen
- Formular auf eine andere Seite umleiten
- Formulardaten exportieren
- E-Mail Benachrichtigungen
- Gesendete Formulardaten
- Live-Beispiel
Hinzufügen eines Kontaktbereichs zu einer Seite
- Auf deiner Seite, Klicken Sie auf blau + Symbol um einen neuen Abschnitt zu Ihrer Seite hinzuzufügen.
- Sie sehen jetzt die Abschnittskategorien auf der linken Seite.
- Wähle die Online Formulare (1) Kategorie und klicken Sie auf die Kontakt Registerkarte (2), aus der Sie wählen können verschiedene Layouts Kontakt (3) Abschnitt.
- Wählen Sie ein beliebiges Abschnittslayout und klicken Sie darauf, um es Ihrer Seite hinzuzufügen.
Kontaktformular verwalten
- Klicken Sie auf Inhalt bearbeiten (1) Taste.
- Sie haben die Möglichkeit zu verwalten Inhalt (2) Layout (3) Design (4) Einstellungen (5) und E-Mail Benachrichtigungen (6).
- Hit Gespeichert (7) die Änderungen auf das Formular anzuwenden.
Inhalt des Kontaktformulars
Dies ist ein wichtiger Teil des Formulars, da Sie das Bild hochladen oder ändern. Geben Sie hier Titel und Beschreibung ein, damit Benutzer eine Vorstellung vom Zweck des Formulars selbst bekommen. Durch die sorgfältige Ausarbeitung eines prägnanten, beschreibenden Titels und einer informativen, überzeugenden Beschreibung können Sie die Kommunikation verbessern und starke Verbindungen zu den Besuchern Ihrer Website aufbauen.
Formularfelder verwalten
Unter Formularfelder verwalten können Sie die Felder angeben, die Besucher in diesem Formular ausfüllen sollen.
- Klicken Sie auf Neues Feld hinzufügen (1) Schaltfläche zum Hinzufügen weiterer Felder zu Ihrem Formular.
- Bearbeiten oder löschen (2) ein bereits hinzugefügtes Feld.
- Drag and Drop (3) die Reihenfolge der Felder im Formular zu ändern.
- Setze die Beschriftung der Schaltfläche „Aufruf zum Handeln“ (4) für das Formular.
Das E-Mail-Feld ist im Formular obligatorisch und kann nicht gelöscht werden.
Beim Klick auf die + Feld hinzufügen Klicken Sie auf die Schaltfläche, um ein Popup zu öffnen, in dem Sie Ihre Formularfelder auswählen können.
- Erfassen Sie die Name Ihres Auftraggebers.
- Erfassen Sie alle kleinen Informationen über die Kurzer Text Feld.
- Erfassen Sie alle ausführlichen Informationen/Nachrichten über das Langer Text Feld.
- Erfassen Sie die E-Mail Ihres Auftraggebers.
- Erfassen Sie alle Zahlenangaben von Ihrem Auftraggeber.
- Fügen Sie Dienste zur Auswahl hinzu Dropdown- Weise.
- Einzelauswahl: Fügen Sie eine Radioauswahl für Ihre Dienste hinzu.
- Mehrfachauswahl: Fügen Sie ein Kontrollkästchenfeld für die Mehrfachauswahl hinzu.
- Hinzufügen Datumsauswahl damit Ihre Kunden für jede Veranstaltung einen Termin auswählen können.
- Hinzufügen Linie zwischen den Formularfeldern.
- Erfassen Sie die Adresse Ihres Auftraggebers.
- Erfassen Sie die Website Ihres Auftraggebers.
- Erfassen Sie die Telefon Anzahl Ihres Auftraggebers.
- Hinzufügen Zeit Feld, damit Ihre Kunden die Veranstaltungszeit selbst festlegen können.
- Hinzufügen Separator zwischen den Formularfeldern.
- Das Einwilligungsfeld Mit dieser Option können Berechtigungen für Newsletter eingeholt und Datenschutz und Nutzungsbedingungen akzeptiert werden.
- Nehmen Sie Kundenbewertungen mit dem auf star Treppe, Zahlenskala und Smiley-Skala.
- Beim Hinzufügen bestimmter Felder haben Sie die Möglichkeit, die Breite zwischen „Voll“, „Halb“ und „Ein Drittel“ zu wählen
- Sie können Felder auch nebeneinander anzeigen lassen, indem Sie die Option „Halb“ oder „Ein Drittel“ wählen
Formularstil
- Formular als Popup anzeigen – Aktivieren Sie diese Option, um das Formular durch Klicken auf die Schaltfläche „Aktion“ in einem Popup-Fenster zu öffnen.
- Beschriftung der Schaltfläche „Handlungsaufforderung“ – Stellen Sie die Beschriftung der Schaltfläche „Aufruf zum Handeln“ für das Formular.
- Überschriften-Popup – Geben Sie die Form an Überschrift, wenn überhaupt.
- Hochladen oder löschen (1) das Formularbild für das Formular.
- Hinzufügen Titel (2), und Beschreibung (3) für das Formular. Überprüfen Sie dies, bevor Sie die Beschreibung hinzufügen fehlen uns die Worte. Artikel.
Schlagzeile
- Schlagzeile – Geben Sie die Abschnittsüberschrift (1) für den Abschnitt „Zahlungsformular“.
- Schaltflächen und Symbole – Erfahren Sie mehr über Schaltflächen und Symbole (2).
Verwalten des Layouts
- Klicken Sie auf Inhalt bearbeiten (1) Taste.
- Wähle die Layout (2) Registerkarte.
- Wähle aus Layout für Ihren Abschnitt (3) und Gespeichert (4) die Änderungen.
Durch Ändern des Layouts wird der Standardstil des Formulars angewendet.
Style-Kontaktformular
Die Gestaltung eines Kontaktformulars ist ein wichtiger Aspekt für die Schaffung eines optisch ansprechenden und benutzerfreundlichen Erlebnisses.
Sie haben mehrere Stiloptionen für den Abschnitt:
- Formularfelder
- Ausrichtung
- Text
- Abstand
- Schlagzeile
- Bilder
- Bildrand
- Popup-Schaltfläche
- Formularschaltfläche
- Überschriften-Schaltflächen
- Schlagzeilen-Symbole für soziale Netzwerke
Formularfelder
Pixpa erlaubt Sie zu voll anpassen die Aussehen of Wir koordinieren den Versand unten stehende Formular Felder. Diese Styling Optionen sich bewerben zu alle Varianten des Eingangssignals: Felder in Wir koordinieren den Versand Kontakt Form als auch schenken Sie mehr Kontrolle gegenüber wie Wir koordinieren den Versand unten stehende Formular Aussehen als auch fühlt sich on Wir koordinieren den Versand Webseite.
- Form: Wählen Sie die Form Ihrer Eingabefelder – beispielsweise Rechteck, abgerundet, Pille oder Text – passend zur Ästhetik Ihrer Website.
- Füllen: Aktivieren Sie diesen Schalter, um Ihren Formularfeldern eine Hintergrundfüllfarbe zuzuweisen.
- Grundfarbe: Legen Sie die Hintergrundfarbe der Felder fest, wenn die Fülloption aktiviert ist.
- Outline: Schalten Sie den Rahmen (Umriss) für jedes Feld ein oder aus.
- Umrissfarbe: Wählen Sie die Farbe des Feldrahmens, wenn die Umrandung aktiviert ist.
- Feldtextfarbe: Legen Sie die Farbe des von Benutzern in die Formularfelder eingegebenen Textes fest.
- Größe: Passen Sie die Höhe Ihrer Felder an, indem Sie zwischen „Klein“, „Mittel“, „Groß“ und „Extragroß“ wählen.
- Etiketten: Wählen Sie, ob die Beschriftungen der Formularfelder innerhalb oder außerhalb des Felds angezeigt werden.
- Etikettenfarbe: Definieren Sie die Farbe der Beschriftungen, wenn diese außerhalb des Felds platziert werden.
- Farbe der Innenseite des Etiketts: Legen Sie die Farbe für Beschriftungen fest, die innerhalb des Felds platziert werden (hilfreich für Beschriftungen im Platzhalterstil).
- Abstand zwischen den Feldern: Verwenden Sie den Schieberegler, um den vertikalen Abstand (in Pixeln) zwischen den einzelnen Formularfeldern festzulegen.
Ausrichtung
- Verwalten Sie die horizontale Ausrichtung des Formularinhalts Horizontale Ausrichtung (1).
- Verwalten Sie die vertikale Ausrichtung des Formularinhalts Vertikale Ausrichtung (2).
Text
- Klicken Sie auf Textstil ändern (1) Schaltfläche zum Besuchen der Technologie Abschnitt und Verwalten Sie Ihre Schriftgrößen und -stile.
- Präzisiere das Titel (2) Schriftart des Formulars.
- Präzisiere das Beschreibung (3) Schriftart des Formulars.
Abstand
- Präzisiere das Bildbreite (1) des Bildes in der Form in Prozent.
- Präzisiere das Abstand zwischen Bild und Text (3) in Prozent.
- Präzisiere das Leerzeichen unter dem Titel (4) in Prozent.
Schlagzeile
- Horizontal ausrichten der Abschnittsüberschriftstext. Sie können ihn auf Links, Mitte und Rechts einstellen.
- Aktivieren/Deaktivieren der Trennwand zwischen der Abschnittsüberschrift und dem Abschnittsinhalt.
- Setze die Dicke der Trennwand (in px).
- Präzisiere das Teilerfarbe aus dem Farbwähler.
- Wähle ein Teilerstil aus dem Dropdown.
- Setze die Überschriftenbreite um festzulegen, wie breit der Abschnittstitel angezeigt wird, beginnend bei einem Minimum von 50 %.
- Präzisiere das Platz unter der Überschrift innerhalb des Abschnitts (in px).
Bilder
- Bildausschnitt: Wähle die IMagier Crop für die Listenelemente. Sie können die Bilder als „Quadrat“, „Kreis“, „Horizontal“, „Hochformat“ und „Original“ festlegen.
- Eckenradius: Wählen Sie einen gemeinsamen Eckenradius oder einen anderen Eckenradius für jede Seite der Listenelemente und legen Sie eine Zahl (in px) für die fest COrdner Radius der Listenelementbilder. WEITERE INFORMATIONEN .
- Hover-Animation: Wählen Sie auf Animieren Sie das Bild des Abschnitts beim Hovern durch Aktivieren des Umschalters. Überprüfen Sie diese Funktion auf einer Live-Seite.
- Animationsstil: Wähle ein Animationsstil für Bilder, wenn der Cursor darüber schwebt.
- Formmaske: Aktivieren Sie diesen Schalter, um den Bildern in der Bildliste eine Formmaske zuzuweisen. Sobald diese Option aktiviert ist, schneidet die ausgewählte Form das Bild optisch in diese Form.
- Form auswählen: Wählen Sie aus verschiedenen vordefinierten Formen für Ihre Bilder. So können Sie Ihre Inhalte kreativ gestalten, indem Sie Bilder in einzigartigen Formen wie rund, rautenförmig, tropfenförmig usw. darstellen.
Verwendung der Eckenradius können Sie verschiedene Formen von Listenelementbildern erstellen. Wenn Sie hier 500 px angeben, werden die Bilder kreisförmig angezeigt.
- Falls Sie geteilte Ecken gewählt haben, können Sie für jede Ecke einen anderen Eckenradius einstellen.
Bildrand
- Rand aktivieren/deaktivieren um das Bild, indem Sie den Schalter umlegen.
- Wählen Sie eine gemeinsame Grenze auf allen Seiten des Bildes oder Sie können die Grenzen separat für jede Seite.
- Präzisiere das Breite der Grenze. Wenn es auf 0 gesetzt ist, wird der Rand nicht angezeigt. Sie haben auch die Möglichkeit, die Randbreite für jede Seite des Bildes individuell festzulegen.
- Wähle aus Rahmenfarbe aus dem Farbwähler.
- Wählen Sie eine bevorzugte aus Border Style aus dem Dropdown.
- Bestimmen Sie die Randbreite für Mobilgeräte Geräte und richten Sie es an der für den Desktop gewählten Breite aus.
Popup-Schaltfläche
Diese Stiloptionen gelten für die Popup-Schaltfläche, bei der das Kontaktformular geöffnet wird, wenn auf die Schaltfläche geklickt wird.
- Knopfgröße - Wählen Sie die Größe der Schaltfläche aus Optionen wie „klein“, „mittel“ oder „groß“ aus.
- Platz über der Schaltfläche – Passen Sie den vertikalen Abstand über der Schaltfläche an (in Prozent).
- Schaltflächenstil – Wählen Sie den Stil der Schaltfläche, z. B. Standard oder Benutzerdefiniert.
- Knopffarbe - Wählen Sie den Farbstil für die Schaltfläche. Zur Auswahl stehen Standard, Invertieren und Benutzerdefiniert.
- Schaltflächentext – Passen Sie die Textfarbe für die Schaltfläche an.
- Button-Hintergrund – Wählen Sie die Hintergrundfarbe für die Schaltfläche aus.
Formularschaltfläche
Mit diesen Einstellungen können Sie die Schaltfläche zum Senden des Formulars anpassen, damit sie zum Design und Layout der Seite passt.
- Knopfgröße - Wählen Sie die Größe der Schaltfläche (Klein, Mittel oder Groß).
- Platz über der Schaltfläche – Passen Sie den vertikalen Abstand über der Schaltfläche an (in Prozent angegeben).
- Schaltflächenstil – Wählen Sie den Gesamtstil der Schaltfläche, z. B. „Standard“ oder „Benutzerdefiniert“.
- Knopffarbe - Legen Sie den Farbstil der Schaltfläche fest. Zu den Optionen gehören „Standard“, „Invertieren“ und „Benutzerdefiniert“.
- Schaltflächentext – Passen Sie die auf der Schaltfläche angezeigte Textfarbe an.
- Button-Hintergrund – Wählen Sie eine Hintergrundfarbe für die Schaltfläche.
- Tastenausrichtung – Wählen Sie die Ausrichtung der Schaltfläche (Links, Mitte oder Rechts).
- Schaltflächenbreite – Passen Sie die Breite der Schaltfläche an. Zur Auswahl stehen „Standard“, „Groß“, „Extragroß“ und „Volle Breite“.
Überschriften-Schaltflächen
Diese Einstellungen steuern das Erscheinungsbild und den Abstand der Schaltflächen, die mit der Überschrift des Abschnitts platziert werden.
- Knopfgröße - Wählen Sie die Gesamtgröße der Schaltflächen (Klein, Mittel oder Groß).
- Abstand zwischen den Schaltflächen – Passen Sie den Abstand zwischen mehreren Schaltflächen an (gemessen in vw).
- Platz über den Schaltflächen – Legen Sie den vertikalen Abstand über den Schaltflächen fest (gemessen in Prozent).
- Schaltflächenbreite – Wählen Sie, wie breit die Schaltflächen angezeigt werden sollen. Zur Auswahl stehen „Standard“, „Groß“, „Extragroß“ und „Volle Breite“.
- Textlinkgröße – Geben Sie die Schriftgröße der mit Schaltflächen verknüpften Textlinks an (gemessen in px).
- Bildschaltflächengröße – Passen Sie die Größe bildbasierter Schaltflächen an (gemessen in Pixeln).
Schlagzeilen-Symbole für soziale Netzwerke
Zeigen Sie Social-Sharing-Symbole im Formular an und passen Sie sie an.
- Symbolgröße – Passen Sie die Größe der Social Icons an (gemessen in px).
- Symboltyp – Wählen Sie den Stil der Symbole, z. B. „Klassisch“, „Durchgehend“ oder „Umriss“.
- Symbolfarbe – Wählen Sie die Farbe für die Symbole. Zu den Optionen gehören Linktext, Benutzerdefiniert oder Markenfarbe (Originalfarbe der sozialen Plattform).
- Symbolhintergrundfarbe – Legen Sie eine benutzerdefinierte Hintergrundfarbe für die Symbole fest, um Sichtbarkeit und Stil zu verbessern.
Kontaktformulareinstellungen
- Klicken Sie auf Inhalt bearbeiten (1) Taste.
- Passen Sie die Formulareinstellungen an von Einstellungen (2) Tab und Gespeichert (3) Ihre Änderungen.
Formularname
- Geben Sie einen Namen ein Kontaktformular identifizieren in Pixpa Studio. Dieser Name ist für Website-Besucher nicht sichtbar.
Aktion nach der Einreichung
Als Aktion nach der Übermittlung können Sie sich dafür entscheiden Erfolgsmeldung anzeigen (1) oder Umleitung auf URL (2).
Im Falle von Erfolgsmeldung anzeigen (1):
- Präzisiere das Erfolgsmeldung (2) wird angezeigt, nachdem der Benutzer das Formular abgeschickt hat.
- Sie können auch ein beliebiges Skript in hinzufügen Erfolg nach der Zahlung HTML (3) Box.
- Im Falle von RWeiterleitung zur URLSie können jede beliebige interne/externe Seite angeben, indem Sie auf das Symbol „Einstellungen“ (⚙️) klicken. WEITERE INFORMATIONEN .
Formular auf eine andere Seite umleiten
Das Weiterleiten von Benutzern auf eine bestimmte Seite nach dem Absenden eines Formulars kann die allgemeine Benutzererfahrung verbessern und dient verschiedenen Zwecken, wie z. B. der Vermeidung doppelter Übermittlungen, Analysen und Nachverfolgungen, dem Verbleib von Benutzern auf der Website für einen längeren Zeitraum usw.
Eine Weiterleitung kann einfach mit erstellt werden Aktion nach der Einreichung Option auf der Registerkarte „Einstellungen“.
- Sie können eine Weiterleitung innerhalb Ihrer Website erstellen Inhalt der Website (1) Option. Es kann sich um eine Seite, eine Galerie, ein Blog, eine E-Commerce-Galerie, einen Ordner usw. handeln. Sie müssen den Namen des Elements in das Feld eingeben, wie im Screenshot unten gezeigt, und Sie erhalten entsprechende Vorschläge.
- Arbeiten jederzeit weiterbearbeiten können. Jede Präsentation und jeder KI-Avatar, den Sie von Grund auf neu erstellen oder hochladen, Externer Link (2) Option zum Erstellen einer Weiterleitung außerhalb Ihrer Website. Sie müssen die URL in das Feld eingeben, zu dem die Benutzer nach dem Absenden des Formulars weitergeleitet werden sollen.
Erfahren Sie mehr über wie man Linkbuilder verwendet.
Formulardaten synchronisieren und exportieren
- Formulardaten an Make.com senden. Mehr erfahren.
- Formulardaten an Zapier.com senden. Mehr erfahren.
- Exportieren Sie die Formulardaten als CSV-Datei. Mehr erfahren.
E-Mail Benachrichtigungen
Von hier aus können Sie den E-Mail-Betreff für die Benachrichtigungen anpassen, die Sie als Websitebesitzer nach erfolgreicher Formularübermittlung erhalten. Darüber hinaus können Sie die Erfolgs-E-Mail personalisieren, die an Benutzer oder Kunden gesendet wird, nachdem sie das Formular übermittelt haben. Diese Funktion kann für Branding, Marketing und die Durchführung effektiver Kampagnen genutzt werden.
- E-Mail an den Websitebesitzer: Aktivieren oder deaktivieren Sie E-Mail-Benachrichtigungen für Formulareinsendungen. Wenn diese Option aktiviert ist, werden Benachrichtigungen an die angegebenen E-Mail-Adressen gesendet.
- Thema: Passen Sie die Betreffzeile der E-Mail an. Verwenden Sie die {WEBSEITE} Variable, um den Websitenamen dynamisch in den Betreff einzufügen. Dies ist nützlich, wenn Sie mehrere Websites haben.
- Email: Geben Sie bis zu 3 E-Mail-Adressen an, die benachrichtigt werden sollen, wenn das Formular übermittelt wird.
- Präzisiere das Betreff der E-Mail zur Übermittlung des Kontaktformulars. Sie können auch Folgendes angeben {WEBSEITE} Variable, um den Namen der Website einzuschließen.
E-Mail an den Kunden
- Sie können aktivieren E-Mail an den Kunden (1) um eine E-Mail über den erfolgreichen Versand des Formulars zu senden.
- Präzisiere das Betreff (2) der Post.
- Geben Sie den Inhalt der E-Mail an Erfolgsmeldung (3).
- E-Mail an Kunden ist eine Premium-Funktion, die nur verfügbar ist auf Professionell und Fortgeschritten Pläne. Mehr erfahren.
- Passen Sie den E-Mail-Inhalt sorgfältig an, um ein konsistentes und professionelles Kommunikationserlebnis mit Ihren Kunden zu gewährleisten.
Gesendete Formulardaten
Zu den übermittelten Formulardaten in einem Kontaktformular gehören die Informationen, die ein Benutzer beim Absenden in die Formularfelder eingibt.
- Alle Formulardaten werden gespeichert und sind über die zugänglich Formular-Einreichungen Seite des Ateliers. Mehr erfahren.
- Alle über das Kontaktformular übermittelten Daten werden auch an die in den Kontaktformulareinstellungen angegebene E-Mail-ID weitergeleitet. Dein Konto E-Mail-Adresse wird als Standard übernommen.
Überprüfen Sie auch: Konto-E-Mail-Adresse ändern.
Live-Beispiel
Hier ist ein Live-Popup-Kontaktformular:
Sehen Sie sich eine Live-Demo-Site an.
Hier ist ein Live-Inline-Kontaktformular:
Sehen Sie sich eine Live-Demo-Site an.
Um Spammer auf dem Formular zu reduzieren, wird die Google Captcha-Sicherheit automatisch auf Ihrem Formular aktiviert.