Anmerkung: Unsere beliebtesten Anleitungen wurden ins Deutsche übersetzt, alle restlichen Anleitungen sind bisher nur auf Englisch verfügbar
Using Instagram Blocks

Verwenden Sie den Instagram-Block, um Fotos von Instagram auf Ihrer Website anzuzeigen. Dies ist eine großartige Möglichkeit zur Präsentation Ihrer Instagram-Fotos, ohne Galerie-Blöcke oder Galerie-Seiten zu verwenden. Wenn Sie Ihren Feed aktualisieren, wird der Instagram-Block synchronisiert und zeigt Ihre aktuellsten Fotos an.

Mit dem Instagram-Block können Sie:

  • Ihren eigenen Instagram-Feed anzeigen.
  • Einen Feed aus Suchergebnissen anzeigen, der nach Hashtags, Erwähnungen oder einem bestimmten Thema gefiltert ist.
  • Bis zu zwanzig Bilder in einem Feed anzeigen.

Ein Video anschauen

Bevor Sie beginnen

  • Wir empfehlen, sich bei Instagram auszuloggen, damit Sie eine Verbindung zum richtigen Konto herstellen.
  • Wenn Sie ein privates Instagram-Konto mit einem Instagram-Block verbinden, werden im Block Vorschaubilder angezeigt, die bei Anklicken zu einem toten Link führen. Um dies zu vermeiden, stellen Sie Ihr Instagram-Konto auf öffentlich.
  • The image description you add on Instagram can display as a caption in the Stacked design and Slideshow design, and in the lightbox for the Grid design. Slideshow captions don't display on mobile. Learn how your template styles these captions.
  • Instagram posts with multiple images or videos display the first item as a static image in the Instagram Block. Enable Open links in new window to link visitors to the full post.

Schritt 1 - Ihr Instagram-Konto verbinden

Sie müssen Ihr Konto verbinden, bevor Sie Instagram in Kombination mit Squarespace nutzen können:

  1. Loggen Sie sich aus allen Instagram-Konten aus.
  2. Klicken Sie im Home Menu (Hauptmenü) auf Settings (Einstellungen).
  3. Klicken Sie auf Connected Accounts (Verbundene Konten).
  4. Klicken Sie auf Connect Account (Konto verbinden).
  5. Wählen Sie Instagram im Menü Social Accounts (Social Media-Konten) aus.
  6. Loggen Sie sich mit Ihrem Benutzernamen und Passwort von Instagram ein.

Schritt 2 - Den Instagram-Block hinzufügen

  1. Öffnen Sie eine Seite oder den Eintrags-Editor.
  2. Klicken Sie auf einen Einfügepunkt oder das + Symbol.
  3. Wählen Sie im Menü Instagram aus.
  4. Eine ausführlichere Anleitung finden Sie hier: Blöcke hinzufügen.

Schritt 3 - Ein Design auswählen

Hinweis: Einige Design-Optionen werden auf Mobilgeräten unterschiedlich dargestellt. Eine Vorschau Ihrer Einstellungen erhalten Sie in der Geräteansicht.

Sie können einstellen, wie Ihre Instagram-Fotos im Block angezeigt werden. Es gibt vier Design-Optionen, zwischen denen Sie im Reiter Design wählen können.

  • Slideshow
  • Carousel (Karussell)
  • Grid (Raster) 
  • Stack (Stapel)

Weiter unten erhalten Sie zusätzliche Informationen über die einzelnen Design-Optionen.

instagram-block-designs.png

Slideshow

Diese Option zeigt jeweils immer ein Bild an.

Design-Optionen

Automatically Transition Between Slides (Automatischer Übergang zwischen den Slides) Automatischer Wechsel zum nächsten Bild nach einer eingestellten Zeitspanne. Wenn diese Option aktiviert ist, erscheint ein Schieberegler, mit dem die Übergangszeit auf eine bis zehn Sekunden eingestellt werden kann.
Show Next and Previous Controls (Steuerung für Weiter und Zurück anzeigen) Fügt Pfeile hinzu, mit denen man zu den vorherigen und folgenden Elementen navigieren kann. Diese Steuerung erscheint mit einem Overlay auf der rechten und linken Seite des Bildes.
Automatically Crop Images (Bilder automatisch zuschneiden) Schneidet die Bilder zu oder passt deren Größe an, um das beste Design zu erhalten.
Show Thumbnails (Vorschaubilder anzeigen) Fügt einen Streifen mit Vorschaubildern aller in der Galerie enthaltenen Bilder unter dem Hauptbild ein. Wenn diese Option aktiviert ist, werden Schieberegler angezeigt, mit denen Sie die Höhe des Vorschaubilder-Streifens und den Abstand zwischen dem Streifen und dem Hauptbild einstellen können.
 
