๐Ÿ‘ How to Add a Facebook Like Popup Box Widget on Blogger

Want to grow your blog’s Facebook followers without being too pushy?

Adding a Facebook Like Popup Box to your Blogger site is a great way to gently encourage readers to follow your page while they’re still engaged with your content. ๐Ÿ’™

Here’s an easy step-by-step tutorial to get it done—even if you’re not tech-savvy!


๐Ÿ› ️ What You’ll Need:

  • Your Facebook Page URL
  • Access to your Blogger dashboard
  • A few minutes of time ⏱️

Step-by-Step: Add Facebook Like Popup Box to Blogger

๐Ÿ”น Step 1: Generate Your Facebook Like Box Code

  1. Go to the Facebook Page Plugin Generator
  2. Enter your Facebook Page URL
  3. Customize the settings:
    • Width: 340
    • Height: 500
    • Uncheck: "Show Friends' Faces" (optional)
    • Check: "Adapt to plugin container width"
    • Check: "Show Cover Photo"
  4. Click Get Code
  5. Choose the “IFrame” tab and copy the entire code

๐Ÿ”น Step 2: Add the Code to Blogger as a Popup

  1. Go to your Blogger Dashboard
  2. Click on Theme → Customize → Edit HTML
  3. Scroll down and paste the following popup code just before the </body> tag:
 <!-- Facebook Like Popup -->
<div id="fb-popup" style="display:none; position:fixed; width:350px; height:500px; top:20%; left:50%; transform:translateX(-50%); background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.3); z-index:9999; padding:10px;">
  <span onclick="document.getElementById('fb-popup').style.display='none'" style="cursor:pointer; float:right; font-size:20px;">&times;</span>
  <iframe src="https://www.facebook.com/plugins/page.php?href=YOUR-FB-PAGE-URL&tabs&width=340&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId"
          width="340" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowfullscreen="true"
          allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"></iframe>
</div>

<script>
  window.onload = function(){
    setTimeout(function(){document.getElementById('fb-popup').style.display = "block";}, 8000); // Delay in milliseconds (8000 = 8 seconds)};</script>
 

๐Ÿšจ Important: Replace YOUR-FB-PAGE-URL with your actual Facebook Page link.


๐Ÿ’ก Tips for Better Engagement

Delay the popup (8–10 seconds) so it doesn’t annoy users
Customize the popup design to match your blogs theme
Use sparinglydon't show it too frequently or on every page load


๐Ÿ“ฃ Adding a Facebook Like Popup Box is a quick, effective way to promote your Facebook page while visitors are already enjoying your content. Just be mindful of timing and design to keep it user-friendly!

๐Ÿงก I’ve used this trick on my blog, and it helped boost my FB page likes naturally—without any ads.


๐Ÿš€ Try this tip today and turn your blog visitors into loyal Facebook fans in just a few clicks! 

0 Comments:

Post a Comment

Thank you for reading! Please share and like my Facebook page :)

 
Unless otherwise stated, Lakwatserang Ligaw is the legal copyright owner of all materials on this site © | Template by Ipietoon Cute Blog Design