2

I am seeing that when I put URLs for some websites in Discord or in Twitter, the applications shows nice embedded pills of the website directly in the stream.

For example this is the embedded pill of a github url in Discord:

enter image description here

The same URL in twitter:

enter image description here

How can I make my website to also generate nice embedded pills?

I have been trying things from Open Graph but they are not working for me.

fguillen
  • 36,125
  • 23
  • 149
  • 210

1 Answers1

2

I managed to make it work in Discord, this is what I have in my <head>:

  <meta property="og:image" content="https://land.playcocola.com/playcocola_assets/Bottle_objects_black.png" />
  <meta property="og:image:alt" content="The easiest way to get videos of people playing your game." />
  <meta property="og:image:width" content="1053" />
  <meta property="og:image:height" content="984" />
  <meta property="og:site_name" content="Playcocola" />
  <meta property="og:type" content="object" />
  <meta property="og:title" content="Playcocola - The Playtesting Platform for the Indie Dev Community" />
  <meta property="og:url" content="https://land.playcocola.com" />
  <meta property="og:description" content="The easiest way to get videos of people playing your game." />

  <meta name="twitter:image:src" content="https://land.playcocola.com/playcocola_assets/Bottle_objects_black.png" />
  <meta name="twitter:site" content="@playcocola" />
  <meta name="twitter:card" content="summary_large_image" />
  <meta name="twitter:title" content="Playcocola - The Playtesting Platform for the Indie Dev Community" />
  <meta name="twitter:description" content="The easiest way to get videos of people playing your game." />
fguillen
  • 36,125
  • 23
  • 149
  • 210