Facebook is really smart in pulling in the right data from your posts when they are shared on Facebook. However, if you are an avid user of Facebook, you might have noticed that Facebook doesn’t always pull the right thumbnail image and description when a post is being shared. However if you don't include WordPress og tags (or open graph) tags you won't get the right information.


This happens when a user shares a post from a WordPress site, which is not being updated with Facebook’s open graph meta information.

This is what it may look like when you share a URL on Facebook from a website that is not being updated with open graph tags.

facebook share without og tags

This is how it looks like when you share a page that is updated with WordPress open graph tags.

facebook share with og1

Facebook’s open graph (og) tags

Facebook’s open graph tags define how a third-party website (like your blog) will be presented on Facebook. In fact, open graph elements are used by other social networks as well in order to customize the sharing that happens there. There are three main tags that are associated with the look of a Facebook share update. To include the WordPress open graph tags, you'll need to cater for the following:

  • og: image
  • og: title
  • og: description

og tags facebook1

By using open graphs on websites, Neil Patel found a lift in click through rate by 39%.

How to check “og” tags on your WordPress?

Look at the source code of your WordPress website if you are not sure whether og tags have already been placed on your website. In Windows or Linux, press Ctrl + U and in Mac, press Command + Alt + U for viewing the source code.

If it is already being added, you’ll find your og tags in the <head> section inside the “<meta property =…” tag. See the screenshot for an example.


Additionally, you can use the Facebook URL Linter to see what Facebook is reading about your site.

Adding WordPress og tags without a plugin

Simply add the following code snippet to your functions.php file for adding WordPress og tags without a plugin.

//Adding the Open Graph in the Language Attributes

function add_opengraph_doctype( $output ) {

          return $output . ' xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml"';


add_filter('language_attributes', 'add_opengraph_doctype');

//Lets add Open Graph Meta Info

function insert_fb_in_head() {

   global $post;

   if ( !is_singular()) //if it is not a post or a page


    echo '<meta property="fb:admins" content="YOUR USER ID"/>';

    echo '<meta property="og:title" content="' . get_the_title() . '"/>';

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

    echo '<meta property="og:url" content="' . get_permalink() . '"/>';

    echo '<meta property="og:site_name" content="Your Site NAME Goes HERE"/>';

   if(!has_post_thumbnail( $post->ID )) { //the post does not have featured image, use a default image

          $default_image="http://example.com/image.jpg"; //replace this with a default image on your server or an image in your media library

          echo '<meta property="og:image" content="' . $default_image . '"/>';



          $thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'medium' );

          echo '<meta property="og:image" content="' . esc_attr( $thumbnail_src[0] ) . '"/>';


   echo "



add_action( 'wp_head', 'insert_fb_in_head', 5 );

Make sure you change “Your Site Name Goes Here” with your site name and "YOUR USER ID" with your own user id.

You can find your Facebook user id by going to your Facebook profile image. Once you opened your profile image on a browser, you can see something like this: fbid=”your-user-id-here” in your URL bar. Copy that user id and replace it with "YOUR USER ID" section in the above code.

You’re done! Your website is now updated with open graph tags.

Adding og tags to WordPress with a plugin

For adding WordPress og tags, simply install this plugin to your WordPress website. It works perfectly well in adding “og: image”, “og:title” and “og:description” tag to your website.

Download the list of 101 WordPress tricks every blogger should know

101 WordPress tricks

Click here to Download Now
About the Author
David Attard
Author: David AttardWebsite: https://www.linkedin.com/in/dattard/
David has been working in or around the online / digital industry for the last 18 years. He has vast experience in the software and web design industries and niches surrounding them. As a digital consultant, his focus is on helping businesses get a competitive advantage using a combination of their website and digital platforms available today.

One more thing... Did you know that people who share useful stuff like this post look AWESOME too? ;-)
Please leave a useful comment with your thoughts, then share this on your Facebook group(s) who would find this useful and let's reap the benefits together. Thank you for sharing and being nice!

Featured On

Inc Magazine Logo  

Sitepoint logo  

CSS Tricks logo   

webdesignerdepot logo   WPMU DEV logo   

and many more!



Get Started Now With ShutterstockShutterstock

Best Rated Caching Plugin

Make your website faster 

Monstrous B-Day Party

CLICK HERE for discounts!

Monstrous bday party

How to make your website FAST!

Step-by-step - free email course, how to make your website load in less than 1 second 


The Outstanding HungryJPEG Bundles

AWESOMENESS! Bundles of premium font + graphic packs at more than 96% OFF!  Get a bundle for just $9 - ONLY!

The Hungry JPEG Awesome font bundles


Work with CollectiveRay.com

CollectiveRay (formerly known as DART Creations) is interested in developing partnerships with mutual benefit. If you like the stuff we publish and would like to develop a relationship, we'd be happy to hear from you. Go on - drop us a line - we'd love to hear from you :-)


Disclosure: CollectiveRay is funded personally out of pure passion for helping people working with websites. We do however generate some income through recommendations of products. This means if you click on a link and purchase an item we link to, we will receive a small sum out of that sale. We usually partner with vendors to make your purchase cheaper than buying direct.


InMotion Hosting CollectiveRay Deal

who are we?

CollectiveRay is run by David Attard - working in and around the web design niche for more than 12 years, we provide actionable tips for people who work with and on websites. We also run DronesBuy.net - a website for drone hobbyists.

David attard

Follow us on Social

Follow us on Facebook   Subscribe to our RSS Feed   Follow us on Twitter


Where are we hosted?

This site is proudly powered by FAST VPS InMotion Servers and given an insane speed thanks to StackPath CDN!

Web Hosting stackpath