So fügen Sie Ihrer Website Instagram-Fotos ohne die API hinzu

Veröffentlicht: 2019-09-01

Möglicherweise sind Sie in der Vergangenheit auf eine Website gestoßen, die einen Block mit Instagram-Posts enthält, normalerweise am Ende der Startseite. Zum Beispiel hat diese in Großbritannien ansässige Fotoseite eine Leiste mit einer Reihe von gekachelten Instagram-Fotos am unteren Rand ihrer Homepage. Wenn Sie ihren Instagram-Feed direkt besuchen, können Sie sehen, dass es sich um ihre neuesten Posts handelt, die in einem Raster angeordnet sind. Immer wenn sie etwas Neues posten, erscheint das neue Foto auch auf ihrer Website.

Dies ist eine wirklich coole Möglichkeit, Instagram in Ihre visuell ausgerichtete Website zu integrieren. Sie zeigen Ihre letzten Posts und haben vorgefertigte Links zu Ihrem Instagram-Konto, auf die jeder klicken kann, um sie zu erkunden.

Diese Art der Einrichtung ist ansprechend und kann Ihre Website-Besucher hervorragend auf Ihre Instagram-Seite verweisen. Die Einrichtung ist jedoch komplizierter als Sie vielleicht denken.

Inhaltsverzeichnis ausblenden
Die Instagram-API
Option 1: Vortäuschen
Option 2: Manuelle Einbettungen
Option 3: Verwenden eines Schabers eines Drittanbieters
Option 4: Erstellen eines benutzerdefinierten Schabers
Option 5: Verwendung eines Plugins
Zusammenhängende Posts:

Die Instagram-API

Jetzt fragen Sie sich vielleicht: „Warum nicht einfach eines der verfügbaren Plugins verwenden?“ Die Antwort lautet im Allgemeinen: „Mach gleich weiter.“ Es gibt viele Plugins, die Ihnen diese Feed-Anzeigeoptionen bieten, und ich werde am Ende dieses Beitrags darüber sprechen.

Hier ist das Problem. Jedes dieser Plugins muss die Instagram-API verwenden, um auf Inhalte zuzugreifen und die Daten für eine offizielle Einbettung abzurufen. Wenn Sie die API nicht verwenden, müssen Sie die Seite schaben, und das Scrapen der Seite verstößt im Allgemeinen gegen die Nutzungsbedingungen für eine Website wie Instagram. Sie wollen sich schließlich nicht mit Inhaltsdieben und dergleichen auseinandersetzen.

Das heißt nicht, dass es nicht passiert. Ich bin sicher, Sie haben einige der Dutzenden von Websites gesehen, die nichts anderes tun, als Instagram zu kratzen. Seiten wie Picdeer, Pictame und Piknow haben eine interessante Geschichte hinter sich, also lassen Sie mich für einen Moment abschweifen.

Vor Jahren war Instagram ausschließlich eine mobile Plattform. Es gab keine Möglichkeit, über etwas anderes als die Instagram-App direkt darauf zuzugreifen. Das bedeutete, dass Desktop-Plattformen die Website nicht nutzen konnten und der geschäftliche Zugriff ziemlich eingeschränkt war.

Da viele Leute auf Instagram-Feeds zugreifen wollten, ohne ein mobiles Gerät oder eine mobile App verwenden zu müssen, sind diese Seiten alle entstanden. Alles, was sie taten, war, Instagram-Posts zu kratzen und sie öffentlich zu zeigen.

Schließlich hat Instagram sein Netzwerk für Desktops sichtbar gemacht, obwohl Sie in einigen Formen der Aktion, die Sie ergreifen können, immer noch eingeschränkt sind. Sie können z. B. im Moment nicht von einem Desktop aus posten.

Instagram-API tot

