On the internet now days many platforms such as Facebook, Twitter, and many others visualize links with an attractive image, title and short description. To set an industry standard, Facebook created the Open Graph internet protocol that uses metadata of a webpage to represent specific information.
Nowadays, many of the websites we're using have Open Graph already built-in, even your CMS most probably has it built-in already. The rich previews that are created using Open Graph are supported by popular video websites such as YouTube and Vimeo, but also by streaming platforms, app stores and even many upload services or screenshot services such as CleanShot Cloud or CloudApp.
How is Open Graph been used in Embed?
Embed is loads the Open Graph data such as og:image, og:title and og:description. For Full box we show all data (title, description and image), for Image only we load the image only. In both scenarios, Embed will create a link to the webpage as well.
How can I customize the information Embed is showing for my own website?
If you are the website owner and have access to the data of the <HEAD> in your website you can use the following code sample to change the behavior of the outcome of Open Graph and how Embed will load information.
<meta property="og:title" content="Special title for Embed and Open Graph" /> <meta property="og:description" content="This is a super special description for Embed and Open Graph" /> <meta property="og:image" content="https://domain.tld/image.jpg" />