Set WordPress Featured Image as Facebook Thumbnail

If you have a WordPress blog, odds are that you are sharing your posts on Facebook and other social media websites. Some of these sites allow you to include a thumbnail image and description when you or your visitors share posts. For example, when you paste in a URL on Facebook or LinkedIn they will pull an image (if available) and description from the page. At first glance, it may appear that you don’t have much control over this.

However, both Facebook and LinkedIn utilize the Open Graph Meta tags (For more info about the Open Graph API in general, check out David Walsh’s Facebook Open Graph META Tags article.). If you take advantage of this, you can control which image and description is pulled by default.

How can I use Open Graph Meta Tags with WordPress?

It is a pretty straightforward process to add the required meta tags. First, we need to allow for Facebook markup in our opening HTML tags. In this example we are going to add a few filters in our functions.php  file to accomplish this (Note: you could also add the appropriate code to your header.php):

Now we can add the Open Graph meta tags just like regular meta tags and use WordPress’ Template Tags to fill them in. Here’s an example:

Most of the tags are pretty self explanatory, but feel free to ask questions if anything is unclear.  If you wanted to avoid touching your theme files, I’ve packaged this into a simple plugin that you can use as a starting point.  You can see the full code for the plugin here (the zip also contains a screenshot and a readme):

And you can download it from the WordPress Plugin Repo: Facebook Featured Image and Open Graph Meta Tags

Things to consider:

A lot of plugins and themes already include some or all of this functionality. For example, WordPress SEO by Yoast takes care of this for you. A lot of themes will also do this by default. To avoid redundancy you should check to see if the Open Graph tags already exist on your site. All code contained in this post is to be used on an “As-is” basis, and may contain errors. If you notice any, let me know!

References

Facebook Featured Image and Open Graph Meta Tags
by Ryan S. Cowles

This plugin will add the necessary Open Graph Meta tags to automatically set the posts’ Featured Image as the thumbnail for sharing on Facebook and LinkedIn. It will also set Open Graph Meta tags for title, description, URL, type, and site name.

Stats:

  • Current version: 1.0.1
  • Rating: 82(10 ratings)
  • Downloaded 22,005 times