INCLUDING: THE FACEBOOK SHARE BUTTON, DESCRIPTION CODES AND PROPERTY TAGS
Have you noticed that sometimes when you try to share one of your pages on facebook, facebook may mess up the thumbnail image from your site or not include an adequate description of your page?
In order for your page's description and image properties to be displayed correctly in a facebook post, you must use Facebook's property tags in your page's source code.
When adding the meta property codes listed below, be sure to put these codes in the HEAD of your website.
For example, between these two tags: <head> </head> in your page source.
Here are some helpful codes below.
THE FACEBOOK DESCRIPTION CODE:
This makes your page's description appear on your facebook post.
<meta property="og:description" content="TYPE DESCRIPTION HERE" />
THE FACEBOOK IMAGE CODE:
This chooses the image you want to pop up, on a facebook post.
<meta property="og:image" content="TYPE IMAGE URL HERE" />
OTHER METADATA
TITLE
<meta property="og:title" content="TYPE TITLE HERE" />
PAGE URL
<meta property="og:url" content="ENTER URL HERE" />
Once you have inserted the code into your page, be sure to use facebook's debugger on your page's URL in order for the code to take effect. This debugger will also recommend other property changes to make to your page.
If you didn't find what you were looking for above, try checking out this page.
HOW TO ADD A FACEBOOK SHARE LINK
Do you want to add a facebook share link to your page?
To do this, you need to add the code listed below on the part of your page you want the link to appear.
CODE:
<script>function fbs_click() {u=location.href;t=document.title;window.open('https://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;}</script>
</font>
<a href="https://www.facebook.com/share.php?u=%3Curl%3E" onclick="return fbs_click()" target="_blank">
CLICK HERE TO POST TO FACEBOOK</a>
EXAMPLE
HOW TO ADD A FACEBOOK SHARE BUTTON
ENTER THIS CODE AFTER <BODY> TAG
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
ENTER THIS CODE WHERE YOU WANT FACEBOOK BUTTON TO APPEAR
<div class="fb-share-button" data-href="ENTER YOUR WEB'S URL HERE" data-type="button_count"></div>
EXAMPLE
ADDING SOCIAL FEATURES WITH PLUGINS
Facebook "How to add social features with plugins" HERE
Sharing Content Back to Facebook