Twitter Card-förhandsgranskning
Förhandsgranska och generera Twitter Card-metataggar för dina sidor
Kortinställningar
0/70 tecken
0/200 tecken
Räknarna för 70/200 är riktmärken i redigeraren. Vissa symboler räknas som mer än ett tecken, och den faktiska visningen beror på klienten.
Prova en bred bild, till exempel 1200 × 628 px. Den illustrativa förhandsgranskningen använder en bildyta i 16:9.
Bild-URL:en läses in direkt från din webbläsare. Värden för bilden tar emot den begäran.
Används bara för domänen som visas här. Ditt @handle anger vilket konto som står som avsändare.
Kortförhandsgranskning
example.com
Din korttitel här
Din kortbeskrivning visas här. Skriv något som fångar din publiks intresse.
Lägg till en bild-URL för att förhandsgranska den.
Den här förhandsgranskningen är illustrativ. Den faktiska layouten, beskärningen, cachelagrat innehåll och hämtade bilder på X/Twitter kan avvika.
Dina metataggar
<meta name="twitter:card" content="summary_large_image" />
Taggarna är uppdaterade. Lägg till dem i sidans head och kontrollera den publicerade sidan.
Guide till korttyper
Innan du publicerar
- Använd en titel och beskrivning som beskriver sidan.
- Välj en bild vars viktiga innehåll klarar beskärning.
- Se till att bild-URL:en är tillgänglig för plattformen som hämtar din sida.
- @handle anger avsändare och är ingen webbadress.
- Kontrollera den publicerade sidan och dess faktiska delningsförhandsgranskning. Den här redigeraren hämtar inte X:s kortdata.
Om vårt kostnadsfria verktyg för förhandsgranskning av Twitter/X-kort
Twitter Cards (numera X Cards) gör att du kan bifoga rikt innehåll till tweets som länkar till din webbplats. När någon delar en URL från din webbplats visar kortet automatiskt en förhandsvisning med den titel, beskrivning och bild du angett. Det här verktyget för förhandsgranskning av Twitter Card låter dig granska ett illustrativt kort innan du publicerar dina taggar. Det verifierar inte plattformens hämtning, cache eller slutliga rendering.
Verktyget stöder båda de stora korttyperna: Summary Card med en liten miniatyrbild bredvid texten och Summary Card with Large Image som placerar en framträdande bild ovanför titeln och beskrivningen. Du kan ange ditt innehåll, förhandsgranska det i realtid och kopiera de färdiga HTML-metataggarna med ett enda klick.
Oavsett om du är social medie-ansvarig som optimerar länkförhandsvisningar, utvecklare som implementerar Open Graph- och Twitter-metataggar eller innehållsmarknadsförare som vill maximera klickfrekvensen på delade länkar förenklar det här kostnadsfria verktyget ditt arbete. Teckenräknare och färgkodade staplar visar redigerarens riktvärden på 70/200. De fastställer inte någon garanterad aktuell visningsgräns hos plattformen.
Viktiga funktioner
- Liveförhandsvisning av både korttypen Summary och Summary Large Image
- Teckenräknare i realtid och färgkodade staplar utifrån redigerarens riktvärden för titel (70) och beskrivning (200)
- Fält för bild-URL med rekommenderade storlekar för varje korttyp
- Fält för webbplatsens @-namn för korrekt Twitter-attribuering
- Automatiskt skapade HTML-metataggar som är klara att klistra in i sidans <head>-avsnitt
- Kopiera alla skapade metataggar till urklipp med ett klick
- Jämförelseguide för korttyper som visar när varje format passar
- Förhandsvisning modellerad efter kortlayouten på Twitter/X (en approximation, inte en pixelexakt rendering)
- Fullt stöd för mörkt läge med responsiv layout
- Ingen registrering krävs, helt gratis och obegränsat
Så använder du verktyget för förhandsgranskning av Twitter Card
- Välj korttyp: Välj mellan Summary (liten bild) och Summary Large Image beroende på ditt innehåll och dina visuella mål.
- Ange din titel: Skriv en lockande titel på högst 70 tecken som fångar uppmärksamheten i Twitter-flödet.
- Lägg till en beskrivning: Skriv en kortfattad beskrivning på högst 200 tecken som får användare att klicka vidare.
- Ange en bild-URL: Klistra in den fullständiga URL:en till din kortbild (1200x628 rekommenderas för kort med stor bild, 144x144 för Summary).
- Granska liveförhandsvisningen: Titta i förhandsvisningspanelen för att se en approximation av hur kortet kommer att se ut på Twitter/X.
- Kopiera metataggar: Klicka på ”Kopiera alla taggar” för att kopiera de skapade HTML-metataggarna och klistra sedan in dem i <head>-avsnittet på din sida.
Användningsområden
- Social medie-ansvariga: Förhandsgranska och optimera länkkort innan du delar innehåll, för att maximera engagemang och klickfrekvens.
- Webbutvecklare: Skapa korrekta metataggar för Twitter Card under webbplatsutvecklingen och verifiera renderingen före lansering.
- Innehållsmarknadsförare: Testa olika titlar, beskrivningar och bilder för att hitta den mest engagerande kombinationen för delade länkar.
- SEO-proffs: Säkerställ att sociala metataggar är korrekt implementerade som en del av tekniska SEO-granskningar.
- E-handelsteam: Förhandsgranska hur produktsidor ser ut när de delas på Twitter/X för att optimera för konvertering.
- Bloggförfattare: Kontrollera att förhandsvisningarna av artiklar visar rätt huvudbild, titel och utdrag före publicering.
- PR och kommunikation: Verifiera länkförhandsvisningar för pressmeddelanden och tillkännagivanden innan de skickas till media.
Vanliga frågor
Är verktyget gratis?
Ja, verktyget för förhandsgranskning av Twitter Card är helt gratis, utan registrering eller användningsgränser.
Är mina data säkra?
Förhandsvisningen och skapandet av taggar sker i din webbläsare. Dina titlar och beskrivningar skickas inte till våra servrar. När en bild-URL läses in görs en förfrågan från din webbläsare till bildens värd.
Vilka bildstorlekar rekommenderas?
Använd en kvadratisk bild för ett litet kort och en bred bild för ett stort kort. Redigeraren erbjuder exempelstorlekar på 144×144 och 1200×628 pixlar, men de validerar inte plattformens aktuella krav på filformat, storlek eller hämtning. Granska bilden i den publicerade delningsförhandsvisningen.
Behöver jag både Twitter Cards och Open Graph-taggar?
Open Graph och Twitter-specifik metadata beskriver förhandsvisningar i sociala medier. Implementera de taggar som krävs för de plattformar du riktar dig till och kontrollera det publicerade resultatet. Den här redigeraren bekräftar inte reservbeteende och garanterar inte full kontroll över visningen.
Varför uppdateras inte mitt kort när jag ändrar metataggarna?
En plattform kan behålla tidigare hämtad metadata eller bilder. Bekräfta att den publicerade sidan och bild-URL:erna innehåller dina ändringar och kontrollera sedan den faktiska delningsförhandsvisningen. Den här redigeraren granskar eller rensar inte X:s cache och kan inte utlova något uppdateringsintervall eller någon lösning med frågesträng.
Stämmer förhandsvisningen exakt med hur det faktiskt ser ut på Twitter?
Det här är en illustrativ förhandsvisning. Klientens layout, beskärning, cachelagrade data och bildhämtning kan ge ett väsentligt annorlunda resultat. Kontrollera den publicerade sidans faktiska delningsförhandsvisning.
Tips och bästa praxis
- Håll titlarna under 70 tecken: Längre titlar trunkeras i kortförhandsvisningen och ditt huvudbudskap går förlorat.
- Skriv handlingsinriktade beskrivningar: Använd ett engagerande språk som uppmuntrar till klick och håll dig under 200 tecken.
- Använd bilder av hög kvalitet: Suddiga bilder eller bilder med låg upplösning minskar förtroendet och engagemanget. Använd alltid de rekommenderade måtten.
- Ange webbplatsens @-namn: Det ger korrekt attribuering och kan öka ditt kontos synlighet när länkar delas.
- Testa före publicering: Förhandsgranska ditt kort i det här verktyget och klistra sedan in URL:en i X:s inläggsfönster för att bekräfta det riktiga kortet innan du publicerar.
- Implementera både OG- och Twitter-taggar: Använd Open Graph-taggar som grund och Twitter Card-taggar för plattformsspecifik anpassning.