Facebook Like Button

Miva Merchant Modules and Development
Want to start an online store? We work with you from start to finish, from commerce platform to design to SEO.
Experience counts, and we have a lot.

Facebook Like Button

Add a Facebook Like button to your posts

by Scot Ranney • November 10, 2017

Examples & How To's

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:

  1. <mvt:comment>
  2. |
  3. | facebook
  4. |
  5. </mvt:comment>
  6. <div id="fb-root"></div>
  7. <script>(function(d, s, id) {
  8. var js, fjs = d.getElementsByTagName(s)[0];
  9. if (d.getElementById(id)) return;
  10. js = d.createElement(s); js.id = id;
  11. js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.4&appId=519248694871523";
  12. fjs.parentNode.insertBefore(js, fjs);
  13. }(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:

  1. <mvt:comment>
  2. |
  3. | facebook
  4. |
  5. </mvt:comment>
  6. <div class="fb-like" data-layout="standard" data-action="like" data-show-faces="true">
  7. </div>

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

  1. <div class="fb-share-button" data-layout="button_count">
  2. </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.

overall rating:
★★★★★
★★★★★
★★★★★
my rating: log in to rate
The blog posts on Scot's Scripts are made using by Scot's Blogger, a full featured Wordpress replacement Miva Merchant blogging module.