X-Embed-Generator (Twitter)

Soziale Medien Video Code
Design
Ausrichtung

Einleitung

Der Toollect X-Embed-Generator (Twitter) verwandelt jede Tweet-URL in den offiziellen Einbettungscode, den X für die Anzeige von Beiträgen auf anderen Websites veröffentlicht – den twitter-tweet-blockquote plus widgets.js – mit einem Klick, einer Live-Vorschau vor dem Kopieren und allen Anzeigeoptionen, die X in seiner eigenen Oberfläche anbietet. Link einfügen, Optionen wählen, Vorschau ansehen, kopieren, einfügen. Der ganze Zyklus dauert Sekunden.

Die Reibung, die er beseitigt, kennen alle, die schon einmal von Hand einen Tweet eingebettet haben. Xs eigener Publisher-Dialog erzeugt zwar den Code, verteilt seine Wahlmöglichkeiten aber über getrennte Bildschirme, bietet keine Steuerung zum Ausblenden von Medien oder zur Ausrichtung und gibt Clip-Einbettungen überhaupt keine numerische Breitensteuerung. Der blockquote von Hand funktioniert so lange, bis ein Attribut falsch geschrieben ist und der Tweet ewig als nackter Link dasteht. Dieses Werkzeug setzt das Markup exakt so zusammen, wie es widgets.js erwartet, übersetzt Ihre Optionen in die richtigen data-*-Attribute und zeigt Ihnen das echte Rendering, bevor irgendetwas Ihre Seite erreicht.

Der Generator bietet hinter einer Tab-Leiste zwei Modi. Beitrag erstellt die klassische Karte für jeden Tweet – Text, Fotos, Linkvorschauen – mit Design, Breite von 220 bis 550 Pixeln, Oberflächensprache, Ausrichtung, Sichtbarkeit von Unterhaltung und Medien, Do Not Track und einer Option zum Weglassen des gemeinsamen Skript-Tags. Clip optimiert denselben Tweet für seinen Player, mit einer Breite bis zu 1920 Pixeln im Attribut data-media-max-width, das große Videos verdienen. Beide Modi sprechen direkt den öffentlichen oEmbed-Endpunkt von X an – ohne API-Schlüssel, ohne Anmeldung und ohne Toollect-Server dazwischen.

Anwendungsfälle

Das Einbetten von X-Inhalten taucht an mehr Stellen auf als im Blogbeitrag, und die beiden Modi teilen sich die Arbeit auf natürliche Weise.

Blogs und redaktionelle Inhalte

Ein Kommentarbeitrag, der einen öffentlichen Account zitiert, ein Technikartikel mit eingebettetem Ankündigungstweet, ein Sportblog mit dem Highlight-Clip – die klassischen Fälle. Der Beitrag-Modus mit den Standardeinstellungen deckt Text-Tweets ab; wechseln Sie in den Clip-Modus, wenn der Tweet hauptsächlich ein Video ist und der Player die Spalte gehören soll.

Newsrooms und Live-Berichterstattung

Journalisten ziehen Augenzeugenberichte und offizielle Stellungnahmen in laufende Berichterstattung. Tempo zählt, ebenso Verifikation – der Generator normalisiert jeden Link, den der Kontaktmensch vor Ort teilt, ob App-Share-Link mit Tracking-Parametern, Legacy-twitter.com-Form oder Foto-Ansichtsvariante, zu einer kanonischen Tweet-Referenz, und die Vorschau bestätigt, dass der Tweet noch rendert, bevor der Artikel rausgeht. Die Option „Unterhaltung ausblenden“ hält einen Antwortthread beim zitierten Statement statt beim Streit darüber.

Dokumentation und technisches Schreiben

Release Notes, Changelogs und Tutorials zitieren zunehmend Entwickler-Threads als Primärquellen. „Medien ausblenden“ staucht Linkvorschauen auf Text zusammen für eine ruhigere Lektüre, der Sprachwahlrender rendert Aktionsschaltflächen und Zeitstempel in der Sprache der Dokumentation, und „Script weglassen“ hält Seiten, die widgets.js bereits global laden – Komponentenbibliotheken, Dokumentationsthemen – frei von doppelten Skript-Tags.

Marketingseiten und Portfolios

Kundenlob-Tweets als Social Proof, Gründer-Threads als Markengeschichte. Die Ausrichtung „Mitte“ zentriert eine einzelne Referenz in einer schmalen Spalte; Do Not Track signalisiert europäischem Publikum Datenschutzrespekt; die Vorschau prüft jede Karte, bevor sie ausgeliefert wird.

So funktioniert es

