How to Create a Custom ‘Like Us On Facebook’ Popup to Get More Followers

Are you looking to get more people to follow your business page on Facebook? Do you have good website traffic that you want to convert into social media followers?

If you answered ‘yes’ to both of these questions, you definitely should embed a ‘Like Us On Facebook’ popup on your website.

Adding a Like Us On Facebook button lets your site visitors follow your Facebook page with a single click.

Once people start following your page, they are more likely to see and engage with each piece of content you post on Facebook.

That means you can improve your social media presence and content distribution just by adding a simple popup to your web page.

In this post, I’ll show how to create a custom Like Us On Facebook popup in 5 easy steps.

Before we dive into the tutorial, here are some quick stats on why adding a Facebook popup is crucial for your business.

Why Add Like Us On Facebook Popup?

In today’s fast-changing business landscape, social media is a powerful digital marketing channel that can get you more than just likes.

But many small business entrepreneurs can’t decide where to invest their marketing dollars: email marketing vs social media. If you’re not sure how adding a Facebook like button can help you, consider the following statistics:

This infographic shows Facebook’s growing clout in business and advertising in more detail. In short, building an audience on Facebook can unlock great business opportunities for you.

But for you to leverage Facebook as a contributor to your revenue, you’ll first need to grow your Facebook page.

One of the best ways to reach potential Facebook fans is on your own website. After all, your site visitors have already shown interest in what you have to offer. Now you just need to convince them to take the next step: liking your Facebook page.

For this tutorial, I’ll use OptinMonster.

But why OptinMonster?

OptinMonster is the #1 lead generation software that comes with a ton of powerful features and affordable pricing. You can design high-quality marketing campaigns without writing a single line of code.

Unlike other tools, OptinMonster allows you to trigger popups at the right time, to the right people, and on the right pages. That means you can display high-quality popups that don’t annoy your audience.

Here are a few ways how you can use OptinMonster’s targeting features to offer a friendly user experience (UX):

  • Time the popup to show 30 seconds after a visitor lands on your site.
  • Delay your popup to appear only after visitors have visited 2 or more pages on your site.
  • Use referral detection to display your popup only to visitors who arrived on your site via Facebook (which means they already are Facebook users!).
  • Use Exit-Intent® to display your popup only when a visitor is about to leave your site.

I’ll show you a few of OptinMonster’s display and targeting features in the second half of the post. For now, let’s create the Facebook like popup.

Ready? Let’s get started.

Create a Like Us On Facebook Popup

Step 1. Create Your Campaign

Log in to your OptinMonster dashboard, and click on Create Campaign.

how to create like us on facebook popup

Don’t Have an Account Yet?: Sign up for OptinMonster to get started today or check out this extensive review to see if OptinMonster is right for you!

Next, choose a campaign type. For this tutorial, we’ll go with Popup.

how to add like us on facebook popup

Here, we’ll need to choose a template. OptinMonster has 100+ pre-designed templates to choose from.

Since creating a Like Us On Facebook popup will require us to add an embed code from Facebook, we’ll choose the Canvas template.

This will allow us to design the popup from scratch and easily copy-paste the HTML code from Facebook.

how to embed like us on facebook popup

Name your campaign and select the website where you want it to load, then press the Start Building button.

add like us on facebook popup to website

This will take you to the OptinMonster campaign editor.

Step 2. Edit Your Campaign

When you get to the editor, you’ll see a blank canvas.

embed like us on facebook popup to website

You can delete the sticker image and text block that are there by default.

create a custom like us on facebook popup

On the left-hand of your screen, find the Blocks menu. Click and drag the Columns block to the editor.

how do I create like us on facebook popup

You’ll have the option to choose from 7 types of columns. By default, OptinMonster selects the single-box column. You don’t need to take any action here since the single-box column is perfect for our use.

how do I add like us on facebook dialog box

Next, click on the home icon on the top-left of the screen to go back to the Blocks menu.

how to add like us on facebook popup for free

Scroll through the options and find the HTML block from the options. Drag it to the campaign editor.

easy way to add like us on facebook popup

Step 3. Get the Facebook Code

Leave the editor open, and open the Facebook Page plugin page in a new tab.

In the Facebook Page URL field, enter your Facebook page link. I’ll enter OptinMonster’s Facebook page’s URL for this tutorial.

best way to add facebook like popup

Adjust the width and height to meet your needs. I’ll make the popup 500 px wide and 250 px high.

best app to add facebook like popup

Adjust other settings as needed. For example, I selected Use Small Header so that we can fit more content in the popup box.