Bildunterschrift anzeigen

Displays image descriptions. When checked, more options appear to set the position of the descriptions and to only display them on hover.

Diese Beschreibungen werden auf Mobilgeräten nicht angezeigt.

Links in neuem Fenster öffnen Clicking images opens Instagram in new tab.

 

This option displays a full image with portions of the previous and next images on either side, depending on the settings.

Design-Optionen

Automatically Transition Between Slides (Automatischer Übergang zwischen den Slides) Automatischer Wechsel zum nächsten Bild nach einer eingestellten Zeitspanne. Wenn diese Option aktiviert ist, erscheint ein Schieberegler, mit dem die Übergangszeit auf eine bis zehn Sekunden eingestellt werden kann.
Show Next and Previous Controls (Steuerung für Weiter und Zurück anzeigen) Fügt Pfeile hinzu, mit denen man zu den vorherigen und folgenden Elementen navigieren kann. Diese Steuerung erscheint mit einem Overlay auf der rechten und linken Seite des Bildes.
Active Alignment (Aktive Ausrichtung) Der Schieberegler steuert das aktive Bild. Dieses Element wird in voller Größe angezeigt.
Links in neuem Fenster öffnen Clicking images opens Instagram in new tab.

 

Raster

Diese Option zeigt ein Raster aus Vorschaubildern an.

Design-Optionen

Aspect Ratio (Seitenverhältnis) Steuert die Größe, in der Ihre Bilder angezeigt werden. Wenn hier kein Häkchen gesetzt ist, ändert das Seitenverhältnis die Abmessungen des Bild- und Video-Containers.
Crop Images (Bilder zuschneiden) Entfernt das Padding der Bild-Container und zeigt sie in der Größe an, die Sie im Seitenverhältnis-Drop-Down-Menü ausgewählt haben.
Thumbnails Per Row (Vorschaubilder pro Reihe) Passt die Anzahl der in einer Reihe des Rasters angezeigten Vorschaubilder an.
Padding Stellt das Padding außerhalb des Bild-Containers ein.
Lightbox

Wenn hier ein Häkchen gesetzt ist, wird ein angeklicktes Bild mit einem schwarzen Hintergrund angezeigt.

The image's caption will display on hover in the lightbox. In mobile, tap the circle in the bottom-right corner of the lightbox to display the image's caption.

Links in neuem Fenster öffnen Clicking images opens Instagram in new tab. This option won't work if the lightbox is enabled.

 

Stack (Stapel)

This option displays the images at full width in a stack.

Bildunterschrift anzeigen

Displays image descriptions below each image.

Links in neuem Fenster öffnen Clicking images opens Instagram in new tab.

 

Schritt 4 - Ein Suchergebnis anzeigen

Instead of displaying your own Instagram feed, you can display a feed of public images tagged with a specific hashtag. Displaying search in the Instagram Block is a great way to show crowdsourced images about your company, wedding, or other special event. You can enable the search function on up to 20 Instagram Blocks per site.