Das Tool läuft in vier Schritten:

  1. URL parsen und kanonisieren – die Eingabe wird gegen die X-Link-Grammatik für Tweets geprüft – ein Benutzername (ohne @, 1–15 Buchstaben, Ziffern oder Unterstriche), die Route status und eine Snowflake-ID mit 15–19 Ziffern auf x.com oder twitter.com mit optionalen Präfixen www./mobile./m.. Abfrageparameter wie ?s=20&t=… werden ignoriert statt bereinigt – die neu gebaute kanonische URL enthält sie einfach nie. Routen ohne Benutzernamen wie /i/web/status/… des Webclients werden mit einer eigenen Meldung abgelehnt, weil der oEmbed-Endpunkt sie nicht auflösen kann.
  2. Die offizielle Anfrage bauen – Ihre Optionen werden zu Abfrageparametern am öffentlichen oEmbed-Endpunkt von X (publish.x.com/oembed?url=…) – maxwidth, theme, lang, hide_thread, hide_media, align, dnt, omit_script. Der Endpunkt ist schlüsselfrei und bewusst ohne Rate-Limit – er existiert genau dafür, dass CMSs URLs in Embeds umwandeln.
  3. Das offizielle Markup abrufen – genau ein HTTPS-GET liefert den blockquote-HTML exakt so zurück, wie X ihn formatiert, mit Ihren Optionen bereits eingebacken als data-*-Attribute. Ihr Browser spricht direkt mit X; kein Toollect-Server berührt die Anfrage.
  4. Nachbearbeiten und in der Vorschau zeigen – das Script-Tag des Servers wird entfernt und separat verwaltet (damit die Vorschau widgets.js genau einmal lädt, egal wie oft Sie neu generieren), der Clip-Modus schreibt das Breitenattribut clientseitig um (siehe unten, warum), und der blockquote wandert in den Vorschaubereich. Das Tool beobachtet das gerenderte iframe und meldet ehrlich, wenn es nie erscheint.

Jede Optionsänderung durchläuft die ganze Kette erneut – neue Anfrage, frisches Markup, neu gerenderte Vorschau –, sodass der kopierte Code immer dem entspricht, was Sie sehen.

Unterstützte URL-Formate

Der Generator akzeptiert jedes URL-Format, das einen Tweet mit seinem Benutzernamen identifiziert, und lehnt alles andere mit einer konkreten Meldung ab.

Akzeptierte Formate

Format Beispiel Ergebnis
Kanonischer Beitrag x.com/benutzername/status/1234567890123456789 Einbettung dieses Tweets
Legacy-Domain twitter.com/jack/status/20 Einbettung dieses Tweets
Mobile-Subdomain mobile.twitter.com/benutzername/status/… Einbettung dieses Tweets
www-Präfix www.x.com/benutzername/status/… Einbettung dieses Tweets
Ohne Schema x.com/benutzername/status/… Einbettung dieses Tweets
Foto-Ansichtsvariante x.com/benutzername/status/…/photo/1 Einbettung dieses Tweets
Video-Ansichtsvariante x.com/benutzername/status/…/video/1 Einbettung dieses Tweets
Mit Tracking-Parametern …?s=20&t=…&ref_src=twsrc%5Etfw Einbettung dieses Tweets – Parameter werden ignoriert

Ansichtsvarianten und Junk-Parameter nach der Tweet-ID werden schlicht ignoriert – die Einbettung zeigt immer auf den Tweet selbst, der seine eigenen Medien rendert. Das Präfix https:// und der abschließende Schrägstrich sind optional.

Abgelehnte Formate

URL-Form Ablehnungsgrund
x.com/i/web/status/1234567890123456789 Die benutzernamenlose Route des Webclients – der oEmbed-Endpunkt antwortet darauf mit 404. Öffnen Sie den Link und kopieren Sie die vollständige Adresse mit Benutzername
x.com/benutzername Ein Profil – kein Tweet zum Einbetten
x.com/intent/tweet?text=… oder x.com/intent/retweet?tweet_id=… Share-Intents – Aktionen, keine Inhalte
x.com/hashtag/thema oder x.com/search?q=… Hashtag- und Suchseiten – kein einzelner Tweet
facebook.com/… und jeder andere Host Keine X-Domain

Der Fall ohne Benutzernamen unter /i/web/status/… verdient Betonung, weil er die häufigste Überraschung ist. X liefert diese Form aus, wenn eine Tweet-URL aus dem Webclient kopiert wird, ohne den Tweet zu öffnen. Der Generator lehnt sie bewusst ab – eine Weiterleitung an den Endpunkt würde still scheitern – und weist Sie auf den vollständigen Link hin. Der X (Twitter)-URL-Parser auf dieser Seite löst solche Links in ihre kanonische Form auf, falls Sie die URL reparieren wollen, statt sie neu zu kopieren.

Anatomie des Einbettungscodes

Die Ausgabe ist derselbe Code, den Xs eigene Maschinerie erzeugt, mit Ihren Optionen angewandt. Eine Beitrag-Einbettung mit den Standardeinstellungen sieht so aus (Inhalte gekürzt):

<blockquote class="twitter-tweet" data-width="550">
  <p lang="en" dir="ltr">Just setting up my twttr</p>
  &mdash; Jack (@jack)
  <a href="https://x.com/jack/status/20?ref_src=twsrc%5Etfw">21. März 2006</a>
</blockquote>
<script async src="https://platform.x.com/widgets.js" charset="utf-8"></script>