free wordpress plugin to add like us on facebook box

You can also check the box to hide your cover photo. But I recommend you keep it as is since it helps with brand recall.

Step 4. Add the Facebook Code to Your Campaign

Once you’re done, click on the Get Code call to action (CTA). You’ll see this box pop up.

add facebook like popup box

Facebook provides two blocks of code. Copy the code from the first block. Keep the tab open, as you’ll need to come back to grab the second block of code later.

Go back to the campaign editor and paste the first block of code you copied from Facebook into the HTML editor. You can locate it on the bottom-left of the page.

how to add facebook like popup

Return to the tab with the Facebook Page plugin website and copy the second block of code. Paste the code below the first block of code.

how to add facebook like button

Save your campaign.

add facebook like button

Go to the Publish tab and set the campaign’s status to Publish.

add facebook like popup box

Now, scroll down the page to the Platform section and select the Share Link button. Copy the link that appears at the bottom of the share button and paste it on a new tab.

create facebook like box

This is what our campaign looks like so far:

add facebook like us box

Since there’s a lot of extra white space on the right, we’ll edit the default canvas size to get rid of the extra space.

Click on the gear icon at the bottom-left of the dashboard. Click on View Styling to find the Max Campaign Width option.

design facebook like us popup

By default, the width is set to 800 px. You can change the width as needed. We set ours to 500 px.

create custom facebook like us popup

After making the adjustments to the width, save and check your campaign again. It looks much better now, without any extra space:

add facebook like us dialog box

Step 5. Set Your Display Rules

Now we’re going to choose when the Like Us On Facebook popup will display. With OptinMonster, you have plenty of display rules to choose from.

For instance, you can set your campaign to show based on:

  • Who can see it
  • When can they see it
  • Where can they see it
  • User behavior

The OnSite Retargeting and Ecommerce rules help you trigger your campaign based on specific user behavior, such as if a person has:

  • Visited your website
  • Seen a campaign before
  • Clicked on a campaign
  • Added specific products to their shopping cart
  • Items in their carts that exceed a certain amount

For our tutorial, we’ll set up display rules for the following 3 rules:

Number of Pages Viewed

Go to Display Rules. You’ll see that the time on page rule is already configured to at least 5 seconds.

You’ll also see the current URLpath is set to is any page by default. This is to ensure that your campaign will show on any page after publishing even if you forget to enable a display rule.

create facebook like us message

In our case, a better option is to show the Like Us On Facebook popup only to visitors who’ve already shown interest in your content.

To do this, change the first rule to # of Pages Viewed. Pair it with is at least and set the number of pages you prefer.

We suggest at least 2 because if people visit multiple pages on your site, it usually means that they want to engage with your brand.

embed facebook like us to website

You can delete the second rule by clicking on the trash can icon on the right of the rule.

embed like us facebook button

Don’t forget to Save your campaign.

add facebook like button

Exit-Intent®

You can use OptinMonster’s Exit-Intent® Technology to show the Like Us On Facebook popup to visitors who are about to leave.

add facebook like us message to website

To enable this, change your rule to show if exit detected. Choose the device if you want to enable this rule only on desktop, mobile, or both. You can also choose the Exit-Intent® sensitivity as low, medium, or high.

create like us in facebook

Page Level Targeting

You can also choose to show a Like Us On Facebook popup depending on specific visitor behavior. For example, if you have a blog post specifically about Facebook, you can use our advanced page level targeting to display the Facebook popup on that page.

To do that, select Where from the dropdown menu and select Page Targeting.

like us on facebook popup tutorial

Select current URL path and pair it with exactly matches. Enter the URL of the blog page you want the campaign to appear on:

like us on facebook popup tutorial

This targeting option will show the popup to the right visitors, increasing the chances that they’ll head over to your Facebook page and like it.

Make the Most of Like Us On Facebook Popup

That’s it! Now you can easily improve your Facebook page following with a high-converting Like Us On Facebook popup.

After creating your popup, you might also want to track clicks on the Facebook like box. OptinMonster can do that. Learn how to track conversion in an iFrame.

If you want to leverage social media to grow your business, you might like these posts:

Not using OptinMonster yet? Get started today and convert your social media followers into site visitors and customers!

Hi, I'm a writer and content marketer with 10+ years of experience. Over the years, I have helped several B2B SaaS brands grow their online presence and get more customers. At OptinMonster, I write about all things marketing — ranging from how-to guides to the best-of tools to help you improve your email marketing, lead generation, and website conversion campaigns.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. We only recommend products that we believe will add value to our readers.

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.