facebookA good way to increase search engine visibility is to post to social media like Facebook, Twitter, LinkedIn, etc. There are different schools of thought on whether it’s a good idea to push your blog posts over in an automated fashion by using plugins or whether these posts should be done by hand. However, most people will agree that pictures should be part of what’s posted.

I have a client who wants the posts to come over to Facebook with a new featured image each time. We have been using the Sociable plugin to do that, but it’s not bringing over the pictures. It does a great job sharing the posts, but just no picture. In the process of troubleshooting the issue, I wondered whether there was an issue with Open Graph Meta Data. Facebook needs us to give it information via the Open Graph Meta Data in our themes so it knows the correct thumbnail pictures, titles,  to bring over when a post is shared.

In my search, I found a great tutorial by WP Beginner called How to Add Facebook Open Graph Meta Data in WordPress Themes. This gave me step by step instructions on how to alter the functions.php file to add the needed code. If altering the functions.php file scares you to death (can’t say that I blame you) then there’s also another plugin they recommend, WP Facebook Open Graph Protocol. I discuss the set up and use of this plugin in a previous post that you can read about here.

Still, nothing seems to be working for my client. I have used another plugin that automatically sends the post over without having to click on a share button to send it over. This plugin is called Leenk.me. It has been a great addition to my standard plugins for any site that has a blog. Facebook changes its open graph protocol frequently and Lew Ayotte, the author of the plugin offers amazing support. Well, hoping that the third (or fourth) time’s the charm, I install this plugin and set it up. It works! Well, almost….The post blurb goes over, but the image is missing. I contacted Lew and he found that everything was set up properly, but when clicking on the image in the space left of the post, he was rewarded with a 403 Permission Denied Screen. His conclusion was that there was something wrong with the permission settings on the server.

I was getting closer, but I had been this close before…..Now it’s time to check with the web hosting company, BlueHost. This is another company I love. These support folks will stay with you on the call until they’ve exhausted all possible avenues and they usually solve the problem. This was no exception. They image file permissions (644) were fine, but they decided to check a few more things. What they finally found was that there were five lines of code at the end of the .htaccess file that were blocking the display of the images:

RewriteCond %{HTTP_REFERER} !^http://yourdomain.com/.*$ [NC]#
RewriteCond %{HTTP_REFERER} !^http://yourdomain.com$ [NC]#
RewriteCond %{HTTP_REFERER} !^http://www.yourdomain.com/.*$ [NC]#
RewriteCond %{HTTP_REFERER} !^http://www.yourdomain.com$ [NC]#
RewriteRule .*.(jpg|jpeg|gif|png|bmp)$ – [F,NC]#

He commented them out by putting a pound sign at the front of each of the five lines, and like magic, the image appeared on the shared Facebook post. Who knew that five little pound signs could make all the difference in my WordPress world?