Keine dieser Seiten wurde offiziell unterstützt und keine von ihnen verwendete die Instagram-API. Alles, was sie getan haben, war, Inhalte mit benutzerdefinierten Apps zu kratzen. Nun, Instagram mochte diese nicht, und die Veröffentlichung ihrer Plattform half, sie zu bekämpfen. Viele starben über Nacht, aber einige, die noch existieren, wie die oben erwähnten, fügen einige zusätzliche Funktionen hinzu. Sie haben möglicherweise eine andere Art der Inhaltssuche oder eine Möglichkeit, neue Inhalte zu durchsuchen und zu entdecken, oder vielleicht nur eine einzigartige Art, die Inhalte anzuzeigen. Der Punkt ist, dass sie gezwungen waren, einen Mehrwert zu bieten, anstatt nur Inhalte zur Anzeige zu kratzen.

All dies dient im Grunde nur der Veranschaulichung eines Punktes. Während das Scraping technisch gegen die Nutzungsbedingungen von Instagram verstößt, haben sie nicht wirklich viel strafrechtlich verfolgt oder anderweitig gegen die Websites vorgegangen, die dies tun. Da einige der Optionen, die ich unten für Sie habe, ein solches manuelles Scraping beinhalten, können Sie sehen, warum dies ein Problem sein könnte.

Aber zurück zur Hauptfrage. Warum nicht einfach eines dieser Plugins verwenden? Nun, die Instagram-API ist eine unbeständige Geliebte. Tatsächlich hat Instagram erst im Dezember 2018 eine große Änderung an seiner API vorgenommen und die ältere Version als veraltet markiert. Sehen Sie den großen Haftungsausschluss/die Warnung oben auf dieser Seite? Das war alles, was die Warnmarken, die die API verwenden, erhalten haben.

Instagram-API veraltet

Jetzt verlassen sich die Plugins, die Sie finden, um Instagram-Feeds anzuzeigen, auf die Instagram-API oder auf Scraping. Wenn Instagram gegen Scraper vorgeht, sterben diese Plugins. Wenn Instagram seine API dramatisch ändert, sterben diese Plugins. In jedem Fall verlassen Sie sich darauf, dass ein Drittanbieter seinen Code an alle Änderungen anpasst, die Instagram vornimmt, was unzuverlässig sein kann.

Einige Plugins werde ich später noch auflisten, denn sie haben bewiesen, dass sie sich selbst auf dem neuesten Stand halten und auch durch Instagram-Änderungen funktionieren. Beachten Sie jedoch, dass stattdessen eine andere Lösung für Sie funktionieren kann.

Der andere Grund, warum diese Plugins Probleme haben könnten, ist, wenn sie Ihren API-Zugriff anstelle ihres eigenen benötigen. Einige nutzen Ihren API-Zugriff, um Ratenbegrenzungen zu umgehen; Sie rufen Inhalte mit dem API-Zugriff jedes Einzelnen ab und nicht mit einem zentralen Zugriff, der überfordert sein kann. Das Problem hier ist, wenn Ihr API-Zugriff aus dem einen oder anderen Grund widerrufen wird, können Sie diese Plugins nicht mehr verwenden.

Wenn Sie nach all dem immer noch daran interessiert sind, Ihre Instagram-Inhalte auf Ihrer Website anzuzeigen – und Sie sollten es sein, es ist ziemlich nützlich und wirklich cool –, haben Sie hier Ihre Optionen.

Option 1: Vortäuschen

Die erste Möglichkeit, die Sie haben, besteht darin, es mit viel Handarbeit zu fälschen. Es ist nicht schwierig, aber es kann zeitaufwändig sein, und es ist etwas, das Sie tun müssen, wenn Sie die Parität zwischen Ihrem Instagram-Konto und den „Einbettungen“ Ihrer Website wahren möchten. Ich habe Einbettungen hier in erschreckende Anführungszeichen gesetzt, weil sie nicht einmal technisch gesehen Einbettungen sind.

Wie funktioniert diese Methode? Wahrscheinlich nehmen Sie Fotos mit einer Digitalkamera auf und bearbeiten sie auf einem Computer, bevor Sie sie auf Ihr Mobilgerät hochladen, um sie auf Instagram zu posten. Erstellen Sie während der Bearbeitung zwei Kopien. Eine Kopie wird ganz normal auf Instagram hochgeladen. Die andere Kopie wird auf Ihr Webhosting hochgeladen.

