Required meta tags for website share on Facebook and Facebook sharing debugger

Have you ever think about how website link or URL share works on Facebook post creation?

If you want to make people able to share your site's content on Facebook, the source code on your site should contain some basic required open graph meta tags supported by Facebook so when you or anyone paste your website's or article's link on Facebook's create post section it will automatically fetch those meta tags from source code and build preview for your link.

When you paste any link in Facebook create post box it will fetch the required meta information of that pasted link and show preview accordingly like below.

This blog will explain how you can customize your link preview for Facebook according to your need and how you can test your link preview and meta information of your website with a Facebook sharing debugger.

First of all, if you want to make your website link sharable then you have to add the following open graph meta tags on your webpage's head section.

Below are basic open graph meta tags that should exist on your webpage to display link preview properly:

<meta property="og:url" content="URL of your webpage/article-This will display as url in link preview" />

<meta property="og:type" content="article" />

<meta property="og:title" content="Title of article/website-This will display as title in link preview" />

<meta property="og:description content="Description here-This will display as url in link preview" />

<meta property="og:image" content="Image link here-This will display as image in link preview" />

If your webpage has the above-required open graph meta tags then you can test link preview with Facebook sharing debugger.

Facebook Sharing Debugger is a very useful tool provided by Facebook to allow a developer to test meta information of any webpage and to test how your website's link preview will appear in the Facebook after post.

You just need to paste your website link into the URL box and you will get a preview and meta information of pasted link immediately.

Click on the debug button to analyze the meta information of pasted link. After debug, it will show results like below.

I hope this article may help you in some ways! If you found this useful then share this with others also and share your reviews in comment section.