Open Graph is a protocol introduced by Facebook in 2010 to allows deeper integration between Facebook and any web page. It allows any web page to have the same functionality as any other object on Facebook. You could control how your website is being displayed on Facebook. Now, other social media sites such as Twitter, LinkedIn are recognizing Open Graph meta tags.
Use a free tool such as OpenGraph.xyz to generate meta tags for your website, and copy the meta tags in the <head> element before the closing </html> tag.
Meta tags are only allowed in the head element. Adding meta tags in the body will result in invalid markup.
Use images that are at least 1080 pixels in width for best display on high resolution devices. Facebook recommends using 1:1 images in your ad creatives for better performance with image link ads.
When sharing your website on social media, there're chances that it looks different from the preview here. The main reason is your website has been shared before so any changes you made aren't reflected.
Click any of the official Open Graph debugger tool below to re-scrape your website:
Facebook Debugger is an open graph debugger service that allows you to check what information Facebook gets from each page on your site.
When someone shared your website on Facebook, Facebook will crawl your website, pull the data and cache it. If you make any changes to your website, use theFacebook Debuggertool to let Facebook scrape the latest information.