Integration von Invitario in fremde Webseiten mittels iFrame

Integration von Invitario in fremde Webseiten mittels iFrame

Integration mittels iFrame

Falls Sie eine von Invitario unabhängige Eventwebsite betreiben, steht Ihnen die Integration von Invitario mittels iFrame zur Verfügung. So können Sie ausgewählte Seiten sowie Anmeldeformulare in Ihre eigene Eventwebsite integrieren und auch hier die volle Funktionalität von Invitario nutzen.
Die iFrame-Integration ist für jede Seite Ihrer innerhalb von Invitario erstellten Eventwebsite möglich. Möchten Sie nur das Anmeldeformular integrieren, dann ist die Seite als iFrame einzufügen, auf der das Anmeldeformular in Invitario eingebunden ist. Die Integration des iFrames wird mit ein paar Zeilen Javascript realisiert. Den dementsprechenden Code finden Sie im Bearbeiten-Modus der jeweiligen Seite Ihrer Eventwebsite. Binden Sie dafür den iframe-resizer von David J. Bradshaw ein.

Beispiel für iFrame-Integration mittels Javascript:
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="utf-8">
  5.     <title>Invitario</title>
  6.     <meta name="viewport" content="width=device-width">
  7.     <meta http-equiv="X-UA-Compatible" content="IE=edge">

  9.     <!--[if lte IE 8]>
  10.     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/3.5.15/ie8.polyfils.min.js"></script>
  11.     <![endif]-->
  12. </head>
  13. <body>
  14. <h2 style="text-align:center">Registrierung</h2>

  16. <iframe src="https://live.invitario.com/de/eventname/registration/" width="100%" frameborder="0" scrolling="no" style="width:100%; border: none; overflow: hidden" onload="window.scrollTo(0, 0);"></iframe>

  18. <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
  19. <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/3.5.15/iframeResizer.min.js"></script>
  20. <script type="text/javascript">
  21.     iFrameResize({
  22.         checkOrigin: false
  23.     });
  24. </script>
  25. </body>
  26. </html>

2. Half a second can easily be won by using


as the URL of the iFrame.

Wenn Sie eine besonders lange Seite bzw. ein längeres Formular per iFrame integrieren, sollten Sie sicherstellen, dass nach einem Seitenwechsel (oder nach dem Klicken auf einen An- oder Abmeldebutton) das iFrame wieder an den Beginn der Seite "scrollt". Dazu können Sie auf der "Parent Page" folgendes Attribut an das iFrame-Element anfügen:
  1. <iframe ... onload="window.scrollTo(0, 0);"></iframe>

    • Related Articles

    • Integration einer externen Event-Website in den Einladungsprozess

      Mit Invitario können Sie auch eine eigene Event-Website (außerhalb Ihres Invitario-Accounts) und dabei dennoch alle Vorteile eines personalisierten Einladungs- und Anmeldeprozesses nutzen.  Dazu ist es lediglich erforderlich, jedem Kontakt eine ...

    • Die Zoom Integration aktivieren

      Mit der Zoom-Integration für Invitario planen und starten Sie Zoom-Meetings oder Zoom-Webinare in Ihrem Invitario-Account. Nach jedem Zoom-Event werden die Aktivitätsdaten je Teilnehmer in Invitario angezeigt. Schaffen Sie mit der Kombination von ...

    • HubSpot Integration

      Die HubSpot Integration von Invitario verwendet HubSpot Marketing Event (hier mehr dazu) um Events und Kontakte von Invitario nach HubSpot zu synchronisieren. HubSpot Integration aktivieren Sollten Sie zum Zeitpunkt der Verknüpfung nicht in Ihrem ...

    • Verknüpfung Ihres Microsoft Teams-Accounts mit Invitario

      In diesem Artikel erfahren Sie, wie Sie Ihren Microsoft Teams-Account mit Invitario verknüpfen können, um digitale Sessions nahtlos zu organisieren und zu verwalten. Wir begleiten Sie durch jeden Schritt! Aufgrund von Updates seitens Microsoft ...