Die Teile im Einzelnen:

  • Die blockquote-Klassetwitter-tweet ist der Haken, nach dem widgets.js sucht. Jedes Element mit dieser Klasse auf der Seite wird zu einer gerenderten Karte.
  • data-width (Beiträge) – die maximale Renderbreite in Pixeln. X klemmt den Wert intern auf etwa 250–550, unabhängig davon, was drinsteht – der Generator hält Ihren gewählten Wert daher im ehrlichen Bereich.
  • data-media-max-width (Clips) – wie breit die Medien innerhalb der Karte wachsen dürfen, bis zu 1920 Pixel. Nur im Clip-Modus vorhanden – siehe Beitrag vs. Clip, warum der Generator dieses Attribut selbst schreibt.
  • data-theme="dark" – nur vorhanden, wenn Dunkel gewählt ist. Rendert hellen Text auf dunklem Grund und die dunkle Kartenoptik.
  • data-lang – vorhanden, sobald eine konkrete Sprache gewählt ist, Englisch eingeschlossen. Lokalisiert die eigenen Texte des Widgets – Zeitstempelformat, den Weiterlesen-Verweis, Aktionsbeschriftungen – aber niemals den Tweet-Text selbst. Nur Automatisch lässt das Attribut weg; widgets.js fällt dann auf die Seitensprache zurück.
  • data-conversation="none" – gesetzt durch „Unterhaltung ausblenden“ bei einer Antwort. Ohne dieses Attribut stellt widgets.js eine eingeklappte Zusammenfassung des Eltern-Beitrags voran.
  • data-cards="hidden" – gesetzt durch „Medien ausblenden“. Linkvorschauen, Fotos und Videos bleiben eingeklappt; nur der Text rendert.
  • data-align – floatet die Karte links oder rechts oder zentriert sie relativ zum Container. Fehlt bei der Ausrichtung „Keine“.
  • data-dnt="true" – gesetzt durch die Personalisierungs-Opt-out-Option. Weist X an, die Einbettung und ihre Seitenaufrufe nicht für personalisierte Vorschläge oder Werbung zu verwenden.
  • Der Absatz mit der Autorenzeile – der sichtbare Inhalt, bevor widgets.js läuft – Tweet-Text, Autor, und ein Link zum Beitrag. Das ist die dauerhafte Erfahrung für Besucher ohne JavaScript oder mit blockiertem Skript und degradiert zu einem normalen Zitat.
  • Das Script-Tagwidgets.js von platform.x.com, asynchron geladen. Eines pro Seite genügt für beliebig viele Einbettungen – genau dafür gibt es die Option „Script weglassen“.

Beitrag vs. Clip-Einbettungen

Zwei Tabs, ein Tweet, zwei verschiedene Aufgaben. Beim Tabwechsel wird sofort neu generiert – es gibt keinen veralteten Zustand.

Beitrag-Tab Clip-Tab
Am besten für Text-Tweets, Fotos, Linkvorschauen Tweets, deren Punkt das Video ist
Breitenspanne 220–550 px (Standard 550) 560–1920 px (Standard 560)
Breitenattribut data-width vom Server data-media-max-width, umgeschrieben vom Tool
Design (hell/dunkel) Verfügbar Ausgeblendet – der Player hat keine helle Variante
Unterhaltung ausblenden Verfügbar Ausgeblendet – der Elternkontext einer Antwort ist Text, nicht das Video
Medien ausblenden Verfügbar Ausgeblendet – die Medien sind der Punkt
Sprache, Ausrichtung, Do Not Track, Script weglassen Verfügbar Verfügbar

Warum schreibt das Tool data-media-max-width selbst? Weil der oEmbed-Endpunkt von X es nicht kann. Tests bestätigen, dass der Endpunkt jeden Parameter maxwidth – auch bei Video-Tweets – in den Beitrag-Bereich 220–550 klemmt und das Attribut data-media-max-width, das Clip-Einbettungen tragen, nie ausgibt. Dieses Attribut gehört zum Ablauf innerhalb von publish.x.com, wo der Embedded-Video-Generator das Markup nachträglich dekoriert. Der Generator reproduziert genau diese Dekoration – er entfernt die geklemmte data-width des Servers und schreibt Ihre gewählte Breite in data-media-max-width, sodass eine 1200-Pixel-Clip-Einbettung auf Ihrer Seite wirklich 1200 Pixel breit ist.

Praktisch lautet die Entscheidungsregel einfach. Liest sich der Tweet gut als Karte – Beitrag. Bleibt nach Entfernen des Players nichts übrig – Clip, und geben Sie dem Player den Platz, den er braucht.

Optionen für die Einbettung

Jede Steuerung bildet auf ein Attribut oder einen Anfrageparameter ab. Standards in Klammern.

Sprache (Standard: Seitensprache) – bietet Automatisch plus die 34 Sprachen, die X für Widget-Texte mitliefert. Jede konkrete Auswahl, Englisch eingeschlossen, wird als Parameter lang gesendet und in data-lang geschrieben – so bleibt das Widget-Chroma überall gleich, wo immer Sie den Code einfügen. Sie lokalisiert Zeitstempel und Aktionsbeschriftungen um den Tweet herum, nie die Worte des Tweets. Automatisch lässt sowohl Parameter als auch Attribut weg – widgets.js rendert dann in der Sprache, die die Gastseite deklariert; das passt zu mehrsprachigen Seiten, macht die Ausgabe aber abhängig vom Einfügeort.

Design (Hell, nur Beitrag-Tab) – Dunkel sendet theme=dark und schreibt data-theme="dark". Hell ist die Abwesenheit des Attributs.

Breite (550 Beitrag, 560 Clip) – als exakte Zahl eingegeben, beim Verlassen des Feldes auf den gültigen Bereich geklemmt. Beiträge senden maxwidth; Clips steuern die clientseitige Umschreibung von data-media-max-width. Werte außerhalb der Spanne eines Tabs überleben das Feld nicht – 9999 im Beitrag-Tab werden zu 550, 100 im Clip-Tab zu 560.

