Wir kennen das Problem: Sie möchten die vollständige Gestaltungsfreiheit von Figma, benötigen aber die robuste Datenverarbeitung von HubSpot. Heute überbrücken wir diese Lücke.
Wir freuen uns, eine neue Funktion einzuführen, die es Ihnen ermöglicht, Ihre in Figma erstellten Formulare über intelligentes Field Mapping und Transjt direkt mit nativen HubSpot-Formularen zu verknüpfen.
Hier finden Sie eine Schritt-für-Schritt-Anleitung, um diesen neuen Workflow zu meistern.
Beginnen Sie dort, wo Sie am kreativsten sind - in Figma. Entwerfen Sie Ihr Formular genau so, wie Sie es haben möchten.
Hinweis: Sie können alle Standardfeldtypen (Eingaben, Kontrollkästchen, Dropdowns, Radios usw.) verwenden, aber bitte schließen Sie die Datei-Upload-Funktion für diese Integration aus.
Sobald Ihr Entwurf fertig ist:
Importieren Sie den Formularentwurf in transjt.ai
Verwenden Sie die transjt-Exportfunktion, um das Modul in Ihr HubSpot-Portal zu übertragen.
Wechseln Sie nun zu Ihrem HubSpot-Konto.
Erstellen Sie zunächst ein natives HubSpot-Formular.
Stellen Sie sicher, dass dieses Formular genau die gleichen Felder wie Ihr Entwurf enthält (z. B. Vorname, E-Mail, Unternehmen usw.).
Pro-Tipp: Wenn Ihr Entwurf benutzerdefinierte Datenpunkte enthält (z. B. "Bevorzugte Anrufzeit"), müssen Sie möglicherweise zunächst benutzerdefinierte Eigenschaften in HubSpot erstellen und diese dann zu Ihrem nativen Formular hinzufügen.
Dies ist der Moment, in dem die Magie passiert. Sie müssen dem entworfenen Formular genau mitteilen, wohin die Daten für jedes spezifische Feld gesendet werden sollen.
Gehen Sie zurück zu Ihrem entworfenen Formular in HubSpot und suchen Sie den Abschnitt "Fields Mapping" auf der linken Seite des Formularkonfigurationsfensters. Für jedes Eingabefeld in Ihrem Entwurf müssen Sie einen spezifischen Mapping-String basierend auf dem HubSpot-Objekttyp und dem Wert (interner Name) hinzufügen.
Die Syntax ist einfach: ObjektTyp:InternerName
Objekt-Typ: Normalerweise Kontakt oder Unternehmen.
Wert: Der interne Name der Eigenschaft in HubSpot (z. B. firstname, email, call_time).
Angenommen, Sie haben ein benutzerdefiniertes Feld, das Leads nach ihrer bevorzugten Anrufzeit fragt.
Überprüfen Sie HubSpot: Sie haben eine Eigenschaft mit dem Objekttyp " contact" und dem internen Namen " call_time" erstellt.
Erstellen Sie den String: Kombinieren Sie sie, um contact:call_time zu erhalten.
Auf das entworfene Formular anwenden: Geben Sie im Abschnitt "Fields Mapping" für dieses spezifische Eingabefeld ein: contact:call_time
Sobald das schöne Frontend zugeordnet ist, fungiert HubSpot als das leistungsstarke Backend. Wenn ein Benutzer in Ihrem benutzerdefinierten Design auf "Senden" klickt, landen die Daten sofort im richtigen Feld in Ihrem CRM.
Vollständige Designkontrolle: Kein Kampf mehr mit dem Standard-Styling von HubSpot.
Saubere Daten: Ordnen Sie Felder präzise zu, damit Ihre Datenbank übersichtlich bleibt.
Nahtlose Integration: Lassen Sie Ihre Marketing-Automatisierung laufen, ohne einen Takt zu verpassen.