Stylish Facebook Popup Like Box Widget For Blogger

Leave a Comment




facebook popup like box widget with light box effect.

As you all know social media plays vital role in setting up your blog on blogosphere. Social media plays really an important role in increasing your blog's traffic, improving off page SEO etc.

So, that's why in today's post we will talk about facebook or how to get more traffic from facebook by just adding facebook popup display like box on your blog.

Facebook is the leading social media company having 1.5+ billion users (increasing day by day) from which 800+ million people logs in daily. So, just think once how much traffic you gonna get from facebook for free.


facebook popup like box widget

Facebook also have paid ad feature. Which charges from $0.25 - $10 per like it depends. So, just think if you wanted to purchase 10 likes, you may be charged $10 - $100. But what it I teach you to get total organic likes for free. For this you do not have to do anything, except copy and paste.

I have created facebook popup like box widget which displays to your visitor whenever they visit to your blog. So interested people will eventually like your blog page and you're saving advertisement money. Isn't it cool ?

You can also add awesome floating facebook like box widget on your blog or popup for facebook like box with timer.

Some cool facebook posts your must wanted to read,

Before moving a head I just wanted you to read below stuff to create organic backlinks from facebook and other social media sites. Backlinks are the links coming from others blog on your blog. So, this is important too, if you wanted to improve your blog's traffic.
So, now lets quickly see,


How To Add Facebook Popup Like Box Widget :


The look you have already seen in the above snap shot. So, let directly move to the implementation part. 

Step 1 :- Go to blogger.
I recommend you to take backup of your blogger template before making any change into your current template.

Step 2 :- Go to layout.
  • Blogger dashboard >> layout >> Add a gadget.
Step 3 :- Now select HTML/JavaScript.
Look at the snap shot below.


facebook popup like box widget


Step 4 :- Copy and paste the below mentioned code.



Step 5 :- Change solvemyhow facebook page url with yours.
Find the comment,

<!-- ---------------------------------- Set Facebook Page ------------------------------------------------------ -->

<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
href=https://www.facebook.com/Solve-My-How-224381897766657&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'
style='border: none; overflow: hidden; background: #fff; width: 339px; height: 200px;'></iframe>

<!-- ---------------------------------- Set Facebook Page Ends ------------------------------------------------------ -->

 

Now change the highlighted part with your specific page url.

Step 6 :- Change the delay time.
This popup widget will appear after 10 seconds, when your blog/website is fully loaded. If you wanted to make any changes into the timer then find the comment,

<!-- ---------------------------------- Set delay time ------------------------------------------------------ -->

jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#fbox-background').delay(10000).fadeIn('medium');
$('#fbox-button, #fbox-close').click(function(){
$('#fbox-background').stop().fadeOut('medium');
});
}

<!-- ---------------------------------- Set delay time Ends------------------------------------------------------ -->
 

Now, look at the highlighted part. Here 10000 means after 10 seconds. You can make it less or more according to your own choice.

Step 7 :- Setting up the cookie.
Here the popup will display only once to the visitor whenever he/she visits any page or post of your blog. But instead, if you want that the popup will display every time when the new page/post is loaded. Then you have remove the below mentined code. So find the comment,
 
<!-- ---------------------------------- Set Cookies ------------------------------------------------------ -->

$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });

<!-- ---------------------------------- Set Cookies Ends ------------------------------------------------------ -->
 


Just remove the highlighted part of code. 

Step 8 :- Save the widget and visit your blog.
Now after 10 seconds you will see facebook popup widget. If it haven't displayed to you after 10 seconds then you have to delete your browser cookies. Just run Ccleaner software once (or you can delete manually) and restart your browser.

That's it. You're done now. This will sure increase you facebook fan following which is certainly an important parameter, if your wanted to increase your blog's traffic.

If you are the regular reader of solvemyhow then you might know the importance maintaining mailing list. You must collect email id's of your visitors so lately you can turn them into your readers. This is also an important thing which you must implement on your blog. Below mentioned tutorials will guide you to do so,

So, this was all about how to add facebook popup like box widget. I tried to explain this tutorial in simple steps. Hope you found this tutorial informative and worth reading. To code these type of widgets, it really requires hardwork and coding skills. So please do appreciate the work by sharing this tutorial with your social media friends. You can also subscribe for solvemyhow newsletter to get latest updates about blogging widgets, SEO, hacking right into your inbox.

Found this tutorial interesting ? Then why not help by shooting those social media buttons on your left side. After all "sharing is caring" right :)  


Also See :-

How to Hack Wifi Password in 2 Minutes

How to Get Unlimited Chips in Teen Patti

How To Hack WIFI Password Using Android Phone

Add Facebook Comments Box Plugin To Blogger Blogs - Latest !

How to Change Facebook Login Page With Your Photo

How To Create Social Content Locker In Blogger Blogs

Top 10 Best Android Games You Must Have In Your Phone

Complete Guide To Add Author Bio Box/Widget In Blogger (With Pictures)

0 comments:

Post a Comment