IFRAME Code einbinden

Allgemeine Fragen
inno
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 293
Registriert: Do 17. Dez 2020, 11:59

IFRAME Code einbinden

Ungelesener Beitrag von inno »

Hallo,
wie kann ich am einfachsten einen IFRAME Code in Mobirise einbinden, der einen externen Inhalt lädt?

Code: Alles auswählen

<div id="apartmentIframeAll">
<script type="text/javascript" src="https://login.smoobu.com/js/Settings/BookingToolIframe.js"></script>
<script>BookingToolIframe.initialize({"url": "https://login.smoobu.com/de/booking-tool/iframe/123456", "baseUrl": "https://login.smoobu.com", "target": "#apartmentIframeAll"})</script>
</div>
Grüße
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: IFRAME Code einbinden

Ungelesener Beitrag von Tommy Herrmann »

Ich weiß jetzt nicht was Du in einem Frame darstellen willst, nicht alles geht von externen Seiten, denn manchmal wird das auch unterbunden.

So sieht normalerweise das Iframe-Tag aus, dort gibt man lediglich die externe URL an:

https://www.w3schools.com/tags/tag_iframe.ASP

Was Du oben zeigst sind zwei JavaScripts - die so noch nicht funktionieren. Um dabei helfen zu können, müsstest Du uns mal einen Link zu den Anleitungen von "smoobu.com" senden.

https://www.smoobu.com/de/
inno
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 293
Registriert: Do 17. Dez 2020, 11:59

Re: IFRAME Code einbinden

Ungelesener Beitrag von inno »

Hallo Tommy, es wird ein externes Buchungstool geladen. Ich versuche es mal mit deinem Link! ;)
Wie baue ich den Code am besten ein?

Code: Alles auswählen

<iframe src="https://www.w3schools.com" title="W3Schools Free Online Web Tutorials"></iframe>
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: IFRAME Code einbinden

Ungelesener Beitrag von Tommy Herrmann »

Du kannst ein <iframe> Tag normalerweise nur für Inhalte der eigenen Domain verwenden.

Meist wird die Anzeige von Inhalten fremder Domains sonst aus Sicherheitsgründen gesperrt.

Das Iframe-Tag kannst Du an jeder beliebigen Stelle, in z.B. einen Textblock, einfügen - genau wie jedes andere Tag auch.


Wikipedia lässt das zu, versuche es mal damit zum Testen:

Code: Alles auswählen

<iframe src="https://de.wikipedia.org/wiki/Wikipedia:Hauptseite" title="Wikipedia" height="500px"></iframe>

Im Code-Editor (markierte Zeile):

Iframe im Textblock als Code.jpg


Ansicht Arbeitsseite Mobirise:

Iframe im Textblock.jpg



Das damit diese Buchungsseite von "smoobu.com" geladen werden soll ist mir schon klar :eek:

Ganz genauso könntest Du auch den eingangs von Dir gezeigten <div> Container mit den beiden JavaScripts einbauen - nur funktioniert der von Dir gezeigte Code so eben nicht, da dieser offensichtlich Fehler hat. Das hatte ich in meiner ersten Antwort versucht zu formulieren.
inno
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 293
Registriert: Do 17. Dez 2020, 11:59

Re: IFRAME Code einbinden

Ungelesener Beitrag von inno »

Hallo Tommy,
hier war die ID noch nicht vergeben. Jetzt sollte es passen.
Wie baue ich dann den kompletten Code ein, am besten auch ohne Scrollbalken, wenn da was in Tiefe geht?

Code: Alles auswählen

<div id="apartmentIframeAll">
<script type="text/javascript" src="https://login.smoobu.com/js/Settings/BookingToolIframe.js"></script>
<script>BookingToolIframe.initialize({"url": "https://login.smoobu.com/de/booking-tool/iframe/578140", "baseUrl": "https://login.smoobu.com", "target": "#apartmentIframeAll"})</script>
</div>
Danke und Grüße
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: IFRAME Code einbinden

Ungelesener Beitrag von Tommy Herrmann »

Ja - wie gesagt - ganz genauso.

... das ist aber eben kein Iframe-Code sondern ein JavaScript-Code, deshalb wird es dort auch keinen zusätzlichen Scrollbalken (wie beim Iframe) geben.

Da Du aber hier das <div> Tag außen herum hast, darf das nicht innerhalb eines <p> Tags </p> stehen.

Das <div> Tag steht für: division = Bereich

Das <p> Tag steht für: paragraph = Textabsatz

Ich habe hier als Beispiel einen ganz einfachen Text-Block aus der Rubrik "Article" verwendet:

