Soziale Wand 
Feed-Analytik 
Möchten Sie responsive X-Einbettungen (Twitter) anzeigen, um die Besucher Ihrer Website zu begeistern?
Wenn Sie alle Besucher Ihrer Website ansprechen möchten, ist das Einbetten von responsiven X-Beiträgen (Twitter) eine einfache Lösung.
Das Einfügen von responsiven X-Einbettungen (Twitter) kann jedoch verwirrend sein – vor allem, wenn man noch nicht mit Code vertraut ist.
In diesem Artikel zeigen wir Ihnen, wie Sie responsive X-Feeds (Twitter) in Ihre Website einbinden können.
Aber schauen wir uns zunächst einmal die verschiedenen Möglichkeiten an, wie Sie Ihre X-Einbettungen (Twitter) responsiv gestalten können.
Oder lesen Sie den Artikel „So bettet man einen responsiven X-Feed (Twitter) in Ihre Website ein“.
Möglichkeiten, responsive X-Einbettungen (Twitter) auf Ihrer Website hinzuzufügen
Um Inhalte von X (Twitter) einzubinden und gleichzeitig sicherzustellen, dass die X-Beiträge responsiv sind, stehen Ihnen zwei Möglichkeiten zur Verfügung:
- Manueller Weg: Generieren Sie einen Einbettungscode, ändern Sie den Code, um ihn responsiv zu machen, und fügen Sie ihn zu Ihrer Website hinzu.
- Automatische Methode: Verwenden Sie ein Social-Media-Plugin, das mobiloptimierte X-Feeds (Twitter) automatisch anzeigen kann.
Wenn Sie sich für die manuelle Vorgehensweise entscheiden, müssen Sie den offiziellen X (Twitter)-Einbettungscode-Generator publish.twitter.com in Ihrem Browser öffnen.
Sobald Sie den HTML-Einbettungscode erstellt haben, öffnen Sie Ihre Website erneut und fügen Sie den Einbettungscode ein.
Leider reagieren Ihre X-Beiträge möglicherweise nicht immer, wenn Sie die manuelle Methode verwenden. Um dieses Problem zu beheben, können Sie diesen CSS-Code hinzufügen.
.twitter-timeline {
width: 100vw !important;
}
Und wenn Sie Ihre X-Beiträge (Twitter) mithilfe von iFrames individuell anpassen möchten, müssen Sie den Code noch umfangreicher manuell bearbeiten oder einen Entwickler beauftragen.
Wie Sie sehen, kann das Einbetten von responsiven X-Inhalten (Twitter) mit dieser Methode zeitaufwendig und kompliziert sein.
Was ist besser: iFrame- oder X-Einbettungen (Twitter)?
Auch wenn manche Nutzer iFrames verwenden, um Inhalte von X (Twitter) anzuzeigen, kann dies Ihrer Website in vielerlei Hinsicht schaden.
Da iFrames standardmäßig nicht responsiv sind, müssen Sie den Code manuell bearbeiten, um sie mobilfreundlich zu machen.
Daher kann es sein, dass Besucher, die mobile Geräte nutzen, Ihre X-Beiträge nicht richtig anzeigen können.
Außerdem können Suchmaschinen wie Google den Inhalt von iFrames nicht lesen, was sich negativ auf die Suchmaschinenoptimierung auswirken kann.
Die gute Nachricht ist, dass Sie responsive X-Beiträge (Twitter) ganz einfach automatisch einbetten können. Sie können ein WordPress-Plugin verwenden, das über die API eine Verbindung zu X (Twitter) herstellt und X-Beiträge auf Ihrer Website zusammenfasst.
Schauen wir uns diese Methode im Folgenden an.
Der einfachste Weg, responsive X-Inhalte (Twitter) einzubinden
Wenn Sie nach der einfachsten Möglichkeit suchen, X- (Twitter-)Inhalte einzubetten, ist ein Plugin wie „X (Twitter) Feed Pro“ die beste Wahl.
Mit X (Twitter) Feed Pro können Sie ganz einfach responsive X (Twitter)-Feeds erstellen, anpassen und auf Ihrer Website einbinden – ganz ohne HTML, JavaScript, benutzerdefiniertes CSS oder sonstigen Code.
Befolgen Sie einfach diese einfache 3-Schritte-Anleitung, und schon steht Ihnen ein wunderschöner X (Twitter)-Feed zur Verfügung. Sie können eine X (Twitter)-Timeline, einen Hashtag, Suchergebnisse, die Start-Timeline und vieles mehr einbetten.
Da X (Twitter) Feed Pro das Design Ihrer Website automatisch übernimmt, passen Ihre X (Twitter)-Inhalte von Anfang an perfekt zum Erscheinungsbild Ihrer Marke.
Anschließend kannst du deinen X-Feed (Twitter) noch weiter anpassen, indem du eine vorgefertigte Vorlage auswählst, die du importieren möchtest.
Für noch mehr Anpassungsmöglichkeiten verfügt das Plugin über einen visuellen Editor, in dem Sie das Layout, die Farben, die Anzahl der X-Beiträge, den Stil der Kopfzeile, „Mehr laden“-Schaltflächen und vieles mehr festlegen können.
Außerdem können Sie alle Ihre Änderungen in der Live-Vorschau verfolgen.
Das Plugin verfügt über ein intelligentes Caching-System, das eine Kopie Ihrer X-Inhalte (Twitter) speichert. So kann Ihre Website den Besuchern die gespeicherte Kopie anzeigen, anstatt Ihre X-Beiträge jedes Mal von Grund auf neu zu laden.
Infolgedessen kann Ihre Website viel schneller geladen werden. Und mit einer schnelleren Website erhalten Sie auch eine viel bessere Suchmaschinenoptimierung.
Da X (Twitter) Feed Pro eine Sicherungskopie speichert, bleiben Ihre eingebetteten X-Beiträge auch dann online, wenn X (Twitter) selbst vorübergehend nicht erreichbar ist.
Alles in allem ist es das beste X (Twitter)-Feed-Plugin auf dem Markt und eine fantastische Lösung, wenn Sie responsive X (Twitter)-Einbettungen wünschen.
Sind Sie bereit, responsive X (Twitter)-Feeds einzubinden? Holen Sie sich noch heute Ihre Version von X (Twitter) Feed Pro!
Schauen wir uns nun an, wie Sie dieses Plugin nutzen können, um responsive X-Einbettungen (Twitter) auf Ihrer Website hinzuzufügen.
So bettet ihr einen responsiven X-Feed (Twitter) in eure Website ein
Um mit dem Einfügen von responsiven X-Einbettungen (Twitter) zu beginnen, können Sie einfach der folgenden Schritt-für-Schritt-Anleitung folgen:
Schritt 1: X (Twitter) Feed Pro installieren und aktivieren
Laden Sie sich zunächst hier das Plugin „X (Twitter) Feed Pro“ herunter. Sobald Sie das Plugin haben, installieren und aktivieren Sie es auf Ihrer WordPress-Seite, um fortzufahren.
Weitere Informationen finden Sie in dieser benutzerfreundlichen Anleitung zur Installation von WordPress-Plugins.
Anschließend können Sie mit Schritt 2 fortfahren und einen responsiven X-Feed (Twitter) erstellen.
Schritt 2: Erstellen eines X (Twitter) Feeds
Da das Plugin über einen einfachen, schrittweisen Leitfaden verfügt, können Sie mit nur wenigen Klicks einen neuen X-Feed (Twitter) erstellen.
Öffnen Sie zunächst Ihr Admin-Dashboard und navigieren Sie zum Menü „X (Twitter)-Feed“ » „Alle Feeds“ , bevor Sie oben auf die Schaltfläche „Neu hinzufügen“ klicken.
Als Nächstes fordert das Plugin Sie auf, die Art der X-Einbettungen (Twitter) auszuwählen, die Sie auf Ihrer Website anzeigen möchten. Es stehen 6 Optionen zur Auswahl, wobei jede X-Beiträge aus einer anderen Quelle anzeigt.
- Nutzer-Timeline: Wähle X (Twitter)-Profile aus , deren X-Beiträge du einbetten möchtest
- Hashtag: Wähle bestimmte Hashtags aus und binde dann die X-Beiträge mit diesem Hashtag ein
- Startseite-Timeline: X Beiträge aus der Startseite-Timeline deines Kontos einbetten
- Suche: Wählen Sie Suchbegriffe aus und binden Sie die X (Twitter)-Suchergebnisse in Ihre Website ein
- Erwähnungen: Zeige X Beiträge an, in denen der X-Account (Twitter) deiner Marke erwähnt wird
- Listen: Inhalte aus der von Ihnen ausgewählten X-Liste (Twitter) anzeigen
Sie können sogar mehrere Optionen auswählen, wenn Sie verschiedene Feed-Typen in einem (Twitter-)Feed zusammenfassen möchten.
Um fortzufahren, wählen Sie Ihren X (Twitter)-Feed-Typ aus und klicken Sie anschließend auf die Schaltfläche „Weiter “.
In unserem Beispiel verwenden wir einen Hashtag -Feed, um responsive X-Einbettungen (Twitter) anzuzeigen.
Nachdem Sie nun Ihren X (Twitter)-Feed erstellt haben, können Sie ihn in Schritt 3 mit Ihrem X (Twitter)-Konto verknüpfen.
Schritt 3: Verbinden Sie Ihr X (Twitter)-Konto
Um responsive Einbettungen auf Ihrer Website anzuzeigen, stellt das Plugin nun eine Verbindung zu Ihrem X-Konto (Twitter) her.
Klicken Sie dazu zunächst auf die Schaltfläche Verbinden .
Als Nächstes fordert „X (Twitter) Feed Pro“ einen Lesezugriff auf Ihr Konto an. Das Plugin kann diesen Zugriff dann nutzen, um Informationen auf X (Twitter) anzuzeigen, es kann jedoch keine Änderungen an Ihrem Konto vornehmen.
Daher ist das Plugin „X (Twitter) Feed Pro“ absolut sicher.
Klicken Sie dazu einfach auf die Schaltfläche App autorisieren .
Sobald Sie dies getan haben, öffnet „X (Twitter) Feed Pro“ Ihre Website, damit Sie eine Quelle für Ihren X (Twitter)-Feed hinzufügen können.
Eine Quelle ist das X-Profil (Twitter), ein Hashtag, ein Suchbegriff, eine Liste und vieles mehr, das Sie auf Ihrer Website einbinden möchten.
Um fortzufahren, geben Sie die Quelle in das Popup-Fenster ein und klicken Sie dann auf Weiter.
Für diesen responsiven X-Feed (Twitter) verwenden wir den Hashtag „KEEB_PD“ als Quelle.
Nachdem Sie Ihren Feed nun mit X (Twitter) verbunden und Ihre Quelle hinzugefügt haben, ist es an der Zeit, ihn anzupassen.
Schritt 4: Passen Sie Ihre responsiven X-Einbettungen (Twitter) an
Um Ihnen zu helfen, schnell festzulegen, wie die responsiven X-Beiträge auf Ihrer Website angezeigt werden sollen, können Sie eine vorgefertigte Vorlage importieren.
Hier sind die Feed-Vorlagen, aus denen Sie wählen können:
- Standard
- Gemäuer
- Einfaches Karussell
- Einfache Karten
- Schaufenster-Karussell
- Neueste X-Beiträge
- Widget
Klicken Sie auf Weiter, sobald Sie eine Feed-Vorlage ausgewählt haben, die Sie bevorzugen.
Nun können Sie Ihren X-Feed (Twitter) mithilfe des Live-Feed-Editors individuell anpassen. Auf der linken Seite finden Sie die Anpassungsoptionen, mit denen Sie das Layout Ihres Feeds, das Design der Kopfzeile, die Lightbox-Option, das Farbschema und vieles mehr ändern können.
Du kannst auch die Moderationsoptionen in den Feed-Einstellungen nutzen, um die X-Beiträge, die auf deiner Website angezeigt werden, gezielt auszuwählen.
Das Plugin verfügt über eine einfache Echtzeit-Vorschau auf der rechten Seite, damit Sie Ihre Änderungen im Auge behalten können.
Als ersten Schritt können Sie das Layout der X-Beiträge auf Ihrer Website ändern.
Suchen Sie dazu die Option Feed-Layout auf der linken Seite und klicken Sie sie an.
Anschließend zeigt Ihnen „X (Twitter) Feed Pro“ drei Layouts an, aus denen Sie wählen können: „Liste“, „Karussell“ und „Masonry“.
Schauen wir sie uns im Folgenden an:
Wenn Sie X Beiträge ähnlich wie auf der offiziellen Website von X (Twitter) anzeigen möchten, können Sie das Listenlayout wählen.
Außerdem wird dein X-Feed (Twitter) auf diese Weise gut sichtbar auf deiner Webseite angezeigt.
Wenn Sie Spalten zur Darstellung von X-Einbettungen (Twitter) verwenden möchten, können Sie das Masonry-Layout nutzen.
Mit diesem Layout kannst du jede Menge X-Beiträge auf einmal anzeigen.
Wenn du dich für das Karussell-Layout entscheidest, kannst du deine X-Beiträge in einer interaktiven X- (Twitter-)Diashow anzeigen.
Ihre Besucher haben so eine weitere Möglichkeit, sich mit Ihrer Website zu beschäftigen.
Nachdem Sie ein Feed-Layout ausgewählt haben, klicken Sie auf die Schaltfläche Speichern .
Klicken Sie anschließend auf die Schaltfläche „Anpassen“ , um das Erscheinungsbild Ihres X-Feeds (Twitter) weiter anzupassen.
Dieses Mal kannst du die Farben deines responsiven X-Feeds (Twitter) selbst auswählen.
Klicken Sie zunächst auf die Option Farbschema .
X (Twitter) Feed Pro bietet 4 verschiedene Farbschemata, die Sie ausprobieren können:
- Von Theme übernehmen: Die Farben Ihres WordPress-Themes für Ihre X-Beiträge kopieren
- Hell: Dunkle Schriftfarbe mit hellem Hintergrund
- Dunkel: Dunkler Hintergrund und eine helle Schrift
- Benutzerdefiniert: Wählen Sie manuell alle Ihre Farben aus
Um fortzufahren, wählen Sie Ihr Farbschema aus und klicken Sie dann auf Speichern.
Möchtest du deine X (Twitter)-Einbettungen noch weiter anpassen? Mit den übrigen Schaltflächen kannst du den Stil der Kopfzeile, das Design der Schaltflächen, die Anzahl der X-Beiträge, die Größe des Feeds und vieles mehr festlegen.
Klicken Sie abschließend auf „Speichern“, um das neue Design Ihres X-Feeds (Twitter) zu bestätigen.
In Schritt 5 können Sie diesen X-Feed (Twitter) mithilfe dieses Plugins schließlich in Ihre WordPress-Website einbinden.
Schritt 5: Fügen Sie Responsive X (Twitter)-Einbettungen auf Ihrer Website hinzu
Mit Hilfe von X (Twitter) Feed Pro gibt es zwei Möglichkeiten, wie Sie X (Twitter)-Inhalte in Ihre Website einbetten können:
- Responsive X-Einbettungen (Twitter) auf einer Webseite hinzufügen
- Fügen Sie responsive X-Einbettungen (Twitter) in die Seitenleiste oder Fußzeile der Website ein
Responsive X (Twitter)-Einbettungen auf einer Webseite hinzufügen
Da das Plugin so benutzerfreundlich ist, können Sie Ihren X-Feed (Twitter) direkt über den Live-Feed-Editor einbetten.
Klicken Sie zunächst auf die Schaltfläche Einbetten am oberen Rand des Editors.
Sobald Sie das getan haben, zeigt Ihnen das Plugin ein Popup-Fenster mit den verschiedenen Möglichkeiten an, wie Sie X-Feeds (Twitter) einbetten können.
Klicken Sie auf die Schaltfläche Zu einer Seite hinzufügen auf dem Popup, um fortzufahren.
Sie können nun die WordPress-Seite auswählen, auf der Sie den Feed anzeigen möchten.
Nachdem Sie die Seite im Popup ausgewählt haben, klicken Sie auf die Schaltfläche Hinzufügen, um fortzufahren.
Sobald Sie das getan haben, öffnet das Plugin die Seite im WordPress-Editor, damit Sie Ihren Feed einbetten können.
Fügen Sie nun einen neuen Inhaltsblock hinzu, indem Sie auf das Plus-Symbol (+) klicken.
Suchen Sie mithilfe der Suchleiste oben nach dem Block „Twitter-Feed“ und klicken Sie dann auf den darunter liegenden Block „X (Twitter)-Feed “.
Anschließend wird deine X (Twitter)-Einbettung im WordPress-Editor angezeigt.
Klicken Sie abschließend auf die Schaltfläche „Aktualisieren“, und Ihr X-Feed (Twitter) ist online.
Wenn Sie Ihre Webseite öffnen, können Sie sehen, wie Ihre responsiven X-Einbettungen (Twitter) aussehen.
Wie Sie sehen können, macht es „X (Twitter) Feed Pro“ kinderleicht, für Mobilgeräte optimierte X (Twitter)-Inhalte auf Ihrer Website anzuzeigen.
Schauen wir uns nun die nächste Möglichkeit an, X-Feeds (Twitter) einzubinden.
Responsive X (Twitter)-Einbettungen in die Seitenleiste oder Fußzeile der Website einfügen
Die nächste Möglichkeit besteht darin, ein X-Widget (Twitter) zu verwenden, um responsive X-Beiträge in der Seitenleiste oder in der Fußzeile Ihrer Website anzuzeigen.
Wie bei der vorherigen Methode können Sie auch diesmal den Live-Editor verwenden.
Wenn Sie einen Feed erneut im Live-Feed-Editor öffnen möchten, rufen Sie zunächst in Ihrem WordPress-Dashboard das Menü „X (Twitter)-Feed » Alle Feeds“ auf.
Klicken Sie anschließend auf den X-Feed (Twitter), den Sie einbetten möchten.
Wie du siehst, ist es kinderleicht, einen X-Feed (Twitter) im Live-Feed-Editor erneut zu öffnen.
Klicken Sie dann oben auf die Schaltfläche Einbetten, um loszulegen.
Über das Popup-Fenster kannst du nun ein neues X-Widget (Twitter) erstellen, um responsive X-Beiträge anzuzeigen.
Klicken Sie dann im Popup-Fenster auf die Schaltfläche Zu einem Widget hinzufügen .
Nun öffnet das Plugin die Widget-Seite Ihrer Website, auf der Sie Ihr X- (Twitter-)Feed-Widget hinzufügen können.
Sobald Sie dort sind, können Sie den Standort Ihrer X-Beiträge auswählen.
Wenn Sie responsive X-Einbettungen (Twitter) in der Seitenleiste anzeigen möchten, klicken Sie auf das Seitenleisten-Bedienfeld .
Oder Sie klicken auf „Fußzeile“, um X Beiträge in der Fußzeile Ihrer Website anzuzeigen.
Für dieses Beispiel wird eine WordPress-Seitenleiste verwendet.
Um ein neues Widget hinzuzufügen, klicken Sie auf das Plus-Symbol (+) am unteren Rand.
Wählen Sie anschließend aus den verfügbaren Optionen das Widget „X (Twitter)-Feed“ aus, um fortzufahren.
Sie können die Einbettung Ihres X-Feeds (Twitter) nun abschließen, indem Sie auf die Schaltfläche „Aktualisieren“ klicken.
Und schon haben Sie einen Feed mit responsiven X-Einbettungen (Twitter) in Ihrer Seitenleiste oder Fußzeile.
Und das war's!
Wie du siehst, lässt sich das Einbinden responsiver X (Twitter)-Embed-Elemente in deine Website mit Hilfe von X (Twitter) Feed Pro ganz einfach bewerkstelligen.
Sie können nun relevante X-Beiträge anzeigen, um das Interesse Ihrer Besucher aufrechtzuerhalten, Ihre X-Follower (Twitter) zu erhöhen, Ihre Konversionsrate zu steigern und vieles mehr.
Möchten Sie responsive X (Twitter)-Feeds einbinden? Klicken Sie hier, um X (Twitter) Feed Pro für Ihre Website zu erhalten!
Wenn du schon mal hier bist, vergiss nicht, dir diese Liste mit den besten Möglichkeiten anzusehen, auf X (Twitter) Geld zu verdienen.
Wenn Sie diesen Beitrag hilfreich fanden, folgen Sie uns doch auf Facebook und X (Twitter), um weitere informative Tipps und Tricks für soziale Medien zu erhalten.