Ausrichtung (Keine) – Links, Rechts oder Mitte schreibt align in die Anfrage und data-align in den blockquote. Mitte ist die stille Art, eine einzelne Karte in einem breiten Artikel zu platzieren; Rechts lässt den Artikeltext um sie herumfließen.

Unterhaltung ausblenden (aus, nur Beitrag-Tab) – sendet hide_thread=true, was der Server in data-conversation="none" übersetzt. Nur bei Antworten sinnvoll; bei einem eigenständigen Tweet ändert es nichts.

Medien ausblenden (aus, nur Beitrag-Tab) – sendet hide_media=true, übersetzt in data-cards="hidden". Die Einbettung wird zum reinen Zitat.

Das widgets.js-Script-Tag weglassen (aus) – sendet omit_script=true und unterdrückt das Script-Tag in der Ausgabe. Für Seiten, die widgets.js bereits einmal global laden – mehrere Einbettungen, ein Skript. Hat Ihre Seite kein widgets.js, lassen Sie diese Option aus; der blockquote allein rendert für immer als statischer Text.

Personalisierung durch X deaktivieren (aus) – sendet dnt=true und schreibt data-dnt="true". X dokumentiert dies so, dass die Einbettung und ihre Seite nicht für personalisierte Vorschläge und personalisierte Werbung verwendet werden.

Verwendung

  1. Tweet-URL einfügen in das Eingabefeld – jedes akzeptierte Format aus der Tabelle oben.
  2. Generieren drücken (oder Enter). Der Code erscheint im Ausgabefeld, und die Vorschau öffnet sich automatisch mit dem echten X-Rendering.
  3. Tab wählen – Beitrag für die Standardkarte, Clip für videozentrierte Tweets. Der Wechsel regeneriert mit den Optionen und der Breitenspanne dieses Tabs.
  4. Optionen anpassen – Sprache, Design, Breite, Ausrichtung, die Sichtbarkeits-Checkboxen. Jede Änderung ruft neu ab und rendert neu; das Codefeld weicht nie von der Vorschau ab.
  5. Diagnosen prüfen – erscheint keine Karte, sagt Ihnen die Warnung über der Ausgabe, ob das Skript von X blockiert war oder der Tweet nicht eingebettet werden kann.
  6. Code kopieren und in das HTML Ihrer Seite einfügen, wo der Tweet erscheinen soll.

Eine Eingabe, die kein unterstütztes Format trifft, leert die Ausgabe und erklärt sich – entweder mit der Meldung zum ungültigen Link oder, bei routen ohne Benutzernamen, mit dem Hinweis auf den vollständigen Link. Löschen setzt Eingabe, Code und Vorschau in einem Schritt zurück.

Schritt-für-Schritt-Anleitung

Begleiten Sie einen realen Link durch beide Tabs.

Schritt 1 – App-Share-Link einfügen. Kopieren Sie eine Tweet-URL, wie die mobile App sie teilt, inklusive Tracking-Parametern:

https://twitter.com/new27brigade/status/2090248985391014324?s=20&t=FakeNonce

Drücken Sie Generieren. Der Parser liest an der Legacy-Domain und den Parametern s und t vorbei direkt zum Tweet – new27brigade, Status 2090248985391014324 – und der generierte Code zeigt auf die kanonische Form. Die Vorschau öffnet sich, und die Karte rendert.

Schritt 2 – Abdunkeln. Stellen Sie das Design auf Dunkel. Der Code erhält data-theme="dark", und die Vorschau rendert in der dunklen Palette. Beachten Sie den erneuten Abruf – das Design wird serverseitig eingebacken, weshalb jede Optionsänderung den Endpunkt erneut kontaktiert, statt den String lokal zu editieren.

Schritt 3 – Verschmälern. Tippen Sie 350 in die Breite und drücken Sie Enter. Das Attribut wird zu data-width="350", und die Karte schrumpft. Tippen Sie testweise 9999 und klicken Sie woanders hin – das Feld springt auf 550 zurück, weil X dort ohnehin klemmen würde.

Schritt 4 – Die Oberfläche lokalisieren. Stellen Sie die Sprache auf Japanisch (日本語). Der Code erhält data-lang="ja", und der Zeitstempel in der Vorschau formatiert sich nach japanischer Konvention. Der Tweet-Text bleibt exakt wie geschrieben – die Einstellung betrifft nur Xs eigene Beschriftungen.

Schritt 5 – Zum Clip wechseln. Klicken Sie auf den Clip-Tab. Das Tool ruft mit dem Clip-Parametersatz neu ab und schreibt das Markup um – data-width verschwindet, data-media-max-width="560" erscheint, und der Design-Wähler verschwindet aus dem Bedienfeld. Ziehen Sie die Breite auf 1200 – der Player dehnt sich aus. Dieser Tweet ist eine Militärübungsaufnahme, also passt der Clip-Modus; für eine Textankündigung würden Sie zurückwechseln.

Schritt 6 – Kopieren und ausliefern. Kopieren und fügen Sie in eine einfache HTML-Seite ein. Öffnen Sie sie – der Player rendert in voller Breite. Das ist der vollständige Vertrag – derselbe Code, dasselbe Rendering, auf Ihrer Seite.

Vorschau und Diagnose

Die Vorschau führt Xs echtes widgets.js gegen Ihren exakten blockquote aus, also scheitert sie exakt dort, wo Ihre Seite scheitern würde. Zwei Warnungen, zwei verschiedene Bedeutungen:

