Let's say when you share a URL on Social Media, such as on Facebook or Instagram or Twitter or Messenger, something like this is displayed. That's no good.
Open Graph to the rescue! The meta og (Open Graph) tags are used. For example, like this.
<html>
<head>
<meta property="og:url" content="https://stage.freekb.net" />
<meta property="og:type" content="article" />
<meta property="og:title" content="FreeKB Stage" />
<meta property="og:description" content="Welcome to FreeKB Stage" />
<meta property="og:image" content="https://images.example.com/images/my.jpg" />
<meta property="og:image:alt" content="https://images.example.com/image/alt.jpg">
<meta property="fb:app_id" content="123456789012345" />
</head>
<body>
Hello World
</body>
</html>
https://developers.facebook.com/apps can be used to get your fb:app_id.
Be aware that after you add this code to your HTML page, it may take a bit for this to be indexed (like a day or two) so, like, go grab a coffee, enjoy your day, and check back tomorrow.
https://developers.facebook.com/tools/debug can be used to spot issues and return how your URL will be displayed on Facebook.
Near the bottom of https://developers.facebook.com/tools/debug is an option Scrap API Click the link and select Submit to see if any issues are detected.
Did you find this article helpful?
If so, consider buying me a coffee over at 