Einbettung von EdCommerce auf externen Websites

Last updated: October 16, 2026

Zusammengefasster Leitfaden zum Einbetten von EdCommerce-Inhalten auf externen Websites und Landingpages, der drei Methoden abdeckt. (1) Einbetten von Lead-Formularen: Kopieren Sie ein EdCommerce-Lead-Formular-iframe unter Einstellungen > E-Commerce > Formulare – entweder pro Büro über das 3-Punkte-Menü oder ein einzelnes Formular für alle Büros über die Schaltfläche „Iframe für Lead-Formular kopieren“ im oberen Menü – und fügen Sie den HTML-Code in jede externe Website oder jedes CMS wie WordPress/Elementor, Shopify oder Wix ein; passen Sie das Formular an, indem Sie die Iframe-URL bearbeiten und einen Sprachcode (EN, PT, ES, ES_MX, PT_BR, DE, IT, TR, FR, JA, KO) oder einen HEX-Code anhängen, um die Farbe der Schaltfläche „Absenden“ festzulegen. Nur Lead-Formulare können extern eingebettet werden – Buchungsformulare sind ausschließlich für EdCommerce bestimmt – und übermittelte Leads werden mit Edvisor synchronisiert, gemäß Ihren Geschäftsregeln automatisch dem richtigen Berater zugewiesen und in die richtige Pipeline und Phase eingeordnet. (2) Einbetten von Programm-Widgets: Erstellen Sie ein Widget unter Einstellungen > Widgets in EdCommerce, passen Sie sein Erscheinungsbild an und fügen Sie das generierte Code-Snippet in einen HTML-Block ein. Dazu gibt es Schritt-für-Schritt-Anleitungen für WordPress (Elementor und Visual Composer), Wix und Squarespace sowie verschiedene Anwendungsfälle. (3) Hinzufügen von EdCommerce zu WordPress: Verknüpfen Sie eine EdCommerce-Website über Darstellung > Menüs über einen individuellen Link mit einem WordPress-Navigationsmenü, indem Sie Ihre EdCommerce-URL verwenden (zu finden unter Einstellungen > EdCommerce > EdCommerce-Details); idealerweise sollte sich der Link in einem neuen Tab öffnen.

Mit EdCommerce können Sie Ihre Inhalte auf jede externe Website oder Landingpage bringen – ganz gleich, ob Sie Lead-Formulare einbetten, Programm-Widgets einbetten oder einen Link zu Ihrer EdCommerce-Website hinzufügen. Dieser Artikel behandelt alle drei Möglichkeiten.

EdCommerce-Formulare einbetten

EdCommerce bietet eine leistungsstarke Funktion, mit der Sie verschiedene Lead- und Buchungsformulare erstellen und personalisieren können. So können Sie ganz einfach die richtigen Informationen von Ihren Leads und Buchungen erfassen.

Hier zeigen wir Ihnen, wie Sie Ihre Lead-Formulare auf anderen Seiten Ihrer Website einbetten können, sodass Sie Leads nicht nur über Ihren Online-Shop, sondern über jede beliebige Webseite erfassen können.

\Diese Leads werden anschließend mit Ihrem Edvisor-Konto synchronisiert, automatisch den richtigen Beratern zugewiesen und der entsprechenden Pipeline und Phase hinzugefügt.*

*Wenn Sie Ihre Formulare noch nicht konfiguriert haben, lesen Sie diesen Artikel erneut, um zu erfahren, wie Sie Formulare auf Ihrer EdCommerce-Website einrichten und personalisieren.

**Bitte beachten Sie, dass nur Lead-Formulare auf Ihrer Website eingebettet werden können. Buchungsformulare sind ausschließlich für EdCommerce bestimmt.

So betten Sie Ihre EdCommerce-Formulare auf jeder Landingpage oder Website ein

  • Gehen Sie zu: Einstellungen > E-Commerce > Formulare.

Klicken Sie anschließend auf das 3-Punkte-Symbol neben jedem Büro und wählen Sie „Iframe für Lead-Formular kopieren“, wenn Sie ein für ein bestimmtes Büro erstelltes Formular einbetten möchten.