Warnung Bedeutung Was zu tun ist
„X widgets.js konnte nicht geladen werden – häufig ein Werbeblocker“ Der Browser konnte platform.x.com/widgets.js überhaupt nicht herunterladen Erlauben Sie die Domain im Blocker oder probieren Sie ein sauberes privates Fenster. Die veröffentlichte Einbettung scheitert bei Besuchern mit diesem Blocker genauso
„Die offizielle Einbettung wurde nicht gerendert“ Das Skript lief, erzeugte aber keine Karte Der Tweet könnte gelöscht sein, das Konto geschützt, die URL falsch oder der Autor hat das Einbetten für den Beitrag deaktiviert. Prüfen Sie den Beitrag auf x.com – spielt er dort, aber nicht hier, ist das Einbetten auf Autorenseite aus

Beide Warnungen feuern erst nach großzügigen Wartezeiten – zwanzig Sekunden für den Skriptdownload, fünfzehn weitere für das Rendern –, damit langsame Verbindungen keine Fehlalarme auslösen. Eine einbettbare Karte erscheint deutlich innerhalb dieser Fenster.

Ein mechanisches Detail am Rande – die erste Generierung lädt widgets.js und behält es für die Sitzung. Neugenerierungen – neue Optionen, Tabwechsel – nutzen es wieder und stoßen es direkt auf den neuen blockquote, sodass spätere Vorschauen schneller erscheinen als die erste.

Profi-Tipps

  • Mit dem URL-Parser paaren. Der Parser analysiert und bereinigt einen Link – Typ, Snowflake-ID, Tracking-Schlüssel; der Generator macht aus dem sauberen Link Code. Archivieren mit dem Parser, veröffentlichen mit dem Generator.
  • Ein Script-Tag, viele Einbettungen. Seiten mit mehreren Tweets sollten widgets.js einmal laden – setzen Sie „Script weglassen“ bei jeder Generator-Ausgabe außer der ersten, oder laden Sie es selbst im Seitentemplate und lassen Sie es überall weg.
  • Medien ausblenden macht den Tweet zum Zitat. Für redaktionelle Merksätze, wo eine Linkvorschau ablenkt, lassen nur „Medien ausblenden“ plus „Unterhaltung ausblenden“ die Worte und die Autorenzeile übrig.
  • Einzelreferenzen zentrieren. Ausrichtung Mitte liest sich in einem breiten Layout als bewusstes Design; Linksbündigkeit ist der Default jedes CMS und selten, was eine Marketingseite will.
  • Widget-Sprache an die Seitensprache anpassen. Eine japanische Seite mit englischen RETWEET-Schaltflächen wirkt unfertig – konkrete Sprachen fixieren die Chromatik, für die Sie verantwortlich sind; laufen dieselben Einbettungen auf mehrsprachigen Vorlagen über mehrere Sprachräume, wählen Sie stattdessen Automatisch und lassen Sie widgets.js der jeweiligen Gastseite folgen.
  • Do Not Track für EU-seitige Seiten setzen. Das Flag ist von X dokumentiert und pflanzt sich durch die Einbettung fort – ein Ein-Klick-Signal, dass die Karte die Privatsphäre der Besucher respektiert.
  • Für die Spalte entwerfen, dann die Breite setzen. Beiträge enden physisch bei 550 Pixeln; die Vorschau zeigt das wahre Ergebnis in Ihrer Containergröße, bevor Sie es festlegen.

Alternativen

Wie sonst bekommen Sie einen Tweet auf eine Seite?

Methode Offizielles Markup Optionsabdeckung Live-Vorschau Abhängigkeiten
Dieses Tool Ja – servergeneriert Vollständiger Satz, beide Modi Ja Keine
Teilen-Menü auf x.com → Beitrag einbetten (publish.x.com) Ja Teilweise – kein Medienausblenden, keine Ausrichtung, kein Script-Weglassen, keine numerische Clip-Breite Nur im Dialog Keine
Handgeschriebener blockquote + widgets.js Korrekt geformt, wenn Sie sorgfältig sind Alles, was Sie tippen – leicht vertippt Nein widgets.js
X API v2 + eigener Renderer Nein – nur JSON Total, von Ihnen gebaut Selbst bauen Bezahler-API-Zugang
Drittanbieter-Einbettungsdienste Ihr eigenes Wrapper-Markup Variabel Manchmal Ihr Skript und Tracking

Xs eigener Share-Dialog ist die nächste Alternative und die Quelle desselben blockquote – aber seine Anpassung stoppt bei Sprache, Verbergen der Unterhaltung, Opt-out der Personalisierung und einer groben Clip-Größe und bietet keinen Weg zu „Medien ausblenden“, align oder einem präzisen maxwidth. Die API-Route kauft Totalkontrolle zu Pay-per-use-Preisen und lässt das Rendering trotzdem bei Ihnen. Drittanbieterdienste schalten ihre eigenen Skripte dazwischen. Der Generator besetzt die praktische Mitte – offizielles Markup, vollständige Optionen, sofortige visuelle Bestätigung.

Im Vergleich zu den offiziellen APIs

Drei offizielle Oberflächen berühren das Einbetten von Tweets, und der Generator ist direkt auf der freundlichsten gebaut.

