Site Menu

Facebook Like Button

Add a Facebook Like button to your posts

by Scot Ranney

Facebook like and share buttons can be added with a few lines of code. The facebook meta data is already available in the article which means your button code can be fairly generic.

Step 1:

In your main blog store page add the following code directly under the <body> tag:

<mvt:comment>
|
| facebook
|
</mvt:comment>
<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.4&appId=519248694871523";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Step 2:

In the SCOTSBLOGGER_TEMPLATE store page, add the following code where you want your Facebook like button to show up:

<mvt:comment>
|
| facebook
|
</mvt:comment>
<div class="fb-like" data-layout="standard" data-action="like" data-show-faces="true">
</div>

If you want to use a share button as well, add the following code where you want it to display:

<div class="fb-share-button" data-layout="button_count">
</div>

Check out Facebook's docs about the like and other buttons here:

https://developers.facebook.com/docs/plugins/like-...

Another option is to use a service such as Add This which creates floating sidebar share and like buttons for almost all social networks.

Related Articles

These articles might be interesting for you as well:

This page might use cookies if your analytics vendor requires them.