Onlineshop als iFrame einbinden

In diesem Artikel erfahren Sie, wie Sie den Onlineshop mit iFrame in Ihre Unternehmenswebsite einbinden können.

Unsere Empfehlung

Grundsätzlich empfehlen wir Ihnen, den Onlineshop nicht mit iFrame einzubinden, sondern mit einer Verlinkung in einem neuen Fenster öffnen zu lassen. Erfahren Sie mehr über unsere Verlinkungs- und Einbindungsempfehlungen: Verlinkung Onlineshop auf Ihrer Website

Beispiel iFrame-Einbindung

Sie können den e-guma Onlineshop auch als iFrame in Ihre Website einbinden.

Technische Einbindung

Folgend der HTML-Code. Bei src können Sie die Url Ihres Shops eintragen.

<iframe id="iframe-eguma" src="https://shop.e-guma.ch/demo/de/gutscheine" width="100%" height="900" frameborder="0" scrolling="auto"></iframe>

Damit der Shop mit dem Safari und Firefox Browser funktioniert, ist es wichtig, dass Sie zusätzlich zum iFrame das folgende Script in Ihre Website einfügen. Wenn der Shop als iFrame eingebunden wird, blockiert Safari und Firefox (im Strict Mode) die Verwendung von Cookies, welche für die Funktionalität des Shops notwendig sind. Mit dem Script wird erkannt, dass es sich um einen solchen Browser handelt und der Shop wird direkt und nicht als iFrame eingebunden. 

<script src="https://s3-eu-west-1.amazonaws.com/eguma-static/eguma-iframe.js" type="text/javascript"></script>

Mit dem untenstehenden Code in Ihre Website  passt sich das iFrame automatisch der Grösse des Inhalts des Shops an:

<script src="https://eguma-static.s3-eu-west-1.amazonaws.com/iframeResizer.min.js" type="text/javascript"></script>

<script>
    iFrameResize({heightCalculationMethod: "bodyScroll"}, '#iframe-eguma')
</script>

<script src="https://eguma-static.s3-eu-west-1.amazonaws.com/iframeResizer.contentWindow.min.js" type="text/javascript"></script>

Wichtig: Damit die Scripts funktionieren, müssen diese nach dem iFrame eingebunden werden. Ansonsten funktionieren sie unter Umständen nicht.   

Nachteile einer iFrame-Einbindung

Der e-guma Onlineshop ist nicht für die Anzeige in iFrames konzipiert, weil...

• ...Sie dadurch keine Direktverlinkungen auf einzelne Angebote erstellen können (sehr schade, wenn Sie beispielsweise ein attraktives Spezialangebot auf Ihren Social Media Kanälen promoten möchten).
• ...Onlineshops, welche in iFrames eingebunden sind, oft auf den mobilen Geräten nicht optimal dargestellt werden. Die Bedienbarkeit und die Lesbarkeit sind in einem separaten Tab besser gewährleistet.