Setzen Sie bei Search (Suche) ein Häkchen und geben Sie unter Verwendung des Hashtag-Formats (#topic) einen Suchbegriff ein:

Note: The search field doesn't accept special characters, such as ü, é, ñ, or ø. 

instagram_-_hashtag_filter.jpg

Klicken Sie auf das Symbol Refresh (Aktualisieren), damit die Ergebnisse angezeigt werden.

instagram_-_refresh_filter.jpg

Schritt 5 - Speichern

Klicken Sie auf Apply (Anwenden), um Ihre Änderungen zu speichern.

Hier sehen Sie ein Beispiel für das Erscheinungsbild eines Instagram-Blocks auf einer Website:

Fehlerbeseitigung

Mein Instagram-Block und mein Instagram-Feed stimmen nicht überein.

Der Instagram-Block wird alle 30 Minuten aktualisiert, daher erscheinen neue Fotos nicht augenblicklich im Block. Sollten neue Fotos nicht nach 30 Minuten angezeigt werden, befolgen Sie diese Schritte.

  1. Klicken Sie im Home Menu (Hauptmenü) auf Settings (Einstellungen) und dann auf Connected Accounts (Verbundene Konten).
  2. Wählen Sie Ihr Instagram-Konto aus.
  3. Stellen Sie sicher, dass bei Download Data (Daten herunterladen) ein Häkchen gesetzt ist.
  4. Klicken Sie auf Save (Speichern).

Ich erhalte die Meldung “There are no items to display from the selected collection”.

  1. Klicken Sie im Home Menu (Hauptmenü) auf Settings (Einstellungen) und dann auf Connected Accounts (Verbundene Konten).
  2. Wählen Sie Ihr Instagram-Konto aus.
  3. Prüfen Sie, ob bei Download Data (Daten herunterladen) ein Häkchen gesetzt ist oder nicht und folgen Sie den entsprechenden Schritten unten.

Wenn dieses Häkchen bereits gesetzt wurde, entfernen Sie Ihr Instagram-Konto und fügen Sie es dann erneut hinzu:

  1. Klicken Sie in den Instagram-Einstellungen auf Disconnect (Trennen).
  2. Gehen Sie zurück zum Menü Connected Accounts (Verbundene Konten) und klicken Sie auf Connect Account (Konto verbinden).
  3. Wählen Sie Instagram aus und melden Sie sich mit Ihrem Benutzernamen und Passwort bei Ihrem Instagram-Konto an.
  4. Aktivieren Sie die Option Download Data (Daten herunterladen) und klicken Sie anschließend auf Save (Speichern).

Sollte hier noch kein Häkchen gesetzt sein, setzen Sie eines bei Download Data (Daten herunterladen) und aktualisieren Sie die Seite. Drücken Sie  + R auf einem Mac oder Strg + R auf einem PC.

Wenn Sie nach diesen Schritten immer noch Probleme haben, entfernen Sie den Instagram-Block und fügen Sie ihn erneut hinzu:

  1. Fahren Sie mit der Maus über den Instagram-Block.
  2. Klicken Sie auf das Papierkorb-Symbol.
  3. Klicken Sie auf einen Einfügepunkt und wählen Sie den Instagram-Block erneut aus.
  4. Wählen Sie Ihr Instagram-Konto aus und klicken Sie auf Save (Speichern).

Der Instagram-Block zeigt doppelte oder falsche Bilder an

Versuchen Sie, die Daten in Connected Accounts (Verbundene Konten) zurückzusetzen:

  1. Klicken Sie im Home Menu (Hauptmenü) auf Settings (Einstellungen) und dann auf Connected Accounts (Verbundene Konten).
  2. Wählen Sie Ihr Instagram-Konto aus.
  3. Klicken Sie auf Reset Data (Daten zurücksetzen).
  4. Klicken Sie auf Save (Speichern).
  5. Öffnen Sie die Seite mit dem Instagram-Block und aktualisieren Sie die Seite. Drücken Sie  + R auf einem Mac oder Strg + R auf einem PC.

Die Suche funktioniert bei meinem Instagram-Block nicht

Instagram recently updated how their search works. If you're having trouble with search, use these steps to reauthorize your Instagram account:

  1. Klicken Sie im Home Menu (Hauptmenü) auf Settings (Einstellungen) und dann auf Connected Accounts (Verbundene Konten).
  2. Wählen Sie Ihr Instagram-Konto aus.
  3. Klicken Sie auf Disconnect (Trennen).
  4. Klicken Sie auf Confirm (Bestätigen).
  5. Scrollen Sie nach oben und klicken Sie auf Connect Account (Konto verbinden).
  6. Scrollen Sie nach unten und wählen Sie Instagram aus dem Menü Social Accounts (Social Media-Konten) aus und melden Sie sich unter Verwendung Ihres Benutzernamens und Passworts bei Instagram an.
  7. Klicken Sie auf Save (Speichern).
  8. Öffnen Sie die Seite mit dem Instagram-Block und aktualisieren Sie die Seite. Drücken Sie  + R auf einem Mac oder Strg + R auf einem PC.
War dieser Beitrag hilfreich?
93 von 262 fanden dies hilfreich
Using Instagram Blocks