Einbau Skript 'Nachrichten' in einem Iframe von
Werner-Zenk.de
Tutorial
Für diejenigen, denen es einfacher erscheint das Original-Skript in einem Iframe darzustellen, habe ich hier folgende Anleitung geschrieben.
Zur Darstellung einer PHP-Anwendung in einem Iframe (Inlineframe), müsst Ihr die Dateierweiterung vom Seitennamen natürlich nicht umstellen, dieser bleibt dagegen auf .html stehen. Wir Ihr in der URL dieser Seite, in der Adressen-Zeile vom Browser, sehen könnt. Meine Seite heißt hier:
Iframe-Dynamisch.html
Ich habe also den Iframe-Code wieder in einen einfachen Textblock, anstelle des Beispieltextes von Mobirise, kopiert. So wie Ihr das im Screenshot unten auch sehen könnt:
<!-- Beginn Nachrichten-Ausgabe im Iframe -->
<p><iframe id="myFrame" src="nachrichten.php"></iframe></p>
<!-- Ende Nachrichten-Ausgabe im Iframe -->
Wenn Ihr das Iframe, so wie ich hier, dynamisch macht, könnt Ihr die Angabe der Höhe weglassen. Damit das Iframe in der Breite responsive bleibt, muss eine Prozentzahl, hier "width: 100%;" in der CSS, eingetragen sein. Ich habe, passend zu meiner id="myFrame", folgenden Style hinzugefügt:
#myFrame {
border: none;
width: 100%;
}
Achtet auf die korrekte, relative Pfadangabe zum Skript "nachrichten.php". Ich gehe hier davon aus, dass Ihr sämtliche Skripte aus dem Download dieser Anwendung in das Stammverzeichnis Eures Mobirise-Projektes kopiert habt, also in das gleiche Verzeichnis in dem auch die Seite mit diesem Iframe eingebaut wird.
Iframe dynamisch anpassen:
Ich habe hier noch ein JavaScript von "ProfessorWeb" verwendet, das die Höhe vom Iframe dynamisch anpasst, wodurch der Inhalt dann ohne Scrollbalken dargestellt wird. Das könnt Ihr machen müsst Ihr aber nicht. Dieses Skript sucht nach dem HTML-Tag "iframe" und muss lediglich in die Seiteneinstellungen in den Bereich ...
"Inside <head> code:"
... kopiert werden. Hier habe ich noch + 50 px extra in der Höhe dazu geschrieben, da sonst die Blätterfunktion vom Nachrichten-Skript nicht angezeigt werden würde.
<script>
var framefenster = document.getElementsByTagName("iFrame");
var auto_resize_timer = window.setInterval("autoresize_frames()", 400);
function autoresize_frames() {
for (var i = 0; i < framefenster.length; ++i) {
if(framefenster[i].contentWindow.document.body){
var framefenster_size = framefenster[i].contentWindow.document.body.offsetHeight;
if(document.all && !window.opera) {
framefenster_size = framefenster[i].contentWindow.document.body.scrollHeight;
}
framefenster[i].style.height = framefenster_size + 50 + 'px';
}
}
}
</script>