Add Simple CSS Popup Facebook Like Box Widget in Blogger Blog | FREE GADGET TECHNOLOGY FREE GADGET TECHNOLOGY : Add Simple CSS Popup Facebook Like Box Widget in Blogger Blog
Contact Us:

If You Have Any Problem, Wanna Help, Wanna Write Guest Post, Find Any Error Or Want To Give Us Feedback, Just Feel Free To Contact Us. We Will Reply You Soon.

Name: *


Email: *

Message: *


Skillblogger

LiveZilla Live Help

Monday, 17 March 2014

Add Simple CSS Popup Facebook Like Box Widget in Blogger Blog


CSS Popup Facebook Likebox
Now a days I am focusing on sharing social media widgets for blogger blogs. In last post I shared Mega Social Subscription Box and today I am going to share Pure CSS made, Simple and Beautiful Popup Facebook Likebox for Blogger. No JQuery is used in this widget, thats why this widget loads quickly while loading blog page. Popup Facebook Likebox of your Fanpage always appears to each and every visitor of your blog. It helps you to engage more and more people to your Facebook Fanpage by which you can boost up your blog traffic. By this Facebook Popup Widget you will  Get Likes Easily for Your Facebook Fanpage Page Because When visitors Came To Your Blog And Popup Will Automatically Show on The Homepage And Force The Visitors To Like Our Facebook Fan Page.


(See Demo Image Here)
Popup Facebook likebox for Blogger

How to Add Popup Facebook Likebox Widget in Blogger?

STEP-1: Login to your Blogger Dashboard.
STEP-2: Goto Layout tab.
STEP-3: Then Click on Add a Gadget option.
STEP-4: Select widget type as HTML/Javascript.
STEP-5: Now Paste Following coding inside it.
STEP-6: Then Click on Save and Enjoy!

<style type="text/css"> * html
#Bbt-css-popup-div { position:absolute; overflow:hidden;} #Bbt-css-popup-div { display:block; top:0px;
left:0px; width:100%; height:100%; position:fixed; background-color:none; margin:0; overflow-y:hidden;}
#Bbt-css-popup- { background-color: #fff; overflow:none; overflow:hidden;} .Bbt-css-popup- { width:333px;
overflow:hidden; height:370px; position:fixed; top:45%; left:50%; margin-top:-210px; margin-left:-200px; border: 10px solid
#999; padding: 20px;} </style> <!--[if lte IE 6]> <style type="text/css"> /*<![CDATA[*/ html {overflow-x:auto; overflow-
y:hidden;} /*]]>*/ </style> <![endif]--> <div id="Bbt-css-popup-div"> <div id="Bbt-css-popup-"
class="Bbt-css-popup-"> <center> <h3 class="title"> <img src="https://lh3.googleusercontent.com/-
y59ffB_1WgQ/Ua9mSc9idpI/AAAAAAAABEM/YZiBgEtgQe8/h117/fb0.png" /> </h3> </center> <center> <iframe
src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2F/pages/FGT/600465470030267&amp;
width=300&amp;colorscheme=light&amp; show_faces=true&amp; border_color=%23ffffff&amp; stream=false&amp;header=false&amp;
height=250" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:216px;"
allowtransparency="true"> </iframe> </center> <div style=" float:left; margin-left:0px; font-size:9px; cursor:pointer;" >
<a style=" font-size:9px; color:#3B78CD; text-decoration:none;" onmouseup="document.getElementById
('Bbt-css-popup-div') .style.display='none'"> <img src="https://lh6.googleusercontent.com/-BTm-WAqkztI/Ua9pgU-
16fI/AAAAAAAABEs/valx8qUqNV4/h120/exit.png"/> </a> </div> </div> </div>

Editing:

  • Just Replace /pages/FGT/600465470030267 with your Facebook Page Username.


Like the Post? Share with your Friends:-

Team SB
Posted By: Team SB

0 comments:

POST A COMMENT

Contact Us

Name

Email *

Message *

Premium Blogger Templates
 

Latest post

Enter your email address:

Delivered by FeedBurner

Copyright © . Free Gadget TechnologyBlogger. All Rights Reserved.
Designed by :-