Open Graph-metatagggenerator

Taggene en lenkeforhåndsvisning bygges av

Når noen limer lenken din inn i et innlegg eller en melding, sender appen en crawler til siden og leser en håndfull <meta>-tagger i <head>. Disse taggene kommer fra Open Graph-protokollen, som angir fire som påkrevde:

• og:title: tittelen slik den skal vises i forhåndsvisningen.
• og:type: hva siden er. website passer de fleste sider og article passer et blogginnlegg. Protokollen definerer også typer som profile, book, video.movie og music.song.
• og:image: URL-en til bildet som representerer siden.
• og:url: den kanoniske URL-en, som protokollen kaller objektets permanente ID.

Protokollen definerer også valgfrie tagger, og generatoren skriver de nyttige: og:description, og:site_name, og bildedetaljene og:image:width, og:image:height og og:image:alt. Om alt-tekst er protokollen tydelig: hvis en side angir og:image, bør den angi og:image:alt, og den teksten beskriver hva som er i bildet, ikke en bildetekst.

Det X legger til: twitter:card

X leser Open Graph også. referansen for cards-markup (X-ens utviklerdokumentasjon, lenket her via Internet Archive fordi den opprinnelige siden nå videresender) angir reserveløsningen for hver tagg: twitter:title faller tilbake til og:title, twitter:description til og:description, twitter:image til og:image og twitter:image:alt til og:image:alt. Så den ene taggen det er verdt å legge til er twitter:card, som velger oppsettet. Utelat den, og den samme referansen sier at X kan falle tilbake til et lite sammendragskort, selv om du ville ha det store:

• summary_large_image: et bilde i full bredde over tittelen. X-ens side om stort bildekort sier at bilder til det støtter et sideforhold på 2:1, med minimumsdimensjoner på 300 × 157 og maksimalt 4096 × 4096 piksler, under 5 MB, i JPG, PNG, WEBP eller GIF. SVG støttes ikke.
• summary: et mindre kort med et kvadratisk bilde. X-ens side om sammendragskort sier at bildet støtter et forhold på 1:1, fra 144 × 144 opp til 4096 × 4096 piksler, og beskjæres til en firkant på alle plattformer.

Den samme referansen lister opp app- og player-kort, som trenger ekstra App Store- eller videospillerfelt, så de er utelatt her. Den dokumenterer også grensene som kontrollene over bruker: 70 tegn for en tittel, 200 for en beskrivelse og 420 for alternativ tekst.

Bildestørrelser plattformene oppgir

• LinkedIn: guiden for å gjøre et nettsted delbart ber om og:title, og:image, og:description og og:url, og oppgir en maksimal filstørrelse på 5 MB, et minimum på 1200 × 627 piksler og et anbefalt forhold på 1,91:1.
• Meta: deres beste praksis for deling sier at du bør bruke bilder som er minst 1080 piksler brede for skjermer med høy oppløsning, og minst 600 piksler brede for å vise bildelenkeannonser. Den samme siden ber om og:image:width og og:image:height slik at crawleren kan vise bildet med en gang uten å måtte laste ned og behandle det først.

Et bilde på 1200 × 630 oppfyller alt dette: det er minst 1200 × 627 for LinkedIn, bredere enn 1080 for Meta, og 1,905:1, innenfor 5 % av X’s 2:1.

Sjekk det, og oppdater gamle forhåndsvisninger

Apper mellomlagrer det de hentet, så å fikse taggene fikser ikke en forhåndsvisning som allerede var lagret. Begge de store nettverkene gir deg et verktøy for dette:

• Metas Sharing Debugger viser taggene crawleren henter, med eventuelle feil eller advarsler, og utløser en ny henting. Metas webmaster-guide beskriver det, og siden om beste praksis bemerker at hentet innhold ellers oppdateres med et standard intervall på 24 timer.
• LinkedIns Post Inspector oppdaterer en mellomlagret URL. LinkedIns hjelpeside bemerker at oppdateringen bare påvirker nye innlegg: innlegg som allerede inneholder URL-en, beholder den gamle forhåndsvisningen.

Hva dette verktøyet ikke gjør

Det henter ikke siden din eller bildet ditt, så det kan ikke se hva som faktisk er publisert, og forhåndsvisningen over er en tekstskisse snarere enn en gjengivelse. Det skriver taggene; nettstedet ditt må fortsatt servere dem i <head> på siden, i HTML-en crawleren mottar. Tagger som legges til senere av JavaScript, blir kanskje aldri sett. Og det skriver ikke app- eller player-kort, eller de ekstra egenskapene som typer som book eller video.movie definerer.

Hvis du heller ikke vil skrive dette for hånd

Hermoso er markedsføring på autopilot: den undersøker annonsene som allerede fungerer i markedet ditt, lager bilde- og videoannonser i tråd med merkevaren din, planlegger innlegg og kjører betalte kampanjer på dine egne annonsekontoer. Den fungerer i nettappen, eller inne i Claude, ChatGPT og Cursor via sin MCP-server.

Gratisverktøy: UTM-lenkebygger · QR-kodegenerator · Størrelsesguide for sosiale medier

Ofte stilte spørsmål

Hvilke Open Graph-tagger er påkrevd?

Open Graph-protokollen lister opp fire påkrevde egenskaper: og:title, og:type, og:image og og:url. og:description, og:site_name og og:image-taggene for bredde, høyde og alt er valgfrie, men verdt å legge til.

Trenger jeg twitter:title og twitter:image hvis jeg har og:-tagger?

Nei. X-ens cards-markup-referanse sier at twitter:title, twitter:description, twitter:image og twitter:image:alt faller tilbake til sine og:-ekvivalenter. Taggen verdt å legge til er twitter:card, som velger kortoppsettet.

Hvilken størrelse bør et Open Graph-bilde ha?

LinkedIn ber om minst 1200 × 627 piksler i 1.91:1 og under 5 MB. Meta foreslår minst 1080 piksler bredt. X-ens store bildekort støtter 2:1 fra 300 × 157 til 4096 × 4096. Et bilde på 1200 × 630 passer alle tre.

Hvorfor viser lenken min fortsatt et gammelt bilde etter at jeg endret taggene?

Appen hadde den gamle skrapingen i mellomlager. Kjør URL-en gjennom Metas Sharing Debugger eller LinkedIns Post Inspector for å hente den på nytt. LinkedIn bemerker at innlegg som allerede deler URL-en beholder den gamle forhåndsvisningen.

Hvorfor endres anførselstegn og og-tegn i resultatet?

De HTML-escapes så taggen forblir gyldig. En tittel som Tom & Jerry's "Sale" blir Tom & Jerry's "Sale" inne i content-attributtet, og nettlesere og crawlere leser den tilbake som den opprinnelige teksten.

Laster verktøyet bildet mitt?

Nei. Ingenting du skriver inn sendes noe sted, og bilde-URL-en hentes aldri, og derfor viser forhåndsvisningen en plassholder i stedet for bildet.