Did you know that you can control how Facebook displays your web pages when they are shared on the social network? You may have found that when you post links to articles on Facebook, it sometimes pulls in an image from the post, also the title, as well as a description of the article. This is because the website is feeding Facebook with information that goes into the Facebook Open Graph Protocol. In short, this protocol is a little bit of information that lives on every page of your site that tells Facebook what the title, description, url, image, etc.. are for that particular page. Rather than making Facebook scan through the article and try to decide for itself, you can do some things to make sure that Facebook is using the information that you want it to use when the article is posted to Facebook.
If You Are Using WordPress:
If your website or blog is on WordPress, you’re life is made a lot easier if you want to control how Facebook displays your pages. Here’s what you do:
STEP 1: Install WordPress SEO by Yoast. Yes, this is not only the best SEO plugin available for WordPress, but it also has a feature to control how your posts appear on social networks. Nice huh?
Once you activate the plugin, you will want to turn on the Social functionality. This is done by going into the plugin’s Social settings. Click on Social, and then check the box to Add Open Graph meta data. You might want to do the same for Twitter as well as Google+ while you’re in there.
After activating the social functionality, you will see the section (see below) on each of your posts that allows you to manage the SEO settings for that post. Click on the Social tab.
Step 2: Enter the Title that you want to appear when this article is posted on Facebook. Do the same for the Description of the page. You may also want to specify the photo or image that you would want to appear when you share the article on Facebook. Sometimes Facebook is smart enough to pull the featured image from the page, or another image from the page, but this is the easy way to tell Facebook which image you WANT to appear. You can choose from amongst your Media Files that you have already uploaded too.
You will notice that you can do the same for Twitter, as well as Google+ posts. If I were you, I would go ahead and set these up. Even if you don’t use those social networks, it doesn’t mean that your article won’t get posted on them. And if your article is posted, you’ll be smart to make sure that it appears the way that you want it to look.
Step 3: Once you publish your new post, the information that you have included in the Social section of the Yoast plugin will be included on the published page. Just to make sure, you can test it out using Facebook’s Open Graph debugging tool: https://developers.facebook.com/tools/debug/
Make sure that you have published the page. Facebook will not be able to scan a draft post.
Enter the URL to your article and click Debug.
You will see what Facebook sees when your article is shared.
Each of the elements that you edited on the Yoast plugin should appear, including a thumbnail of the image that you chose.
You will also be able to see a preview of how it will look when the article is shared:
Say you made some changes to the page, and want to test it again? Once you publish your changes, click the Fetch New Scrape Information button on the debugging tool. This will clear the page from Facebook’s cache and fetch new page info. You should see your changes there now. You can also use this method to clear Facebook’s cache at any time, for any page.
Once you have it looking the way that you like, go ahead and share it on Facebook, and anywhere else you want it to be shared!
Not on WordPress?
If you’re using another system, or building your web pages from scratch, you will want to make sure that you include the Open Graph tags in your page <head> tag. You should follow the official open graph protocol instructions, which are available here.
We hope that you found this article to be helpful, and that you can get started with making your sites pages more easily shareable and attractive to users when they are shared. If you need help with any of this type of stuff, let us know. We would love to help. Thanks for reading.