Wenn Sie den Inhalt auf Instagram posten, erstellen Sie einen Instagram-Post. Diese enthält Ihre Bildunterschrift, den Permalink und andere damit verbundene Informationen. Erstelle und veröffentliche diesen Beitrag.

IG-Foto in Blog einbetten

Gehen Sie jetzt zu Ihrer Website und erstellen Sie ein Raster, in dem sich Ihre Instagram-Inhalte befinden sollen. Laden Sie Ihr Foto auf Ihren Webhost hoch und betten Sie es in eine der Zellen des Rasters ein. Kopieren Sie den Permalink zum Instagram-Post und machen Sie das Foto zu einem Link. Wenn Sie etwas möchten, das ein Hover-Skript verwendet, um Ihre Bildunterschrift anzuzeigen, ist etwas mehr Codierung erforderlich, aber Sie können Ihre Bildunterschrift auch kopieren und einfügen.

Diese Option hat zwei große Nachteile. Das erste ist, dass es Zeit braucht , und Sie müssen daran denken, es mit jedem Bild zu tun, das Sie auf Instagram posten. Wenn Sie vergessen, das Bild auf Ihre Website hochzuladen, alle Bilder im Raster nach unten zu verschieben und das neue Bild zum ersten Slot hinzuzufügen, sehen Ihre Feeds am Ende anders aus.

Der zweite große Nachteil ist, dass es Platz auf Ihrem Hosting beansprucht . Der Vorteil der Verwendung des Instagram-API-Zugriffs oder Scrapings besteht darin, dass die Bilder immer noch auf dem Facebook-CDN gehostet werden, was bedeutet, dass sie schnell geladen werden, ohne dass Sie Ihre eigenen Serverressourcen beanspruchen müssen. Diese gefälschte Einbettungsoption hat diesen Vorteil nicht.

Option 2: Manuelle Einbettungen

Ihre zweite mögliche Option ist die Verwendung von benutzerdefiniertem Code und manuellen Einbettungen von Instagram. Jeder Instagram-Post hat die Möglichkeit, ihn einzubetten. Klicken Sie auf den Beitrag und klicken Sie auf die drei Punkte oben rechts neben der Bildunterschrift, und eine der Optionen ist Einbetten. Dies kopiert einen längeren Code und verwendet die Instagram-API. Der Hauptvorteil hier ist, dass es trotz der Verwendung der API eine Kernfunktion von Instagram ist und sich wahrscheinlich nicht ändern wird. Wenn Instagram API-Änderungen vornimmt, stellen sie sicher, dass ihre eigenen Dienste nicht betroffen sind.

Fotos manuell einbetten

Wenn Sie den Beitrag auf Ihrer eigenen Website einbetten, wird er normalerweise in voller Größe und mit der Bildunterschrift für den Beitrag angezeigt, obwohl Sie festlegen können, dass die Bildunterschrift nicht enthalten sein soll, wenn Sie dies bevorzugen. Dies ist offensichtlich nicht ideal für ein kleines Raster aus mehreren Bildern. Um es auf diese Weise anzuzeigen, müssen Sie einen benutzerdefinierten Code verwenden, um die Bilder zu verkleinern und zu positionieren.

Dies ist im Grunde eine manuelle, durch Reifen springende Methode zum Erstellen eines Rasters auf eine Weise, die die Verwendung eines Plugins eines Drittanbieters umgeht. Es hostet jeden Beitrag auf Instagram, erfordert jedoch einen benutzerdefinierten Code und ist eine Art nervige Lösung. Sie müssen Ihre Posts immer noch manuell nach unten in Ihrem Raster verschieben, wenn Sie einen neuen hinzufügen möchten, und Sie müssen immer noch den Einbettungscode für jeden einzelnen manuell abrufen. Außerdem kann das Hinzufügen so vieler Einbettungen an derselben Stelle Ihre Ladezeiten erheblich verlängern. Insgesamt ist es nicht wirklich die beste Option.

Option 3: Verwenden eines Schabers eines Drittanbieters

Wie ich bereits erwähnt habe, ist Instagram nicht unbedingt so schwer zu kratzen. Sie können einen Scraper-Dienst eines Drittanbieters verwenden, um Ihnen Daten zu präsentieren, die Sie dann auf beliebige Weise formatieren und auf Ihrer Website einbetten können.

