How To Add Facebook Popup Like Box for Blogger.

Using A Facebook popup like box for your Blog will be  highly effective. The reason is that this blogger widget  boost your Facebook likes.

Looking at the way it works,  it is actually the best way to promote your Facebook business page.

By using this popup like box, you will be able to bring your Facebook fan page in front of your audience right after landing on your blog. For this reason, you might  have 1000 times better result in the case of getting Facebook likes, social activity, social engagement, followers and the overall social exposure.

Every blogger needs a unique design for their blog. In that case, this amazing facebook popup like box for blogger will generate a unique view to represent the fan page through a light box. Also, it contains some advanced features and functionality. Moreover, this lightweight widget will use jQuery cookie plugin to improve the User experience of your blog. That means this popup like box will not appear again and again for a single reader until 7 days.

Reason you have to use  Facebook Popup Like Box for your Blog.

Only creating good content is not enough for being a successful blogger. Social community, activity, promotion, and fans are a major part of blogging success. As a matter of fact, we can consider Facebook as the king of social Medias. Therefore, we must think to utilize this massive media with more than 1.3 billion users. Usually, smart bloggers add a Facebook like box widget to their blog’s sidebar.

In my opinion, it is a very common scenario for almost every blog. Obviously, it is a good practice to promote your Facebook fan page and get likes and followers. But this widget can’t draw the attention of every reader of a blog. For this reason, bloggers become smarter and start using floating Facebook like box widget with the previous one.

By using this widget, bloggers become successful in getting 80-90% readers attention. In fact, you will see thousands of blog out there, is using these two important widgets on their blog. But if we get the chance to have 100% readers attention, won’t it be amazing? All things considered, this Facebook popup like box for blogger can do that for you.

A huge reader attention means more Facebook likes. More Facebook like means huge social exposure, followers, and targeted traffic. If you analyze any popular blog, you will find a big amount of traffic they receive from Facebook. So you should also be smart and use this lightweight Facebook popup like box in your blogger blog.

Simple Steps to Add Facebook Popup Like Box in Blogger?

We have so far emphasis  the importance of this pretty widget. Now we will see how to add this facebook popup like box on our blog. Actually, adding this widget is an easy process. Only you have to follow my step by step instruction. Also, I will show you some basic configuration of this widget. So Let’s dig into details.

Step 1: Login to the Blogger account and go to the Dashboard > Layout section.

Step 2: Click on the “Add a Gadget” link in the footer or sidebar section. Remember, the recommended area to add this widget is the footer.

Step 3: After clicking on the “Add a Gadget” link, a popup window will appear. Select the “HTML/JavaScript” gadget from the list and click on it.

Step 4: Now copy the following Facebook popup like box code and paste it into the content area of the gadget as shown below.

<script src=’https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js’ type=’text/javascript’></script><style>#popupFbLikeBox {display:none;position:fixed;background:rgba(0,0,0,0.7);height:100%;width:100%;left:0;top:0;z-index:99999;}#popupArea {position:absolute;background:white;height:270px;width:auto;left:63%;top:58%;border-radius: 5px;margin:-220px 0 0 -375px;-moz-border-radius: 5px;-webkit-border-radius: 5px;}#popupClose{text-align:center;padding:10px;position:relative;cursor:pointer;background: linear-gradient(#eee, #fff);border-top-left-radius: 5px;border-top-right-radius: 5px;color:#000;}#popupClose:hover{color:red;}.fbLikeboxArea {margin:0 auto;width:366px;height:1px;margin-top:16px;margin-left:20px;position:relative;}@media only screen and (max-width: 500px) {#popupArea{left:63%;top:58%;margin:-220px 0 0 -250px;}.fb-like-box,.fb-like-box span,.fb-like-box span iframe[style]{width: 100% !important;}}</style><script>//<![CDATA[jQuery.cookie = function (key, value, options) {// set cookie…if (arguments.length > 1 && String(value) !== “[object Object]”) {options = jQuery.extend({}, options);if (value === null || value === undefined) {options.expires = -1;}if (typeof options.expires === ‘number’) {var days = options.expires, t = options.expires = new Date();t.setDate(t.getDate() + days);}value = String(value);return (document.cookie = [encodeURIComponent(key), ‘=’,options.raw ? value : encodeURIComponent(value),options.expires ? ‘; expires=’ + options.expires.toUTCString() : ”,options.path ? ‘; path=’ + options.path : ”,options.domain ? ‘; domain=’ + options.domain : ”,options.secure ? ‘; secure’ : ”].join(”));}//get cookie…options = value || {};var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;return (result = new RegExp(‘(?:^|; )’ + encodeURIComponent(key) + ‘=([^;]*)’).exec(document.cookie)) ? decode(result[1]) : null;};//]]></script><script>jQuery(document).ready(function($){if($.cookie(‘logedin_user’) != ‘yes’){$(‘#popupFbLikeBox’).delay(2000).fadeIn(‘medium’);$(‘#popupClose’).click(function(){$(‘#popupFbLikeBox’).stop().fadeOut(‘medium’);});}$.cookie(‘logedin_user’, ‘yes’, { path: ‘/’, expires: 7 });});</script><div id=’popupFbLikeBox’><div id=’popupArea’><div id=’popupClose’>CLOSE</div><div class=’fbLikeboxArea’></div><iframe allowtransparency=’true’ frameborder=’0′ scrolling=’no’ src=’//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/Techsfair/&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false’style=’border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;’></iframe></div></div>

 

Step 5: You must replace the above-highlighted URL with your own Facebook page Permalink. Finally, click on the “Save” button and visit your blog. Wait for few seconds to see the popup like box in action.

Note: If you don’t see the popup after waiting few seconds, please clear browser cookies. After that reload your blog.

Configuration:

Replace the highlighted URL with your own Facebook page URL (as shown above).

By default, the widget will appear after 2 seconds from the blog is fully loaded. If you wish, you can increase or decrease this time by changing the above-highlighted numbers. For example, you can put “delay(1000)” to show the popup like box after 1 second, “delay(5000)” for 5 seconds, “delay(10000)” for 10 seconds etc.

I hope you have added the widget successfully in your blog. This attractive Facebook popup like box for Blogger is tested and compatible with different web browsers. So you shouldn’t face any trouble in the entire process. However, you can leave a comment below for support or opinion. I am promising to get back to you very soon.

 

Leave a Reply

Your email address will not be published. Required fields are marked *