Customizing A Shared Page On Facebook: Use Open Graph
Whenever you share a link on Facebook or you paste a link into your status update, you’ll notice that it displays a title and sometimes a description and photo. To change what information is displayed when a page on your website is displayed involves using Open Graph, or simply placing a number of Meta Tags in the <head></head> of each page on your website with customized content to display in Facebook.
Here’s an example of what the Meta Tags would look like:
<meta property="og:title" content="Roto Grip Bandit Bowling Balls"/> <meta property="og:type" content="product"/> <meta property="og:url" content="http://www.bowlingball.com/products/bowling-balls/RotoGrip/9528/Bandit.html"/> <meta property="og:image" content="http://static-images.intheproshop.com/product-images/roto-grip/bowling-balls/300/bandit-28912.jpg"/> <meta property="og:site_name" content="BowlingBall.com"/> <meta property="fb:admins" content="USER_ID"/> <meta property="og:description" content="The new bad boy in town will help you steal all of your competitor's cash and not feel bad about it one bit! The soon to be infamous Roto Grip Bandit Bowling Ball!"/>
For the image property, use a link to an image on your website that is at least 50px X 50px, an aspect ratio of 3:1, and in the PNG, JPG, or GIF format. The type property can be chosen from a list of examples. http://developers.facebook.com/docs/opengraph/#types
How To Determine Your Facebook User_ID
To determine your Facebook USER_ID, add your username to end of the following URL: https://graph.facebook.com/
For example, if your username is “chimp”, then you will load the URL https://graph.facebook.com/chimp/ and it should return a screen with the information below where you can simply copy / paste the “id”:
Facebook Won’t Display My Image or Open Graph Data
Sometimes Facebook doesn’t see the updates you’ve made in the Meta Tags right away due to its servers caching old content. Try the following steps to see the update image or open graph data:
- Use Facebook’s Debugger Tool – Formally called Facebook Lint, this tool will reload the open graph content from the URL you enter and reset the page information, providing you with details of what’s in your Meta tags and what you are missing. Click here to go to the debug tool.
- Login Again – If you tried the Debugger tool above, logout of Facebook and back in again. Sometimes the page information is cached in your browser and logging in again seems to clear this.
No Comments »
No comments yet.
RSS feed for comments on this post. TrackBack URL
