Floating/sticky Facebook Like Box, When Mouse Pointer Placed Over It Like Page Appear - Smart2Blogging

Latest

Sunday, 6 August 2017

Floating/sticky Facebook Like Box, When Mouse Pointer Placed Over It Like Page Appear

Facebook like box ke jariye hum apne apne traffic ko improve kar sakte hai. Waise aap facebook like box widget bhi use kar sakte hai but ye aapke blog me kafi area capture karti hai or perticular ek hi position par rahti hai. Agar facebook likebox ko aapke blog page par float kar diya jaye to aapke blog par area bhi bachega or jyada se jyada log aapke Facebook page ko like karenge..

Ye Floating Facebook Like Box Hota kya hai ?

Floating means aapke Facebook ek hi jagah par fixed rahega ya yu kahe ki ye aapke blog par stick ho jayega.. Jab bhi koi aapke page par koi visitor aayenge to aapka FB Like Box hamesa uske samne visible rahega

Kaise apne blog par Floating/sticky Facebook Like Box ko add kare ?

Step : 1 

1. Apne blogger dashboard par Layout par click kare
2. Add a Gadget par click kare

Step : 2


Jaise hi aap Add a Gadget par click karenge waise hi ek popup window open hoga , waha par HTML/JavaScript ko chose kare.

Step : 3

Yaha par aapko niche diye gaye koi bhi apne Floating/sticky Facebook Like Box code ko paste karna hai, Fir Save button par click karna hai....

NOTE : acchhibaat/ ko apne page id ke sath replace kare...

Style : 1

Code :

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script><script type="text/javascript">//<!--$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});//--></script><style type="text/css">.w2bslikebox{background: url("https://4.bp.blogspot.com/-BZ9BrslsmVU/WYd4e13jE2I/AAAAAAAACg4/RlNOaxacRqkRFcUCpaSd5Y45XIkZ0MnpQCLcBGAs/s1600/FacebookLogo1.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 300px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}.w2bslikebox div{background: url("https://4.bp.blogspot.com/-BZ9BrslsmVU/WYd4e13jE2I/AAAAAAAACg4/RlNOaxacRqkRFcUCpaSd5Y45XIkZ0MnpQCLcBGAs/s1600/FacebookLogo1.png")border:none;position:relative;display:block;}.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}.w2bslikebox span a{color: #808080;text-decoration:none;}.w2bslikebox span a:hover{text-decoration:underline;}</style><div class="w2bslikebox" style=""><div><a href="https://smart2blogging.blogspot.com/" rel="dofollow" target="_blank" title="Smart Blogging Tips"><img src="https://goo.gl/BjWUyD" alt="Smart Blogging Tips" border="0" style="position: fixed; bottom: 10%; right: 0px; top: 0px;" /><a href="https://smart2blogging.blogspot.com/" rel="dofollow" target="_blank" title="Blogging Smartly"><img src="https://goo.gl/BjWUyD" alt="Blogging Smartly" border="0" style="position: fixed; bottom: 0px; left: 0px;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/acchhibaat/&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 129px; width: 287px;padding-top: 214px;background-image: url(https://4.bp.blogspot.com/-VZEiTUqO_Zk/WYcL9QFOncI/AAAAAAAACd8/pHHpjz5-t80JMO6LUMoyX5zMhXEZ54YcgCPcBGAYYCw/s1600/facebookbackgrounf%2Blike%2Bbox.jpg);}"></iframe></div></div>

Style : 2


Code :

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script><script type="text/javascript">
//<!--$(document).ready(function() {$(".w2bslikebox").hover(function(){$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-400"}, "medium");}, 500);});//--></script><style type="text/css">.w2bslikebox{background: url("https://1.bp.blogspot.com/-BZ9BrslsmVU/WYd4e13jE2I/AAAAAAAACg8/JVmSLgJWyOEbPPmBq5zgOHebBrvM8KLJQCPcBGAYYCw/s1600/FacebookLogo1.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 395px;z-index:99999;position:fixed;right:-400px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<a href="https://smart2blogging.blogspot.com/" rel="dofollow" target="_blank" title="Smart Blogging Tips"><img src="https://goo.gl/BjWUyD" alt="Smart Blogging Tips" border="0" style="position: fixed; bottom: 10%; right: 0px; top: 0px;" /><a href="https://smart2blogging.blogspot.com/" rel="dofollow" target="_blank" title="Blogging Smartly"><img src="https://goo.gl/BjWUyD" alt="Blogging Smartly" border="0" style="position: fixed; bottom: 0px; left: 0px;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/acchhibaat/&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 262px; width: 315px;background:#fff;background-image: url(https://2.bp.blogspot.com/-RAnPlO-5HVk/WYeHnMpsFbI/AAAAAAAACh4/_3P9WHmxMmgSpmTKUayEF_VG79GX7vQRgCPcBGAYYCw/s1600/slidingfacebook.jpg);padding-top: 50px;padding-left: 84px;"></iframe></div></div>



No comments:

Post a Comment