Image

seo

Open Graph

How to setup Open Graph and Twitter Card

1 min read
Last update: November 28, 2021

About

Open Graph is a preview of website when a user send a link into messaging system like Slack, Discord, Teams, Messenger or Twitter for example. It's display website title, a description and an image, it seems unimportant, but with this small card, users in conversation can have a useful presentation of website or page of a website. If this an article, we can see an abstract of body with an image which is attractive. The design of this card depends of social network or messaging system. We have two type: open graph (for Facebook and some messaging systems) and twitter card (for Twitter).

Click on image
to open it in new tab
og-discord.webp A preview of this website on Discord.
Click on image
to open it in new tab
og-discord-details.webp A preview of an article of this website on Discord.

Documentation

Tools

Test tools

Examples