Oder klicken Sie einfach auf die Schaltfläche „Iframe für Lead-Formular kopieren“ im oberen Menü, um ein einheitliches Formular für alle Ihre Büros einzubetten.

Sie erhalten einen HTML-Code, den Sie kopieren und in Ihre Website einfügen können.

Wenn Sie ein CMS wie WordPress (mit einem Website-Builder wie Elementor oder Visual Composer), Shopify oder Wix verwenden, bieten diese in der Regel eine unkomplizierte Methode zum Einbetten von Inhalten mit HTML-Code-Snippets.

Dies ist normalerweise ein Widget oder ein Element in Ihrer Toolbox, das Sie einfach per Drag-and-drop verschieben können.

Wenn Sie beispielsweise einen Website-Builder wie Elementor verwenden, können Sie es über dessen HTML-Widget hinzufügen.

So passen Sie die Sprache Ihres Formulars an

Wenn Sie die Sprache des Lead-Formulars festlegen möchten, fügen Sie den Sprachcode am Ende der URL innerhalb des HTML-Codes hinzu:

Beispiel:

src="https://dev-virtual.edvisor.io/edvisor/ecommerce-campaign/lead-form-iframe/en"

Hier finden Sie die Sprachcodes für die verschiedenen verfügbaren Sprachen:

  • EN = Englisch
  • PT = Portugiesisch
  • ES = Spanisch
  • ES_MX = Lateinamerikanisches Spanisch
  • PT_BR = Brasilianisches Portugiesisch
  • DE = Deutsch
  • IT = Italienisch
  • TR = Türkisch
  • FR = Französisch
  • JA = Japanisch
  • KO = Koreanisch

So passen Sie die Farbe Ihrer Formulartaste an