Fähigkeit Öffentlicher oEmbed-Endpunkt Dialog auf publish.x.com X API v2
Zweck URL → Embed-HTML, programmatisch URL → Embed-HTML, von Hand Volle Plattformdaten und Posten
Authentifizierung Keine Keine Schlüssel + Pay-per-use-Abrechnung
Kosten Kostenlos Kostenlos Etwa $0,005 pro gelesenem Beitrag seit Februar 2026 – keine Gratisstufe
Rate-Limits Keine dokumentiert Nur praktische Grenzen Abgerechnete Credits
Liefert fertigen Code zum Einfügen Ja – blockquote + Skript Ja Nein – JSON, das Sie selbst rendern
Parameterabdeckung maxwidth, theme, lang, hide_thread, hide_media, align, dnt, omit_script Teilmenge – siehe Alternativen Irrelevant – Sie bauen die Ansicht

Der Generator ruft den oEmbed-Endpunkt exakt dokumentationskonform auf – dieselbe Anfrage, die ein CMS-Plugin stellen würde, gestellt von Ihrem Browser. Er ergänzt, was dem Endpunkt fehlt – Eingabenormalisierung, die data-media-max-width-Dekoration für den Clip-Modus, Script-Tag-Verwaltung und Diagnosen. Die X API v2 ist bewusst nicht beteiligt – seit ihrer Preisänderung im Februar 2026 die Gratisstufe gestrichen hat, kostet das Lesen von Tweets über sie Geld für Fähigkeiten, die der freie Endpunkt für Einbettungszwecke bereits abdeckt.

Der Generator im Vergleich zum URL-Parser

Toollect liefert zwei X-Werkzeuge, die dieselben Links akzeptieren, und die Arbeitsteilung lohnt einen Blick:

Frage URL-Parser Dieser Generator
Welche Linkarten? Alle sieben Arten – Tweets, Profile, Listen, Spaces, Events, Hashtags, Suchen Nur Tweets
Was gibt er aus? Saubere kanonische URLs, Widget-iframe-URLs, Share-Intents Fertiger Einbettungscode zum Einfügen
Bereinigt Tracking-Parameter? Ja – und listet jeden entfernten Schlüssel Unnötig – die Ausgabe ist frisch generierter Code
Löst /i/web/status/… auf? Ja – mappt auf die kanonische Benutzername-Form Nein – bittet um den vollständigen Link
Netzwerkanfragen? Null – alles lokales Parsen Ein oEmbed-GET pro Generierung, dazu Xs Skripte für die Vorschau
Zeigt Tweet-Metadaten? Nur Struktur – kein Tweet-Inhalt Die Vorschau zeigt den echt gerenderten Tweet

Der Parser ist der Analyst; der Generator ist der Baumeister. Ein Veröffentlichungsworkflow nutzt beide legitim nacheinander – parsen, um zu identifizieren und zu normalisieren, worauf ein chaotischer Link zeigt, dann generieren, um ihn auf die Seite zu bringen. Sie stimmen in der Grammatik per Konstruktion überein – ein Link, den der Parser als Tweet annimmt, ist ein Link, den der Generator einbettet.

Was das Tool nicht kann

Die Grenzen, benannt, damit dem Tool nie übertrieben vertraut wird:

  • Es bettet keine Timelines, Profile, Listen, Spaces oder Hashtags ein. Das sind andere X-Oberflächen mit anderem Markup; die Profilunterstützung des oEmbed-Endpunkts erzeugt Timeline-Anker, keine Tweet-Karten, und der Generator lehnt sie ab. Ein eigenes Werkzeug wäre das ehrliche Vehikel, falls Nachfrage besteht.
  • Es löst keine Links ohne Benutzernamen auf. /i/web/status/… kommt ohne den Benutzernamen an, den die kanonische Form braucht, und das Tool rät nicht. Öffnen Sie den Link, kopieren Sie die volle URL.
  • Es löst keine t.co-Kurzlinks auf. Ein bloßer Kurzlink trägt keine Tweet-Identität; fügen Sie das Ziel ein.
  • Es überwindet weder Privatsphäre noch Löschung. Geschützte Konten, gelöschte Beiträge und Autoren, die das Einbetten deaktiviert haben, produzieren korrekten Code, der nichts rendert. Kein Werkzeug kann das ändern.
  • Es verifiziert Tweets nicht vor der Anfrage. Die Validierung ist grammatikalisch. Ob der Tweet existiert, beantwortet erst die Antwort des Endpunkts – ein nicht verfügbarer Tweet taucht als fehlgeschlagene Anfrage auf.
  • Es styelt das Widget nicht. Farben, Schriftarten und Chromatik innerhalb der gerenderten Karte sind Xs Sache. Nur Platzierung (Ausrichtung, Breite) und Präsenz (Unterhaltung, Medien) sind Ihre.
  • Es installiert den Code nicht. Was Sie kopieren, fügen Sie ein; das Tool kann nicht in Ihr CMS oder Ihren Page Builder greifen.

Fehlerbehebung

