---
title: "Implement like box in your website"  
description: "In this article I am going to explain how to implement Like box plugin on your website."  
author: "Vijay Shukla"  
published: 2013-05-17  
updated: 2019-09-07  
canonical: https://www.mindstick.com/articles/1302/implement-like-box-in-your-website  
category: "api(s)"  
tags: ["api(s)"]  
reading_time: 3 minutes  

---

# Implement like box in your website

In this [article](https://yourviews.mindstick.com/view/81489/kashmir-now-after-an-year-of-abrogation-of-article-370) I am going to [explain](https://www.mindstick.com/forum/159699/what-is-a-compilation-error-in-dot-net-core-explain-with-an-example) how to implement Like box [plugin](https://www.mindstick.com/articles/23236/institute-management-for-wordpress-plugin) on [your website](https://yourviews.mindstick.com/view/81591/semrush-tutorial-and-review-2020-how-to-use-it-to-20x-your-website-traffic).\

The Like Box is a [social](https://yourviews.mindstick.com/view/83523/hindus-social-standing-in-lahore-before-partition) plugin that enables Facebook Page owners to attract and gain Likes from their own website. The Like Box enables users to:

- See how many users [already](https://yourviews.mindstick.com/view/88453/the-hidden-ways-ai-is-already-controlling-your-daily-life) like this Page, and which of their [friends](https://yourviews.mindstick.com/story/1192/places-in-india-to-visit-with-friends) like it too
- Read recent posts from the Page
- Like the Page with [one click](https://answers.mindstick.com/blog/379/how-can-i-send-bulk-whatsapp-messages-to-thousands-of-numbers-in-one-click), without needing to visit the Page

You need to implement the Like box with below link: [https://developers.facebook.com/docs/reference/plugins/like-box/](https://developers.facebook.com/docs/reference/plugins/like/) after clicking this link you will get below [screen](https://www.mindstick.com/blog/53499/top-5-big-screen-tvs-for-the-best-tv-shows-of-2019):

![Implement like box in your website](https://www.mindstick.com/mindstickarticle/42b82921-af59-462f-9277-dd80b2c064dc/images/8c444de8-5d65-499d-bfa6-e8dc547df28a.png)

1. Click to Like Box menu to open form.

2. Facebook page URL: -Here type or paste the URL of the Facebook Page for this Like Box. href should be an absolute URL.

3. Width: - Here give the width of the plugin in pixels. Default width: 300px.

4. Height: -Here give the height of the plugin in pixels.

5. Show Faces: - Here specifies whether or not to display profile photos in the plugin.

6. Color Schemes: - Here give the color scheme for the plugin. It has two options: 'light'(default), 'dark'.

7. Stream: - It specifies whether to display a stream of the latest posts from the Page's wall.

8. Border Color: - Here give the border of plugin.

9. Header: - Here specifies whether to display the Facebook header at the top of the plugin (by default is checked).

10. Get Code: - At the last click on the Get Code button to get the script for the plugin.

After clicking the Get Code button below screen will be appear.

![Implement like box in your website](https://www.mindstick.com/mindstickarticle/42b82921-af59-462f-9277-dd80b2c064dc/images/b507b556-e8de-4850-9c21-25e3321c300d.png)

Copy the red bordered code and paste where which you want to show the Like Box plugin.

##### Code: -

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Facebook Like Box</title>
    <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/all.js#xfbml=1";
        fjs.parentNode.insertBefore(js, fjs);
    } (document, 'script', 'facebook-jssdk'));</script>
</head>
<body>
<div class="fb-like-box" data-href="http://www.facebook.com/pages/MindStick-Software-Pvt-Ltd/111606255562715" data-width="292" data-height="600" data-show-faces="true" data-stream="true" data-border-color="#E99B15" data-header="true"></div>
</body>
</html>
```

##### Output: -

![Implement like box in your website](https://www.mindstick.com/mindstickarticle/42b82921-af59-462f-9277-dd80b2c064dc/images/783d715a-cb19-4e2f-9478-9c42aa055852.png)

---

Original Source: https://www.mindstick.com/articles/1302/implement-like-box-in-your-website

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
