How To Add Facebook, Google+, LinkedIn Open Graph Meta Tags and and Twitter Card Tags To WordPress sites

Introduction:
Let’s understand the Open Graph Tags and Twitter Cards and how you maximize their impact and how they work on WordPress sites. Have you shared a link on Social networks and noticed that the link automatically generates a rich fragments, This indicates that a large image is displayed with a title and a short description of the shared page. Well, it does not happen by chance. This is a direct result of adding appropriate meta data or “tags” to the source code of the web page.

Why are these tags crucial?
Tags of social networks such as Facebook, Google+, LinkedIn, etc., the Open Graph Tags are the source of these fragments. Twitter has special Twitter tags (that is, Twitter cards) that are essential for adding multimedia to tweets. By adding a open graph tags that is open to your site, social networks can find out which photos,title, description etc. are used when someone shares the page on your website. The open graph tags are similar to the schema.org element. Both can set a specific part of the site’s value, such as Facebook, Twitter, and other social networking sites.

How can I get it?
The website has several ways to add open graph tags or twitter cards, but I use a simple manually handwritten OpenGraph/TwitterCards tags markup for WordPress themes and extensions. It is very useful for developers who want to build open graph protocol support in their themes and extensions.

Here is an example markup looks like these tags:

Most tags are clear. The og:type property is the only change and must be defined. In most cases, you can place the og:type property on an article or website. Twitter is a necessary twitter: card, twitter cards are the same as og: type. It determines what kind of things you share. You can choose from seven options: summary, photos, videos, products, apps, galleries, and “large version” summary.

Here is an example code for Open Graph Meta Tags and and Twitter Card:
1. Get the required post data for social markups.

2. Add post data to Open Graph Tags markup.

3. Add post data to Twitter Card Tags Markup.

4.Add Open Graph & Twitter Cards Tags markup to page header.

Finally, Open your current active theme’s functions.php file and drop this PHP code in or create a plugin and place, here the sample create file named as “share_Link_on_social_media.php” and create plugin header like below after that drop this PHP code in or you can download full code here.

Check your work :
You can now share all your blog posts correctly with social networks. Facebook and Twitter developers are a great tool to assess whether all meta tags are correctly placed when they submitted WordPress post and page URLs to the Facebook debugger and Twitter debugger distribution tools I want.

Conclusion :
On the other hand, your metadata on your site turned out to be a good SEO recommendation recommended by Google. To get the good positioning, you’ll need to include a meta tags on the site. Moreover, the more you promote social networking, the more opportunities for more visits. Use the appropriate meta tags to display meta data of different networks correctly. It is the first idea that it is important.

Leave a Reply

Your email address will not be published. Required fields are marked *