Eine Galerie in die Homepage einbinden

 

Du hast ein Bildergalerie-Script installiert und willst es jetzt auf deiner bestehenden Homepage zeigen. Wie binde ich eine Galerie in die Homepage ein, lässt sich auf drei Wegen beantworten: per Link, per iframe oder per direktem Einbau über PHP. Welcher Weg passt, hängt davon ab, wie deine Homepage aufgebaut ist und wie eng die Galerie mit ihr verschmelzen soll. Dieser Artikel zeigt für jeden Weg ein kopierbares Beispiel.

Schema zeigt, wie sich eine Galerie per Rahmen in die Homepage einbinden lässt

Galerie in die Homepage einbinden: der Ausgangspunkt

Damit die Galerie auf deiner Homepage erscheinen kann, muss sie zuerst auf deinem Webspace liegen und über eine eigene Adresse erreichbar sein. Hast du die Dateien noch nicht hochgeladen, hilft die Anleitung zum FTP-Upload Schritt für Schritt. Rufe die Adresse danach einmal direkt im Browser auf. Erscheint die Galerie dort fehlerfrei, ist die Grundlage gelegt. Notiere dir die genaue Adresse, denn du brauchst sie gleich in den Beispielen.

Es gibt drei gängige Wege, eine Galerie in eine Homepage zu bringen. Diese Übersicht zeigt, wann sich welcher Weg eignet.

WegAufwandGeeignet für
Verlinkungsehr geringGalerie als eigene Seite
iframegeringGalerie im Rahmen einbetten
Direkter EinbauhöherGalerie als Teil der Seite

Galerie in die Homepage einbinden per Link

Am schnellsten geht es mit einem Link. Du setzt auf deiner Startseite einen Verweis, der zur Galerie führt. Besucher klicken darauf und landen auf der Galerieseite, die eine eigene Adresse behält. Im Quelltext setzt du dazu ein a-Element, etwa so:

Code
<a href="https://deine-domain.de/galerie/">Zur Bildergalerie</a>

Ersetze die Adresse durch die deiner Galerie und den Text Zur Bildergalerie durch eine Beschriftung, die zu deiner Seite passt. Ein Link hat den Vorteil, dass er nichts an deiner Homepage stören kann. Geht mit der Galerie einmal etwas schief, bleibt deine Startseite unberührt. Für viele Seiten reicht dieser Weg völlig aus, gerade am Anfang.

Galerie in die Homepage einbinden mit iframe

Soll die Galerie direkt auf deiner Homepage erscheinen, ohne dass der Besucher die Seite wechselt, hilft ein iframe. Das ist ein Rahmen, in dem eine andere Seite angezeigt wird. Du fügst an der gewünschten Stelle deiner Homepage ein iframe-Element ein und gibst die Adresse der Galerie als Quelle an:

Code
<iframe src="https://deine-domain.de/galerie/" width="100%" height="800" frameborder="0" title="Bildergalerie"></iframe>

Setze für width einen Wert wie 100% und für height eine Höhe in Pixeln, die zur Galerie passt, hier 800. Beim iframe solltest du auf einige Punkte achten:

  • Lege Breite und Höhe so fest, dass die Galerie hineinpasst und nicht abgeschnitten wird.
  • Prüfe die Darstellung auch auf dem Smartphone.
  • Teste, ob Bilder und Klicks im Rahmen funktionieren.
  • Stelle sicher, dass die Galerie keine fremde Einbettung blockiert.

Bleibt der Rahmen leer, liegt es oft am letzten Punkt. Viele Webserver senden den Header X-Frame-Options mit dem Wert DENY oder SAMEORIGIN, der das Einbetten in fremde Seiten verbietet. Liegen Galerie und Homepage auf derselben Domain, hilft SAMEORIGIN. Bei einer fremden Domain musst du den Header in der Konfiguration der Galerie anpassen, etwa über die .htaccess. Moderne Browser werten zusätzlich die Content-Security-Policy mit der Direktive frame-ancestors aus, die denselben Zweck erfüllt.

Galerie in die Homepage einbinden über PHP

Am engsten verschmilzt die Galerie mit deiner Homepage, wenn du sie direkt in deine Seite einbaust. Das setzt voraus, dass Homepage und Galerie-Script dieselbe Technik nutzen, also etwa beide auf PHP laufen. Dann bindest du die Hauptdatei der Galerie an der passenden Stelle ein:

Code
<?php include __DIR__ . '/galerie/index.php'; ?>

Mit include wird die Datei eingebunden und läuft fehlertolerant weiter, falls sie fehlt. Wer den Abbruch erzwingen will, nutzt stattdessen require. Achte dabei auf zwei Stolperfallen. Erstens den Pfad: __DIR__ steht für das Verzeichnis der aktuellen Datei, von dort gibst du den relativen Weg zur Galerie an. Zweitens Namenskonflikte, denn wenn Homepage und Galerie gleichnamige PHP-Funktionen oder Variablen definieren, bricht die Seite mit einem Fehler ab. In diesem Fall hilft oft, die Galerie über einen iframe einzubinden statt per include.

Den richtigen Einbauort findest du am besten mit einem Editor für Webdateien, der dir den Quelltext deiner Seite zeigt. Lege vorher eine Sicherung an und probiere den Einbau zuerst an einer Kopie deiner Homepage aus. Klappt dort alles, überträgst du die Änderung auf die echte Seite. So riskierst du nicht, deine laufende Homepage durch einen Versuch lahmzulegen. Für den Anfang reicht meist der Link oder der iframe, den direkten Einbau hebst du dir auf, wenn du sicherer geworden bist.

Galerie in die Homepage einbinden: häufige Fragen

Beim Einbinden der Galerie drehen sich die Fragen um den richtigen Code, den iframe und das beliebte Anzeigeproblem im Rahmen.

Wie binde ich die Galerie als Link auf meiner Startseite ein?

Du setzt einen Verweis mit einem a-Element, zum Beispiel <a href="https://deine-domain.de/galerie/">Zur Bildergalerie</a>. Der Besucher klickt darauf und landet auf der Galerieseite. Das ist der robusteste Weg und kann an deiner Homepage nichts stören.

Wie binde ich die Galerie mit einem iframe ein?

Du fügst an der gewünschten Stelle ein iframe-Element ein und gibst die Galerie-Adresse als Quelle an, etwa <iframe src="https://deine-domain.de/galerie/" width="100%" height="800"></iframe>. Lege Breite und Höhe so fest, dass die Galerie hineinpasst, und prüfe die Darstellung auch auf dem Smartphone.

Warum wird meine Galerie im iframe nicht angezeigt?

Häufig blockiert die eingebundene Seite die Darstellung im Rahmen über den Header X-Frame-Options oder eine Content-Security-Policy. Liegt die Galerie auf demselben Webspace, kannst du das in der Konfiguration anpassen; sonst weiche auf einen Link oder den direkten Einbau per PHP-include aus.

Verwandte Themen

Das Einbinden setzt voraus, dass die Galerie sauber hochgeladen ist und du ihre Dateien bei Bedarf bearbeiten kannst.