Feedity zum Beispiel ist ein solcher Scraper -Dienst eines Drittanbieters . Auf diese Weise können Sie eine Webseite in ihre benutzerdefinierte Scraper-Oberfläche laden und auswählen, nach welchen Daten Sie suchen und sie bei Änderungen kratzen möchten. Feedity formatiert in diesem Fall diese Daten speziell als RSS-Feed.

Feedity-Homepage

Sie können dann diesen RSS-Feed verwenden, um Inhalte auf Ihrer Seite einzubetten. Abhängig von Ihrem Website-Design können Sie dies auf verschiedene Arten tun. Dies ist ein Tutorial zum Erstellen eines RSS-Feeds und zum Einbetten sowohl des Inhalts als auch der Bilder auf Ihrer Website, wenn Ihre Website eine WordPress-Architektur verwendet. In der Zwischenzeit verwendet dieses Tutorial einfache HTML- und PHP-Codierung, um dasselbe für ein traditionelleres Website-Design zu tun.

Diese Option ist aus mehreren Gründen etwas weniger als ideal. Zunächst einmal erfordert es eine erhebliche Menge an benutzerdefinierter Codierung für Ihre Website. Wenn Sie selbst keine Erfahrung mit dem Programmieren haben, müssen Sie einen Entwickler beauftragen, was teuer werden kann.

Darüber hinaus verlassen Sie sich auf einen Drittanbieter-Dienst, der Ihr Scraping für Sie durchführt, und Sie verlassen sich darauf, dass dieser auf Instagram funktioniert – was schwierig ist – und Sie verlassen sich darauf, dass Instagram sein Website-Design nicht ändert, um genau diese Art von Scraping-Versuchen zu verhindern. Tatsache ist, Instagram mag keine Scraper, und obwohl sie ihnen nicht wirklich einzeln nachgehen, machen sie ihnen das Leben schwer.

Option 4: Erstellen eines benutzerdefinierten Schabers

Scraping ist natürlich gar nicht so schwer einzurichten. Es mag den Anschein haben, dass Scraping aufgrund der verschiedenen Scraping-Lösungen da draußen schwierig ist, aber sie alle versuchen, „eine Größe für alle“ zu sein, um ihre Dienstleistungen als Unternehmen zu verkaufen. Wenn Sie nur etwas selbst kratzen möchten, ist Ihr Code wahrscheinlich viel einfacher. Sie können dann einfach einen Code erstellen, um Instagram einmal am Tag oder was auch immer zu scrapen, die Daten nach Belieben formatieren und Ihre eigenen benutzerdefinierten Einbettungen einrichten.

Instagram Scraper-Code

Wie bei einigen anderen Optionen erfordert dies viel persönliche Programmier- oder Entwicklerzeit, was nicht ideal ist. Wenn Sie gerne programmieren, können Sie es selbst tun, aber wenn Sie kein Fan sind, müssen Sie für einen Entwickler bezahlen. Sie müssen sich auch damit auseinandersetzen, dass Instagram seine Website ändert und das Scrapen erschwert, was regelmäßig alle paar Monate passieren wird. Wenn Sie bereit sind, damit zu kämpfen, dann machen Sie es. Andernfalls ziehen Sie eine andere Option in Betracht.

Option 5: Verwendung eines Plugins

Ich weiß, dass ich Gründe durchgegangen bin, warum Sie ein Plugin vorher nicht verwenden sollten, aber Sie können es trotzdem in Betracht ziehen. Einige Plugins sind gut darin, mit Änderungen Schritt zu halten, benötigen Ihre API nicht, um zu funktionieren, und sind trivial einzurichten.

Für immer kostenloses IG-Widget

Betrachten Sie diese Optionen: EmbedSocial, Juicer, SnapWidget und Elfsight. Dies sind alles Optionen, die mit minimalem Setup genau das erreichen, was Sie wollen. Sie haben natürlich ihre eigenen Vor- und Nachteile, und einige von ihnen sind nicht kostenlos, aber genau das müssen Sie sich ansehen.