How to Create a Facebook Like Box Popup with OptinMonster

Do you want to add Facebook likes to your page via a popup or another campaign on your site? It’s easy with our Canvas Technology! In this guide, we’ll show you how to use Facebook’s Page Plugin to create a Facebook Like Box for your site that you can load via our Canvas Technology in a lightbox popup, our slide-in, or on Mobile Canvas.

REQUIREMENTS: This guide makes use of OptinMonster’s Canvas Technology which requires a Pro subscription.
  1. Generate Facebook Embed Code
  2. Copy Generated Embed Code
  3. Paste Facebook Embed Code
  4. Customize the Campaign

Step 1 – Generate Facebook Embed Code

We’ve created a step-by-step walkthrough for adding the Facebook “Like” and “Share” features to your popup. Please note these updates to the guide:

IMPORTANT NOTE: Facebook has deprecated their Like Box, and replaced it with their Page Plugin. The following instructions now demonstrate how to add a Page Plugin to your Canvas campaign.

Navigate to the Facebook Page Plugin Generator to begin generating the embed code. On the generator page enter the link to your Facebook Page into the Facebook Page URL field. Make any additional modifications you desire as well.

Enter your Facebook Page's details into the Page Plugin Generator fields.

Step 2 – Copy Generated Embed Code

Next, select the Get Code button. This will open a new window that provides two blocks of code – the first is the Facebook SDK and the second is the code which outputs the Page Plugin.

Facebook-Code-to-Add-to-OptinMonster-Canvas-Optin

Step 3 – Paste Facebook Embed Code

Navigate to the campaign Builder, select the Optin tab to view the Optin panel and here you can paste both blocks of code into the Canvas Custom HTML field. Your Facebook Page Plugin will then appear in your campaign something like the image below.

NOTE: you may need to save and refresh the optin Builder before Facebook’s scripts will properly load the Page Plugin for the first time.
Facebook Page Plugin Code

Step 4 – Customize the Campaign

You can modify that width and height of your Canvas campaign to better contain the content. Below, the campaign is modified to be 500px wide by 215px tall. Your exact dimensions are entirely up to you.

Facebook Canvas Dimensions

You may also wish to remove the default padding surrounding your Canvas campaign, this can easily be done by adding CSS to the Custom CSS field following our guide how to remove the padding from Canvas Campaigns.

Facebook Page Plugin CSS

Congratulations, You have just used OptinMonster to Create a Facebook Page Plugin popup!

Ready to add the campaign to your website? See our doc on how to embed your campaigns on your site.


FAQs

Q: How do I track conversions when visitors interact with the Facebook Like Box?

A: Since the Facebook Like Box creates an iFrame, tracking conversions isn’t directly possible. However OptinMonster has created a walkthrough guide to track conversion-intent when using iFrames here.