Problem Ursache Lösung
„Kein Tweet in dieser URL gefunden“ Profil-, Intent-, Such- oder Fremdlink – oder eine fehlerhafte ID Nutzen Sie die vollständige Form benutzer/status/id; prüfen Sie, ob die ID 15–19 Ziffern hat
„Verwenden Sie den vollständigen Tweet-Link“ beim Einfügen von /i/web/status/… Benutzernamenlose Webclient-Route Öffnen Sie den Link im Browser und kopieren Sie die vollständige Adresse mit Benutzername
„X konnte nicht erreicht werden“ beim Generieren Offline, blockiert oder der Endpunkt antwortete mit einem Fehler – auch bei Tweets, die nicht mehr existieren Verbindung prüfen; publish.x.com in Blockern erlauben; den Tweet auf x.com öffnen, um seine Existenz zu bestätigen
„X widgets.js konnte nicht geladen werden“ Werbeblocker oder Datenschutzerweiterung blockiert platform.x.com Domain für diese Seite erlauben – und testen Sie zum Wohl Ihrer Besucher erneut
„Die offizielle Einbettung wurde nicht gerendert“ bei scheinbar validem Link Gelöschter Beitrag, geschütztes Konto oder vom Autor deaktiviertes Einbetten Auf x.com verifizieren; die Einbettungserlaubnis ist die Einstellung des Autors, nicht Ihre
Der Clip-Tab lehnt eine 400-Pixel-Breite ab Clip-Breiten beginnen designbedingt bei 560 Nutzen Sie den Beitrag-Tab für 220–550; die zwei Spannen dienen unterschiedlichen Layouts
Meine eingegebene Breite sprang auf 550 oder 560 Außerhalb liegende Werte werden beim Verlassen des Feldes geklemmt Absichtlich – X klemmt sie serverseitig ohnehin; tippen Sie innerhalb der Spanne
Funktioniert in der Vorschau, tot auf meiner Seite Die CSP der Seite blockiert Xs Domains, oder das CMS hat das Script-Tag entfernt https://platform.x.com (und https://platform.twitter.com für Legacy-Snippets) zu script-src und frame-src hinzufügen; in rohes HTML einfügen
Sprache geändert, aber der Tweet-Text blieb Englisch Absichtlich – data-lang lokalisiert die Widget-Chromatik, nie den Tweet-Inhalt Erwartetes Verhalten; der Tweet wird so angezeigt, wie er verfasst wurde

Datenschutz und Datenverarbeitung

Dieses Werkzeug ist ehrlich bezüglich seines Datenverkehrs, der größer ist als der seiner null-Anfragen-Geschwister, aber weiterhin direkt-zu-X bleibt.

  • Die Generierung sendet die Tweet-URL einmal pro Aktion an X. Generieren drücken oder eine Option ändern löst genau ein HTTPS-GET an publish.x.com/oembed mit der kanonischen Tweet-URL und Ihren Optionen aus. Die Anfrage geht von Ihrem Browser zu Xs Infrastruktur – kein Toollect-Server proxyt, loggt oder sieht sie.
  • Die Vorschau lädt Xs eigene Maschinerie. Das Rendern der Karte ruft widgets.js von platform.x.com ab, das gerenderte iframe aus Xs Syndikationsinfrastruktur und Medien von Xs Image-Hosts – exakt der Verkehr, den der kopierte Code auf den Browsern Ihrer Leser erzeugen wird.
  • Do Not Track pflanzt sich fort. Mit aktivierter Option trägt der generierte Code data-dnt="true" – das von X dokumentierte Signal, die Einbettung und ihre Seitenaufrufe von personalisierten Vorschlägen und Werbung auszuschließen.
  • Kein Konto, keine Speicherung, kein Tracking. Das Werkzeug behält keinen Zustand zwischen Besuchen; das Schließen des Tabs beendet alles.
  • Das Veröffentlichen des Codes bedeutet, dass Ihre Besucher mit X sprechen. Das ist die Natur des Einbettens – offen gesagt wert. Wenn Sie einen strikt offline arbeitenden X-Workflow brauchen, erledigt der X (Twitter)-URL-Parser auf dieser Seite seine gesamte Aufgabe mit null Netzwerkanfragen.

Technische Daten

Details:

  • Endpunkt – GET https://publish.x.com/oembed?url={canonical}, schlüsselfrei, JSON-Antwort, keine dokumentierten Rate-Limits; Parameter maxwidth, theme, lang, hide_thread, hide_media, align, dnt, omit_script
  • Eingabegrammatik – Hosts x.com / twitter.com mit optionalen Präfixen www. / mobile. / m.; Benutzername [A-Za-z0-9_]{1,15}; Tweet-ID 15–19 Ziffern; Schema, abschließender Schrägstrich, Ansichtsvarianten (/photo/1, /video/1, …) und Query-Strings werden toleriert und verworfen
  • Kanonische Ausgabe-URL – https://x.com/{username}/status/{id}
  • Beitragsbreitenvertrag – 220–550 px einschließlich (der Endpunkt klemmt äußere Werte; historischer Default 325, Tool-Default 550); Clip-Breite 560–1920 px, clientseitig auf data-media-max-width angewandt, weil der Endpunkt sie nicht ausgeben kann
  • Sprachen – Automatisch oder 34 X-Widget-Locales wählbar; jede konkrete Auswahl schreibt data-lang, en eingeschlossen – nur Automatisch lässt es weg
  • Skriptverwaltung – serverseitige Script-Tags werden entfernt; https://platform.x.com/widgets.js einmal pro Sitzung mit einem Timeout von 20 Sekunden geladen; der Render-Watcher fragt das iframe alle 500 ms bis zu 15 Sekunden ab und meldet dann
  • Wiederanfrage-Richtlinie – jede Options- oder Tabänderung stellt eine neue oEmbed-Anfrage; identische laufende Anfragen werden durch einen Busy-Guard zusammengefasst
  • Selfhosting der Ausgabe erfordert – script-src und frame-src mit erlaubtem https://platform.x.com (plus https://platform.twitter.com für Legacy-Snippets) und img-src mit https://abs.twimg.com und https://pbs.twimg.com
  • Browserunterstützung – alle modernen Browser (Clipboard-API; ES5-Laufzeit, die widgets.js selbst voraussetzt)

