Instagram: Bilder via embed auf Websites einbinden

Was flickr schon seit seinen ersten Tagen kann, führt nun endlich auch Instagram ein: Bilder lassen sich über ein Code-Snippet in die eigene Website einbinden

“Endlich!”, mag man fast sagen, angesichts der Nachricht, der Instagram für seine Nutzer bereit hält.
Denn ab sofort kann man jedes Bild des beliebten Foto-Dienstes über ein Code-Snippet in die eigene Website oder das eigene Blog einbinden.

Doch bevor sich Nutzer jetzt freuen: Leider ist dies nicht wie bei flickr über den HTML img-Tag als direkte Einbindung des Bildes möglich. Vielmehr versucht sich Instagram am YouTube-Modell und wählt einen HTML iframe-Tag für die Aktion. So wird dann in dem 612 x 710 Pixel großen Fenster auch nicht nur das Bild eingebunden, sondern auch ein Schmuckrahmen sowie die Anzeige von wem das Bild ist und wie viele Interaktionen es mit dem Bild bereits gab. Vorteil (für Instagram): Auf diese Weise lassen sich Bilder und Videos gleichermaßen und dem identischen Code-Muster nach einbinden. Der Fotodienst flickr unterscheidet Video & Bild: Für Bilder bekommt der Nutzer einen direkten img-Code-Schnipsel, für Videos wird ein object-Code-Schnipsel zur Verfügung gestellt.

Nachteil dieser Lösung: Die Bilder lassen sich nur über einen Umweg responsive (also für die angepasste Darstellung in Browsern verschiedener Endgeräte) anpassen; ausserdem sind die Anzeigen über und unter dem Bild nicht anpassbar. Gut gelöst ist hingegen, wie das Einbinden funktioniert: Der iFrame-Snippet ist direkt über jedes Bild (in der Web-Ansicht) zu bekommen, zudem ist die Variante zum Einbinden leicht erreichbar: Wer den Link zu einem Bild hat muss lediglich ein “embed/” ans Ende des Links hängen.

Beispiel (Bild zeigt, wie das eingebundene Element aussieht; so sieht der Inhalt des iFrames bei Direkaufruf aus)
instagram-embed

2007 - 2016, medienrauschen | Datenschutz | Impressum | Made with in Leipzig