Textblock aus Article.jpg


Du musst zumindest lokal publizieren, damit Du das Ergebnis sehen kannst. Auf der Arbeitsseite erscheint, nach dem Einbau im "Code Editor", nur ein [Hinweis] auf diese beiden verwendeten JavaScripts.

Siehe meine Screenshots:

Einbau im "Code Editor" (Dein Code ist markiert - unter dem <p> Tag </p>):

Formular Buchung im Code-Editor.jpg


Ansicht der Arbeitsseite von Mobirise nach dem Einbau vom Code mit [Hinweis] auf die verwendeten JavaScripts:

Formular Buchung auf Arbeitsseite.jpg


Nach dem (zumindest lokalen) Publizieren Ansicht im Browser:

Formular Buchung.jpg
inno
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 293
Registriert: Do 17. Dez 2020, 11:59

Re: IFRAME Code einbinden

Ungelesener Beitrag von inno »

Hi Tommy,
danke Dir! Kann ich leider erst morgen testen. Melde mich dann. :tu:
Grüße
inno
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 293
Registriert: Do 17. Dez 2020, 11:59

Re: IFRAME Code einbinden

Ungelesener Beitrag von inno »

Hallo Tommy, funktioniert soweit, allerdings wird das Tool bei mir 2x angezeigt! Hast du hier eine Lösung? Screens anbei.
Dateianhänge
screen2.jpg
screen1.jpg
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: IFRAME Code einbinden

Ungelesener Beitrag von Tommy Herrmann »

Das ist eigentlich nicht möglich - nicht mit dem Code, so wie im Screenshot von Dir gezeigt. Das passiert ja bei mir auch nicht.

Hast Du da vielleicht 2 x den gleichen Block untereinander eingebaut oder so etwas?

Wenn Du mal in ein Testverzeichnis publizieren würdest, dann könnte man das sofort im Quelltext vom Browser sehen. Ich kann keine Lösung haben, wenn ich nichts sehe :(
inno
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 293
Registriert: Do 17. Dez 2020, 11:59

Re: IFRAME Code einbinden

Ungelesener Beitrag von inno »

Ist echt komisch!
Ich verwende das THEME LodgeM5.
Habe gerade eine leere Seite erstellt und trotzdem kommt es zweimal.
Ich teste es mal in einem anderen Theme - bin gepannt!
inno
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 293
Registriert: Do 17. Dez 2020, 11:59

Re: IFRAME Code einbinden

Ungelesener Beitrag von inno »

Wenn ich das Theme komplett neu erstelle geht es! Mal schauen, wo der Fehler bei mir liegt!
Danke dir für die Infos + Hilfe! :tu:
inno
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 293
Registriert: Do 17. Dez 2020, 11:59

Re: IFRAME Code einbinden

Ungelesener Beitrag von inno »

Ich habe den Fehler gefunden, wenn der Cookie Alert aktiv, dann wird es zweimal angezeigt!
Verrückt manche Sachen bei mobirise!
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5744
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: IFRAME Code einbinden

Ungelesener Beitrag von Tommy Herrmann »

Hallo,

ja - das kann ich bestätigen - aber nur bei dem "Cookie Alert Nummer 1" - also dem ersten von oben gesehen.

Verwendest Du den "Cookie Alert Nummer 2" - den zweiten von oben - dann geht es. Ebenso geht es mit der dritten Option "Cookie Alert Nummr 3".

Das Formular wird dann überhaupt erst angezeigt, wenn man den Gebrauch der Cookies zugestimmt hat und dann auch nur 1 Mal. Diese Funktion solltest Du auch verwenden, denn der "Cookie Alert Nummer 1" macht gar nichts - außer einen Hinweis anzuzeigen, dass Deine Seite Cookies verwendet. Das ist so bei gewerblichen Seiten in der EU nicht erlaubt.

Das ist jedoch ein Bug (Software-Fehler) und das dürfte auf keinen Fall sein.

Es wäre sehr hilfreich, wenn Du das bitte dem Support melden würdest und dann mal berichtest. Am besten mit Link zu einer Testseite und Screenshot. Du kannst auch einen Link zu diesem Board hier in meinem Forum schreiben, sodass der Support das besser sehen und verstehen kann:

support@mobirise.com

Ich habe diesen Bug zusätzlich soeben im Hersteller-Forum gemeldet:

https://forums.mobirise.com/discussion/ ... alert-1/p1
Antworten

Wer ist online?

Mitglieder in diesem Forum: Ahrefs [Bot] und 23 Gäste