Funktionen

  • Offiziellen X (Twitter)-Einbettungscode aus jeder Tweet-URL mit einem Klick generieren – Beitrag- und Clip-Modus in einem einzigen Werkzeug
  • Die eigenen Publisher-Optionen von X nachbilden – helles/dunkles Design, Automatisch plus 34 Oberflächensprachen, exakte Breite, Ausrichtung, Unterhaltung ausblenden, Medien ausblenden
  • Eine Live-Vorschau ansehen, die von Xs offiziellem widgets.js gerendert wird, bevor Sie den Code einfügen
  • Die Breite präzise steuern – 220–550 px für Beiträge, 560–1920 px für Clips über data-media-max-width
  • Ihre Besucher respektieren – eingebauter Do-Not-Track-Schalter und eine Option zum Weglassen doppelter widgets.js-Tags
  • Kostenloser Browser-Generator mit klaren Diagnosen, wenn das Skript von X blockiert ist – kein API-Schlüssel, keine Anmeldung

Häufig gestellte Fragen

Was ist ein X (Twitter)-Einbettungscode?
Es ist der HTML-Schnipsel, den X für die Anzeige eines Beitrags auf einer anderen Website veröffentlicht. Der Code besteht aus einem blockquote mit der Klasse twitter-tweet plus einem kleinen script-Tag, das Xs widgets.js lädt. Öffnet ein Besucher Ihre Seite, findet widgets.js den blockquote, ruft den Beitrag von X ab und ersetzt ihn durch die vollständig gerenderte Karte mit Autor, Medien und Aktionsschaltflächen innerhalb eines iframes.
Was ist der Unterschied zwischen Beitrag- und Clip-Einbettungen?
Beide Modi betten denselben Tweet ein, optimieren ihn aber für unterschiedliche Inhalte. Eine Beitrag-Einbettung rendert die gewohnte Karte mit Text, Autor und Medien, unterstützt das helle/dunkle Design und akzeptiert eine Breite zwischen 220 und 550 Pixeln, die in ein data-width-Attribut geschrieben wird. Eine Clip-Einbettung betont den Player, blendet Design- und Unterhaltungssteuerungen aus, weil sie hier nicht zutreffen, und trägt ihre Breite bis zu 1920 Pixel in einem data-media-max-width-Attribut, damit große Videos über die Standardkarte hinauswachsen können. Beim Wechseln der Tabs wird der Code automatisch neu generiert.
Warum wird meine Einbettung in der Vorschau nicht gerendert?
Das Tool zeigt eine von zwei Warnungen an. „X widgets.js konnte nicht geladen werden“ bedeutet, dass der Browser das Skript von X überhaupt nicht herunterladen konnte – meistens blockiert durch einen Werbeblocker oder eine Datenschutzerweiterung. „Die offizielle Einbettung wurde nicht gerendert“ bedeutet, dass widgets.js lief, aber keine Karte erzeugte – der Tweet könnte gelöscht oder von einem geschützten Konto gepostet sein, die URL falsch sein oder der Autor hat das Einbetten für diesen Beitrag deaktiviert. Die Vorschau führt genau das Skript aus, das auch Ihre Seite ausführt, und fängt solche Probleme am schnellsten vor der Veröffentlichung.
Warum ist meine Beitragsbreite auf 550 Pixel begrenzt?
Dieses Limit kommt von X selbst. Der offizielle oEmbed-Endpunkt akzeptiert für Beitrag-Einbettungen nur eine maximale Breite zwischen 220 und 550 Pixeln und schneidet Werte außerhalb dieses Bereichs stillschweigend zu – ein größerer Wert würde also ohnehin eine 550-Pixel-Karte erzeugen. Clips sind anders – ihr Player kann deutlich breiter werden, und der Generator schreibt diesen breiteren Wert direkt in das Attribut data-media-max-width, bis zu 1920 Pixel.
Braucht das Tool einen API-Schlüssel oder lädt es meine Daten hoch?
Kein API-Schlüssel und kein Konto. Wenn Sie auf Generieren klicken, sendet Ihr Browser genau eine HTTPS-Anfrage direkt an den öffentlichen oEmbed-Endpunkt von X unter publish.x.com – die Tweet-URL wandert von Ihrem Browser zu X, nie über einen Toollect-Server. Die Vorschau lädt dann Xs eigenes widgets.js und den Embed-iframe, genau wie es der kopierte Code auf Ihrer Seite tun wird. Nichts wird gespeichert, und beim Schließen des Tabs bleibt nichts zurück.
Worin unterscheidet sich dieses Tool vom X (Twitter)-URL-Parser?
Der Parser nimmt einen Link auseinander – Typ, Benutzername, Snowflake-ID, Ansichtsvariante –, bereinigt seine Tracking-Parameter und baut saubere URLs wieder auf. Dieser Generator arbeitet umgekehrt – er macht aus einem erkannten Tweet-Link fertigen Einbettungscode. Führen Sie denselben Tweet durch beide Werkzeuge, und jedes liefert eine andere Antwort für eine andere Aufgabe – Analyse versus Ausgabe.
ESC