Thursday, December 18, 2014

Latest Facebook Share Method for HTML (Dec 2014)

The Facebook share method has gone through a lots of changes since my last post long ago. Here is the latest update. Please note that these codes may not be working by the time you use them as Facebook updates its coding requirements very often.

Anyway, here are the codes:

<html>
<head>
<meta name="description" content="Welcome to my website! My phone number is 1234567! Thank you!">
<meta property="og:title" content="Your Facebook Post Title" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://yourdomainname.com/pic1.jpg" />
<meta property="og:url" content="http://yourdomainname.com" />
</head>
<body>

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>

<div id="share">
<fb:share-button class="meta">
<link rel="image_src" href="http://yourdomainname.com" />
<link rel="target_url" href="http://yourdomainname.com" />
</fb:share-button>
</div>

</body>
</html>


Note: Please note that you need to own the website in order to place these codes in the index page. If you don't own the website or domain, the share information will not show up correctly. Secondly, if you run these codes on the "localhost", the share button won't show up. Please note that you need to change those in blue to your own information.

If the information doesn't show up correctly or you want to update your Facebook share information, you need to use Facebook linter or debugger. Here's the link: https://developers.facebook.com/tools/debug/. The linter/debugger link has also changed since my last post. Please also note that you may need to press "Fetch new scrape information" a few times for the system to update.

No comments:

Post a Comment