When sharing a campaign or landing page on Facebook, a major frustration can be the lack of control over the image and description text that goes with the preview.
This happens because Facebook uses an internal algorithm to automatically determine the content to display. It's kind of a 'best guess' and it's disappointing when it's not the image or text that would seemingly make the most sense.
For instance, Facebook is capable of showing larger images and longer preview text than in the example below; and, of course, larger images and longer preview text help to increase user engagement.
The good news is that you can control and customise how your campaign or landing page is shared, by using Facebook's Open Graph tags.
Controlling the preview of a Facebook share
Facebook's Open Graph tags can be added to the HTML source of your campaign or landing page and these will directly tell Facebook how you'd like your shared preview to look.
If you're unfamiliar with HTML then the following may get a little technical, so please ask one of your web designers or developers for help, or feel free to contact firstname.lastname@example.org for any further assistance you may need.
Using Open Graph tags
Below we show how the Open Graph tags are inserted amongst the meta tags in the <head> section of your campaign or landing page's HTML (accessed by clicking on Utilities > Edit source).
And again, here are the Open Graph tags featured in the above screenshot, should you want to cut and paste them and then edit them as appropriate:
<meta property="og:url" content="http://company-name123.com/p/1LN5-1PD/sign-up-and-win">
<meta property="og:type" content="website">
<meta property="og:title" content="SIGN UP AND WIN!">
<meta property="og:description" content="Sign-up to our newsletter, and we’ll enter you into a monthly draw to win £50 of vouchers.">
<meta property="og:image" content="https://i.emlfiles.com/cmpimg/5/0/7/4/7/files/imagecache/2209/w1248_6214387_featuredproducthero.jpg
Explanation of the basic Open Graph tags
Here's an explanation of the most basic Open Graph tags. You can also find this information, and more, in the Open Graph tags link provided above.
The canonical URL for your landing page.
The type of website or content you'd like Facebook to categorise your shared item as. This tag impacts how your content shows up in Facebook's News Feed. You can take a look at a list of the possible Open Graph object types if you wish to. If you don't specify a type, the default is 'website'.
The title of your campaign or landing page which accompanies your URL.
A brief description of the content, usually between two to four sentences. This is the preview text that's then displayed below the title of the Facebook share.
The name of your website (for example IMDb, not imdb.com).
The URL of the image that will be used when your campaign or landing page is shared on Facebook.
Hint for sharing a campaignYou only need to use the title, description and image tags.
What's more, you can test your newly Open Graph-tagged landing page with Facebook's sharing debugger. After pasting in your landing page's URL, it will let you know about any errors you may need to fix.
If all's well with your Open Graph tags, then the result below is more like what you can expect when sharing.