How to Install a Facebook Popup Like Box With Cookie Support on Blogger or WordPress

How to Add a Cookie-Powered Facebook Popup Like Box to Blogger or WordPress If you’ve ever run a blog, you know how frustrating it can be to find a Facebook like box that drives engagement without annoying your readers. Most pre-made popups show up on every single page load, come with unskippable timers, or lack a clear close button—turning casual readers away instead of encouraging them to follow your Facebook page. That’s where this cookie-powered Facebook popup like box comes in. Unlike standard popups, this tool uses browser cookies to only show once every set number of days, includes a clean, easy-to-find close button, and uses a simple iframe design that’s easy to customize for any blog layout. This setup was first shared on Buka Rahasia Blogspot, and it’s become a fan favorite for bloggers who want to grow their social following without ruining their site’s user experience. Why This Popup Beats Standard Facebook Like Boxes Social media popups can boost your Facebook like count by 20-30% when used correctly, but only if they don’t feel intrusive. Many free popup tools force readers to wait 30+ seconds before they can close the popup, or show up mid-article, which breaks their reading flow. This popup solves all those issues: - It only appears once every X days, so returning visitors won’t be bombarded with the same prompt - It includes a prominent close button in the top-right corner, so readers can dismiss it instantly - It uses a lightweight Facebook iframe, so it won’t slow down your site’s load time - No extra plugins are required for WordPress, making it faster than using a premium social media widget Full Customizable Script for the Popup Below is the tested, ready-to-use script for the cookie-powered Facebook popup. Before you paste it into your blog, you’ll need to tweak a few key settings to match your site and Facebook page, which we’ll cover in the next section.

Key Customizations to Perfect the Popup Remove Duplicate jQuery (If Needed) If your blog already uses jQuery (which most modern Blogger and WordPress themes do), delete the first script tag that loads the Google jQuery CDN. This will prevent script conflicts that can break other site features. Adjust the Popup Delay Time The default `delay(20000)` sets the popup to appear 20 seconds after a visitor loads your page. This gives readers time to start reading your content before the prompt appears. For longer articles, increase this number to 30000 (30 seconds) to avoid interrupting their reading flow. Set Your Cookie Expiration Window The line `$.cookie('popup_user_login', 'yes', { path: '/', expires: 30 });` sets the cookie to expire after 30 days, meaning the same visitor will see the popup again once a month. You can adjust the `30` to change this window: set it to `1` to show the popup once per day, or remove the entire line if you want the popup to show up on every page load (not recommended, as it will annoy returning visitors). Add Your Facebook Page URL Find the iframe source line that starts with `src='//www.facebook.com/plugins/likebox.php? href= https://www.facebook.com/bukarahasiablogspot` and replace the default URL with your own Facebook page’s full URL. Tweak the Popup Styling You can edit the CSS in the script to match your site’s design. For example, change `background:rgba(0,0,0,0.8)` to adjust the opacity of the background overlay, or modify the `width` and `height` of `#burasbox` to change the size of the popup itself. Install the Popup on Your Site For Blogger Blogs 1. Go to your Blogger dashboard and click **Layout**. 2. Add a new **HTML/JavaScript** gadget, ideally placed in your footer or the lowest sidebar widget to avoid covering your site’s main content. 3. Paste your customized script into the gadget text box. 4. Save the gadget and test your site to make sure the popup works correctly. For WordPress Sites 1. Go to your WordPress dashboard and navigate to **Appearance > Widgets**. 2. Drag a **Text** widget into your footer or lowest sidebar area. 3. Paste your customized script into the text widget’s editor. 4. Save the widget and test your site to confirm the popup loads properly. Troubleshooting Common Issues - **Popup not appearing**: Check if you have duplicate jQuery loaded on your site, and remove the included CDN line if needed. - **Popup appears too often**: Double-check your cookie expiration setting to make sure it’s set to your desired window. - **Styling looks broken**: Adjust the CSS values in the script to match your site’s color scheme and layout. Source