WebSite X5Help Center

 
Uwe W.
Uwe W.
User

Externe Seite in einem I Frame öffnen und responsive  de

Auteur : Uwe W.
Visité 1291, Followers 1, Partagé 0  

Hallo 

Ich wollte auf meiner Seite    https://www.mainzertor.de/test/ unter - Kulinarisches  - Restaurant

eine externe / online Speisekarte anzeigen lassen.

Diese liegt unter Speisekarte.de und der Link dazu ist  

http://www.speisekarte.de/gastro_menu_outside?id=467231

da ich die Speisekarte an einem zentralen Ort ändern, erweitern und pflegen kann.

Leider wird mir nur die leere Fläche nach dem hochladen angezeigt, im Programm Website X5 Evo wird mir aber alles angezeigt, und es funktioniert.

Dort habe ich dann unter : - Seiten -  einen - HTML Code eingefügt  ( wie auf dem Bild zu sehen ist ) mit dem Code :

<script type="text/javascript">

  function iframeLoaded() {

      var iFrameID = document.getElementById('idIframe');

      if(iFrameID) {

            iFrameID.height = "";

            iFrameID.height = iFrameID.contentWindow.document.body.scrollHeight + "px";

      }  

  }

</script>

 <div>

<iframe src="http://www.speisekarte.de/gastro_menu_outside?id=467231" id="idIframe" onload="iframeLoaded()" style="border: none; width:100%; margin: 0 0 0 1%;" allowfullscreen scrolling="no"> </iframe>

</div>

Die Seite ist Responsive gehalten genau wie der Link ( Speisekarte ).

Ich würde auch gerne keinen Scrollbalken haben wenn möglich bei der Speisekarte, wenn diese verändert wird.

Also die Höhe sollte sich automatisch anpassen.

Über Hilfe würde ich mich freuen.

Lg Uwe

Posté le
9 RéPONSES
Andreas S.
Andreas S.
Moderator
Meilleur utilisateur du mois DE

Also als ersters lösche mal die leeren Reihen raus.

Die Seite hat schon ein Zertifikat und deshalb musst du https:// nehmen!

Das Javaskript benötigst du nicht und kannst es löschen.

Im HTML Objekt nichts anhaken sondern meinen Code einfach reinkopieren..

<iframe src="https://www.speisekarte.de/gastro_menu_outside?id=467231" style="border:0px #ffffff none;" name="myiFrame" scrolling="yes" frameborder="1" marginheight="0px" marginwidth="0px" height="800px" width="100%px" allowfullscreen></iframe>

Lire plus
Posté le de Andreas S.
Uwe W.
Uwe W.
User
Auteur

Hallo Andreas

Erst mal vielen Dank für deine Hilfe.

Habe Deinen Code genommen und Ihn eingefügt, und es funktioniert.

Leider ist noch ein Scrollbalken bei der Speisekarte, bekommt man diesen auch weg?

Und es ist ein riesiges freies Feld unter der Karte zu sehen. Verstehe ich nicht ?

Lg  Uwe

Lire plus
Posté le de Uwe W.
Andreas S.
Andreas S.
Moderator
Meilleur utilisateur du mois DE

Ich habe die Höhe im Code auf 800px eingestellt. Wenn du es kürzer willst musst du den Wert ändern, aber der Scrollbalken bleibt. Du kannst aber auch auf 7500px die Höhe stellen, dann hast du keinen Scrollbalken.

Lire plus
Posté le de Andreas S.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Uwe W.
... ... ... Dort habe ich dann unter : - Seiten -  einen - HTML Code eingefügt  ( wie auf dem Bild zu sehen ist ) mit dem Code :  <script ********** ... ... ... ... ... 

(It > De)

... damit Ihr <script> -Code funktioniert, muss die in IFRAME importierte Seite zur selben Domain gehören wie die Site-Seite ...

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Uwe W.
Uwe W.
User
Auteur

Hallo 

Vielen Dank für die Hilfe.

Habe mir noch mal eine saubere Kopie meiner Seite gemacht und den neuen Code eingegeben, und alles funktioniert wie gewünscht.

Auch der leere Abschnitt ist verschwunden.

Kann man die Höhe so einstellen das Sie sich automatisch anpassen wenn man etwas im original ändert, oder ist das nicht möglich?

Danke noch mal 

Gruß Uwe aus dem regnerischen Alsfeld

Lire plus
Posté le de Uwe W.
Andreas S.
Andreas S.
Moderator
Meilleur utilisateur du mois DE

Es geht hier um Iframe Einbindungen.

Wenn du den code in ein HTML-Objekt einfügst, dann hast du 2 Dinge!

1. die Höhe des HTML-Objekts und

2. die Höhe des Iframes vom Code her.

Den Code vom Iframe kannst du auch von der Höhe auf 100% stellen. Dann wäre theoretisch bei Veränderungen der externen Seite immer alles sichtbar.  Aber das HTML-Objekt hat eine fixe Höhe die einstellbar ist. Da lässt sich nichts daran ändern.

Lire plus
Posté le de Andreas S.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Uwe W.
... ... ...  Kann man die Höhe so einstellen das Sie sich automatisch anpassen wenn man etwas im original ändert, oder ist das nicht möglich? ... ... ... 

... ... ja, mit EXTRA-Code ist das möglich ...wink...
...in Ihrem IFRAME-Code müssen Sie zwei Korrekturen vornehmen:
... ersetze  name="myiFrame"   durch >>  ID="myiFrame"
... Ersetzen Sie  scrolling="yes"   durch >>  scrolling="no"
... benachrichtigen Sie mich, wenn Sie korrigiert haben, dann werde ich Ihnen einen einfachen Code zum einfachen Einfügen übergeben.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Uwe W.
Uwe W.
User
Auteur

Nochmals vielen Dank für die Hilfe

KolAsim =   ich habe heute den Code ersetzt und die Seite wieder hochgeladen, habe aber unter Heigt  = 5800px eingestellt damit kein Scrollbalken zu sehen ist.

Gruß Uwe

Lire plus
Posté le de Uwe W.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Uwe W.
Nochmals vielen Dank für die Hilfe KolAsim =   ich habe heute den Code ersetzt und die Seite wieder hochgeladen, ... ... ... 

(It > De) ... im Netz gibt es keine Korrektur:

<iframe  src="https://www.speisekarte.de/gastro_menu_outside?id=467231" style="border:0px #ffffff none;"   name="myiFrame"    scrolling="yes"  frameborder="1" marginheight="0px" marginwidth="0px" height="5800px" width="100%px" allowfullscreen></iframe>

... der IFRAME muss so sein:

<iframe  src="https://www.speisekarte.de/gastro_menu_outside?id=467231"  style="border:0px #ffffff none;"  ID="myiFrame"  scrolling="no"  frameborder="0" marginheight="0" marginwidth="0"   height="5800"   width="100%"  allowfullscreen></iframe>

... benachrichtigen Sie mich, wenn Sie die beiden Korrekturen vorgenommen haben ...

Hallo, ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