The share button provides an easy to use access into the Facebook share dialog, as well as some other functionality such as the button counter.

  • Need to create an application AppID
  • Include the Facebook JS SDK
  • Note the language needs to be configured for the SDK
  • Include the code in the Angular run to load and init the SDK


There are essentially three ways to call the share dialog. through the provided Facebook button, Javascript of a link.

Can also invoke the share dialog directly through JavaScript, this has the added advantage of being able to be used on a custom button.

  • Trigger a Share Dialog using the FB.ui function with the share method parameter to share a link.
  • Need to implement


= codeBlender "share-button", "social/facebook/share-button", { href: "" } 
<div class='fb-share-button' data-href='' data-layout='icon_link' data-mobile-iframe='true' data-size='small'></div>

Button count

= codeBlender "share-button", "social/facebook/share-button", { href: "", layout: "button_count" } 
<div class='fb-share-button' data-href='' data-layout='button_count' data-mobile-iframe='true' data-size='small'></div>

Javascript Share dialog

= codeBlender "share-button", "social/facebook/share-button", { href: "", type: "javascript" } 
<a href="javascript:;" class="facebookShareButton" data-url=""><span class='fa fa-facebook-official fa-fw fa-3x'></span>


Link Share dialog

= @code
<a href=";app_id=253027968192447&amp;display=popup&amp;href=;redirect_uri="><span class='fa fa-facebook-official fa-fw fa-3x'></span>


Resources Useful websites and tutorials