Sie können auch die Farbe der Schaltfläche „Absenden“ in Ihren eingebetteten Lead-Formularen personalisieren, damit sie zu Ihrer Marke passt. Es ist ganz einfach:

  1. Ermitteln Sie den HEX-Code Ihrer Markenfarbe (Beispiel #4EB2F4).
  2. Fügen Sie diesen HEX-Code zur URL des Formulars hinzu, das Sie einbetten möchten.

Wenn Sie beispielsweise die Farbe mit dem HEX-Code #4EB2F4 verwenden möchten, sieht Ihre URL etwa so aus:

<iframe title="Lead Form"
    src="https://virtual.edvisor.io/nuevalengua/cotizador/lead-form-iframe/en/4EB2F4/9447"
    width="500"
    height="900"
    frameborder="0"
    allowfullscreen="true">
</iframe>

Ersetzen Sie einfach #4EB2F4 durch Ihren benutzerdefinierten HEX-Farbcode, und sehen Sie, wie die Magie geschieht!

Sobald ein Student eines dieser Formulare ausfüllt, wird der Lead basierend auf den in Ihren EdCommerce-Einstellungen festgelegten Geschäftsregeln dem richtigen Berater zugewiesen. Diese Leads werden außerdem mit Ihrem Edvisor-Konto synchronisiert und der richtigen Pipeline und Phase hinzugefügt.

Einbetten von EdCommerce-Programmen

Mit EdCommerce können Sie nicht nur stilvolle E-Commerce-Landingpages erstellen und sogar komplette Websites erstellen, sondern auch die leistungsstarken Funktionen nahtlos in jede bestehende Website, die Sie verwenden, integrieren.

Das bedeutet, dass Sie das Beste aus beiden Welten erhalten – die Funktionalität Ihrer aktuellen Website und die leistungsstarken Funktionen von EdCommerce.

Dies können Sie tun, indem Sie ein Widget erstellen und einbetten. Sehen wir uns an, wie das geht.

So erstellen Sie ein EdCommerce-Widget

  1. Greifen Sie auf Ihre EdCommerce-Einstellungen zu: Melden Sie sich bei Ihrem EdCommerce-Konto an und navigieren Sie zum Abschnitt „Einstellungen“.
  2. Erstellen Sie ein Widget: Wählen Sie im Menü auf der linken Seite „Widgets“ und anschließend „Neues Widget erstellen“.
  3. Geben Sie die Widget-Details ein: Füllen Sie das Formular mit dem Namen Ihres Widgets, der bevorzugten Sprache, der Währung und der Nationalität des Studierenden aus.
  4. Wählen Sie den Inhalt aus: Wählen Sie aus, welche Programme oder Bildungsanbieter in Ihrem Widget angezeigt werden sollen. Klicken Sie einfach auf „Programme“ oder „Anbieter“ und wählen Sie aus der Liste auf der rechten Seite diejenigen aus, die Sie anzeigen möchten.
  5. Passen Sie das Erscheinungsbild an: Passen Sie das Erscheinungsbild des Widgets an, indem Sie Schriftart, Hintergrundfarbe und Box-Schatten bearbeiten, damit es zum Design Ihrer Website passt. Sie können auch den Innenabstand anpassen, um eine bessere Passform zu erzielen, indem Sie auf das quadratische Symbol innerhalb der Widget-Vorschau klicken.
  6. Speichern Sie Ihr Widget: Wenn Sie mit den Einstellungen zufrieden sind, klicken Sie auf „Speichern“.

Nachdem Sie Ihr Widget gespeichert haben, erhalten Sie einen Codeausschnitt.

Dieser Code muss zu Ihrer Website hinzugefügt werden. Lesen Sie weiter, um zu erfahren, wie das geht.

So fügen Sie ein EdCommerce-Widget zu Ihrer Website hinzu

Öffnen Sie einfach die Seite Ihrer Website, auf der Sie dieses Widget platzieren möchten, und fügen Sie einen HTML-Block mit dem Code ein.

Je nach CMS Ihrer Website (z. B. WordPress oder Wix) kann sich die Vorgehensweise zum Hinzufügen dieses Codes unterscheiden. Im Allgemeinen können Sie in allen Website-Editoren einen HTML-Block per Drag-and-drop verschieben.

Hier sind einige Beispiele:

WordPress (mit Elementor):

  • Öffnen Sie die Seite, die Sie mit Elementor bearbeiten möchten.
  • Ziehen Sie das „HTML“-Widget aus dem linken Bedienfeld an die Stelle auf Ihrer Seite, an der das Widget erscheinen soll.
  • Fügen Sie den EdCommerce-Codeausschnitt in das HTML-Codefeld ein.
  • Klicken Sie auf „Aktualisieren“, um Ihre Änderungen zu speichern.

WordPress (mit Visual Composer):

  • Bearbeiten Sie die Seite, auf der Sie das Widget einfügen möchten.
  • Klicken Sie auf die Schaltfläche „+“, um ein neues Element hinzuzufügen.
  • Wählen Sie in den Inhaltselementen „Rohes HTML“ oder „Benutzerdefiniertes HTML“ aus.
  • Fügen Sie Ihren EdCommerce-Codeausschnitt in das Textfeld ein.
  • Speichern Sie Ihre Änderungen, indem Sie auf der Seite auf „Aktualisieren“ klicken.

Wix:

  • Navigieren Sie im Wix-Editor zu der Seite, die Sie bearbeiten möchten.
  • Klicken Sie auf der linken Seite des Editors auf „Hinzufügen“ (+) und wählen Sie „Mehr“ aus.
  • Wählen Sie im Dropdown-Menü „HTML iframe“ aus.
  • Klicken Sie auf „Code eingeben“ und fügen Sie anschließend den EdCommerce-Codeausschnitt in das Feld „HTML-Einstellungen“ ein.
  • Klicken Sie auf „Anwenden“, um zu speichern und das Widget auf Ihrer Seite anzuzeigen.

Squarespace:

  • Gehen Sie zu der Seite, auf der Sie das Widget hinzufügen möchten.
  • Klicken Sie auf „+Block hinzufügen“ und wählen Sie im Menü „Code“ aus.
  • Fügen Sie Ihren EdCommerce-Codeausschnitt in den Codeblock ein und klicken Sie auf „Anwenden“.

Wenn Sie in Ihrem Editor kein HTML-Modul finden können, versuchen Sie, den Code eines „Rich-Text“-Moduls zu bearbeiten.

Anwendungsfälle

Mit dieser Funktion können Sie Ihre Website in eine ansprechendere und informativere Plattform verwandeln. Durch das Einbetten dieser Widgets auf Ihrer Website können Sie Inhalte aufwerten, die Nutzerinteraktion steigern und die Konversionsrate erhöhen.

Hier sind einige Beispiele dafür, wie EdCommerce-Widgets kreativ auf Ihrer Website eingesetzt werden können:

Optimierung von Blogbeiträgen:

Wenn Sie einen Blogbeitrag über das Studieren an einem bestimmten Ort, wie Sydney, schreiben, betten Sie das Widget am Ende des Beitrags ein. Präsentieren Sie Ihre besten 3 Programme oder Sonderaktionen in Sydney, um Leser dazu zu ermutigen, diese Optionen zu erkunden. Dies kann die Konversionsrate erheblich erhöhen, indem Inhalte direkt mit relevanten Programmen verknüpft werden.

Eventseiten:

Für Webseiten, auf denen Bildungsmessen oder Webinare beworben werden, können Sie das Widget einbetten, um Programme oder Bildungseinrichtungen zu präsentieren, die an der Veranstaltung teilnehmen. So erhalten Besucher einen Vorgeschmack darauf, was sie erwartet, und können zu Anmeldungen oder weiteren Anfragen angeregt werden.

Standortspezifische Seiten:

Wenn Ihre Website Seiten für bestimmte Studienziele oder Länder enthält, betten Sie das Widget auf diesen Seiten ein, um Programme anzuzeigen, die an diesen Orten verfügbar sind. Dies ist eine hervorragende Möglichkeit, Nutzern, die bereits an diesen Zielen interessiert sind, relevante Optionen anzubieten.

Dankeseiten nach der Newsletter-Anmeldung:

Nachdem ein Besucher Ihren Newsletter abonniert hat, wird er auf eine Dankeseite weitergeleitet. Hier können Sie das Widget einbetten, um ihn sofort mit beliebten oder ausgewählten Programmen anzusprechen.

Während Werbekampagnen:

Wenn Sie Werbekampagnen für bestimmte Kurse oder Studienziele durchführen, integrieren Sie das Widget auf den Landingpages Ihrer Kampagne. Passen Sie das Widget so an, dass Programme präsentiert werden, die mit der Kampagne zusammenhängen, um ein stimmiges Nutzererlebnis zu schaffen.

EdCommerce zu WordPress hinzufügen

Bitte beachten Sie, dass die folgenden Anweisungen speziell für Nutzer gedacht sind, die WordPress als Website-Baukasten verwenden. Wenn Sie eine andere Plattform oder einen anderen Website-Baukasten nutzen, sind diese Schritte möglicherweise nicht anwendbar.

Schritt 1

Rufen Sie Ihr WordPress-Admin-Panel auf, navigieren Sie zum Abschnitt "Design" und klicken Sie auf "Menüs".

Schritt 2

Navigieren Sie im Abschnitt "Menüs" zu "Individuelle Links" und geben Sie die URL Ihrer EdCommerce-Plattform sowie den CTA-Text ein, der im Menü Ihrer Website angezeigt werden soll.

Klicken Sie anschließend auf "Zum Menü hinzufügen", um dieses neue Element in Ihr Hauptmenü aufzunehmen.

Um die URL Ihres EdCommerce zu finden, gehen Sie auf Ihrer Plattform zum Einstellungsbereich, klicken Sie auf "EdCommerce" und anschließend auf "EdCommerce-Details".

Profi-Tipp! Damit Studierende Ihre Seite nicht verlassen, sollten Sie Ihr Menü so anpassen, dass der Link in einem neuen Tab geöffnet wird.