I have a client who didn’t like the same old boring picture going to Facebook each time that her new blog posts shared with Facebook. She wanted a new corresponding image to go with it. I agreed and then did some investigation.

Open Graph ProtocolMy first inclination was that the owner of the blog was not setting a featured image and I was right, to some extent. However, when I set the featured image, the new picture did not go with the post. Facebook chooses the picture it wants. Upon further investigation, I found that Open Graph meta tags need to be included to “tell” Facebook which picture to use.

I had no clue how to insert proper Facebook Open Graph Meta tags and values to my site.  Enter a light-weight plugin called WP Facebook Open Graph Protocol that does the job so easily. Once the plugin is installed you must configure it and after the settings are saved, you’re in business! Here’s what you do:

  1. Go to Settings > Facebook OGP
  2. Fill in Facebook User Account ID
  3. Log in to Facebook
  4. Find your username by clicking on the gear icon in the upper right hand corner (Going across you should see first your name, then “Home”, then a Lock icon, and finally a Gear icon.)
  5. Click the Gear icon, then in the dropdown menu choose Account Settings. Username will be the second item listed.
  6. Navigate to http://graph.facebook.com/yourusername. You will see something like this:
  7. {
       "id": "100012345",
       "name": "Sally Joe",
       "first_name": "Sally",
       "last_name": "Joe",
       "link": "http://www.facebook.com/sallyjoe",
       "username": "sallyjoe",
       "gender": "female",
       "locale": "en_US"
    }
  8. Fill in the number 100012345 (just an example in this case) in the blank next to Facebook User Account ID. It is not necessary to put in a Facebook Application ID. If you want a Default image to be used when there isn’t a featured image then put in the URL of the image you want to use. They recommend the size be 200px by 200px. Save the Changes.
  9. To see if it went through, navigate to this URL: https://developers.facebook.com/tools/debug. Fill in the URL of your blog post and hit the Debug button.

If things went well, you will see the featured image as part of the post. Note, this plugin has not been tested with WordPress 3.7.1, but I was able to use it with no problem.

Top