Eine externe Website per iFrame einbinden

So gehst Du vor, wenn Du eine externe Website in Deine App einbinden möchtest

Meri Jomardyan avatar
Verfasst von Meri Jomardyan
Vor über einer Woche aktualisiert

Per iFrame ist es möglich, externe Website Inhalte in die eigene App zu integrieren. Bei einem iFrame handelt es sich um ein HTML-Objekt, das in einem festen Rahmen auf eine bereits bestehende Website bzw. in eine App eingebunden werden kann. 

Vorgehensweise
Dazu fügst Du im Dashboard das Text- und Bild Modul hinzu. Anschließend wählst Du den Quellcode Modus aus (im folgenden Screenshot grau hinterlegt).

Du kannst nun den folgenden Code einfügen: 

<div style="-webkit-overflow-scrolling: touch;overflow-x:hidden;overflow-y: auto; position: absolute; top: 0; left: 0; right: 0; bottom: 0;"><iframe src="https://www.appyourself.net/blog" style="width:100%;height:100%;border: none;"></iframe></div>

Du siehst, dass der iFrame die URL unseres Blogs beinhaltet. Diesen ersetzt Du einfach mit der URL des gewünschten Website Links, den Du einbinden möchtest. Wir möchten Dich darauf hinweisen, dass es manchmal vorkommen kann, dass die iFrame Einbindung nicht möglich ist. Das liegt daran, dass einige Anbieter dies unterbinden. Des Weiteren ist es erforderlich, dass die einzubettende Website ein SSL-Zertifikat (HTTPS) aufweist, damit sie korrekt angezeigt wird.

Einige Websites bieten selbst die Möglichkeit, einen iFrame auf einer anderen Website oder in Deine App einzubinden. Dies wird Dir mit mit Copy Embed Code angezeigt, wenn Du z.B. mit der rechten Maustaste auf ein Objekt klickst.

Hinweis
Nachdem Du den iFrame eingefügt hast, verlasse bitte wieder den Quellcode Modus (erneutes Klicken auf den Quellcode Button). Erst dann kannst Du den iFrame speichern.

Hat dies Ihre Frage beantwortet?