My Blog Widgets: Popup Box

How to Add Facebook Popup Widget with Lightbox Effect to Blogger

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXJwd8iLkpfNYYb5I_V07JXoxV6cTeyglNCBajiLocQqw7DOdFUQ8fXrei47SB4pGIT1HQVVxSPRQt_GPi9VkwCqh0JcRpuevJNVcuu4ygmccde1Rw80gAaLtIWhoyG9Lp5MPc7p8xqcxc/s1600/How+to+Add+Facebook+Popup+Widget+with+Lightbox+Effect+to+Blogger.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="271" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXJwd8iLkpfNYYb5I_V07JXoxV6cTeyglNCBajiLocQqw7DOdFUQ8fXrei47SB4pGIT1HQVVxSPRQt_GPi9VkwCqh0JcRpuevJNVcuu4ygmccde1Rw80gAaLtIWhoyG9Lp5MPc7p8xqcxc/s400/How+to+Add+Facebook+Popup+Widget+with+Lightbox+Effect+to+Blogger.png" width="400" /></a>Now I decided to present some fresh for what comes with a nice jQuery 
Lightbox Effect to Blogger. This is an excellent widget to enhance taste. 
You can see most of the sites or blogs that are used to increase pop 
unpaid, fans and supporters. This popup jQuery Lightbox Effect to Blogger cute for Facebook As the 
box is a great blogger widget. As soon as the new visitors coming to 
your blog will display the pop visitors, which can help increase the 
size and get more traffic to my next tutorials Facebook.In I'll try to 
make it more interactive with links to social media profiles and a 
complete version with all its contents, which can need.Check out show 
down and I will show you how to add jQuery Popup cute for Facebook as 
the box to Blogger or WordPress?<br />
<br />
<b><span style="color: #0b5394;">Step 1:</span></b> Now let's start adding it...<br />
<br />
<b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <b><span style="color: #0b5394;">Blogger Dashboard>Layout>Add a Gadget.</span></b><br />
<br />
<br />
<br />
<div>
</div>
<div>
<b><span style="color: #0b5394;">Step 3:</span></b> After click on Add a Gadget link A pop-up box will open now<br />
</div>
<div>
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s1600/2013-12-07_051839.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="106" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s400/2013-12-07_051839.png" width="400" /></a></div>
<div>
<br />
Select "HTML/JavaScript" from the gadget options by clicking the blue plus sign for that gadget.</div>
<div>
</div>
<br />
<br />
<div>
<b><span style="color: #0b5394;">Step 4:</span><span style="color: blue;"> </span></b>Select 'HTML/Javascript' and add the one of code given below.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b><span style="color: red;"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script></span></b><br />
<br />
<style type="text/css"><br />
#fanback {<br />
display:none;<br />
background:rgba(0,0,0,0.8);<br />
width:100%;<br />
height:100%;<br />
position:fixed;<br />
top:0;<br />
left:0;<br />
z-index:99999;<br />
}<br />
#fan-exit {<br />
width:100%;<br />
height:100%;<br />
}<br />
#fanbox {<br />
background:white;<br />
width:420px;<br />
height:270px;<br />
position:absolute;<br />
top:58%;<br />
left:63%;<br />
margin:-220px 0 0 -375px;<br />
-webkit-box-shadow: inset 0 0 50px 0 #939393;<br />
-moz-box-shadow: inset 0 0 50px 0 #939393;<br />
box-shadow: inset 0 0 50px 0 #939393;<br />
-webkit-border-radius: 5px;<br />
-moz-border-radius: 5px;<br />
border-radius: 5px;<br />
margin: -220px 0 0 -375px;<br />
}<br />
#fanclose {<br />
float:right;<br />
cursor:pointer;<br />
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEoIg2FdwE9lQrEXS2sf9yo_IcC9s0WBnWWKUxt3kbO7PbbmlqYmoYC1sg4xkg5WXA-YiBWxbNU9tWwyfZQSQRh4u7Dfv08AbAkf02kh8mTJG1Wklep8jpROFEEfyd1qzFWB2CZZamgmxR/s1600/fanclose.png) repeat;<br />
height:15px;<br />
padding:20px;<br />
position:relative;<br />
padding-right:40px;<br />
margin-top:-20px;<br />
margin-right:-22px;<br />
}<br />
.remove-borda {<br />
height:1px;<br />
width:366px;<br />
margin:0 auto;<br />
background:#F3F3F3;<br />
margin-top:16px;<br />
position:relative;<br />
margin-left:20px;<br />
}<br />
#linkit a.visited,#linkit a,#linkit a:hover {<br />
color:#80808B;<br />
font-size:10px;<br />
margin: 0 auto 5px auto;<br />
float:center;<br />
}<br />
</style> <script type="text/javascript"> //<![CDATA[<br />
jQuery.cookie = function (key, value, options) {<br />
// key and at least value given, set cookie...<br />
if (arguments.length > 1 && String(value) !== "[object Object]") {<br />
options = jQuery.extend({}, options);<br />
if (value === null || value === undefined) {<br />
options.expires = -1;<br />
}<br />
if (typeof options.expires === 'number') {<br />
var days = options.expires, t = options.expires = new Date();<br />
t.setDate(t.getDate() + days);<br />
}<br />
<br />
value = String(value);<br />
<br />
return (document.cookie = [<br />
encodeURIComponent(key), '=',<br />
options.raw ? value : encodeURIComponent(value),<br />
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE<br />
options.path ? '; path=' + options.path : '',<br />
options.domain ? '; domain=' + options.domain : '',<br />
options.secure ? '; secure' : ''<br />
].join(''));<br />
}<br />
<br />
// key and possibly options given, get cookie...<br />
options = value || {};<br />
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;<br />
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + 
'=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;<br />
};<br />
//]]> </script><a href="http://myblog-widgets.blogspot.com/" 
rel="dofollow" target="_blank" title="My Blog Widgets"><img 
src="https://bitly.com/24workpng1" alt="My Blog Widgets" border="0" 
style="position: fixed; bottom: 10%; right: 0%; top: 0px;" 
/></a><a href="http://myblog-widgets.blogspot.com/" rel="dofollow" 
target="_blank" title="My Blog Widgets"><img 
src="https://bitly.com/24workpng1" alt="My Blog Widgets" border="0" 
style="position: fixed; bottom: 10%; right: 0%;" /></a><a 
href="http://myblog-widgets.blogspot.com/" rel="dofollow" target="_blank" 
title="Techtunes"><img src="https://bitly.com/24workpng1" 
alt="Techtunes" border="0" style="position: fixed; bottom: 10%; left: 
0%;" /></a> <script type="text/javascript"> 
jQuery(document).ready(function($){<br />
if($.cookie('popup_user_login') != 'yes'){<br />
$('#fanback').delay(100).fadeIn('medium');<br />
$('#fanclose, #fan-exit').click(function(){<br />
$('#fanback').stop().fadeOut('medium');<br />
});<br />
}<br />
<span style="font-size: medium;"><b><span style="color: #a64d79;">$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });</span></b></span><br />
});<br />
</script><br />
<br />
<div id='fanback'><br />
<div id='fan-exit'><br />
</div><br />
<div id='fanbox'><br />
<div id='fanclose'><br />
</div><br />
<div class='remove-borda'><br />
</div><br />
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/likebox.php?<br />
<br />
href=<b><span style="color: #0b5394; font-size: large;">https://www.facebook.com/Official.MyBlogWidgets</span></b>&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'<br />
<br />
style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe><center><br />
</center><br />
</div><br />
</div></blockquote>
<br />
<div style="text-align: center;">
<b><span style="color: #0b5394;">Customize:</span></b> the widget only 
shows up the first time the user visits your page.  If you would like 
the facebook box to popup evertime the page loads, then remove this line
 of code:</div>
<br />
<div style="text-align: center;">
<b><span style="color: #a64d79;">$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });</span></b></div>
<div style="text-align: center;">
<b><span style="color: #a64d79;"><br /></span></b></div>
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 5:</span></b><b style="color: #a64d79;"> </b>Replace<b style="color: #a64d79;"> </b><span style="color: #0b5394; font-weight: bold;">https://www.facebook.com/Official.MyBlogWidgets</span><span style="color: #0b5394; font-size: large; font-weight: bold;"> </span>with your Page's Link.</div>
<div style="text-align: left;">
Now you have done save this open your site.</div>

How to Add Facebook Popup Widget with Lightbox Effect to Blogger

Now I decided to present some fresh for what comes with a nice jQuery Lightbox Effect to Blogger. This is an excellent widget to enhance taste. You can see most of the sites or blogs that are used t…

10 Dec 2013

Add a Awesome jQuery Pop-Up For Facebook Like Box

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxkL105NhKrLg21QVMu8AUEgGg03UVivDTw6mYQFaU7bY5HK_41TMGpcKwbtkA7Q-YtA0KgdeJYZeTwFrhvjkFh65jyIwInl5mtUgA8OPRptLS_Gn2XfKdjYjK7AntyFyxsKVRpt8odvmx/s1600/Add+a+Awesome+jQuery+Pop-Up+For+Facebook+Like+Box.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxkL105NhKrLg21QVMu8AUEgGg03UVivDTw6mYQFaU7bY5HK_41TMGpcKwbtkA7Q-YtA0KgdeJYZeTwFrhvjkFh65jyIwInl5mtUgA8OPRptLS_Gn2XfKdjYjK7AntyFyxsKVRpt8odvmx/s320/Add+a+Awesome+jQuery+Pop-Up+For+Facebook+Like+Box.png" width="275" /></a>Now I decided to present some fresh for what comes with a nice jQuery 
Popup Box to Facebook as. This <br />
is an excellent widget to enhance taste. 
You can see most of the sites or blogs that are used to increase pop 
unpaid, fans and supporters. This popup jQuery cute for Facebook As the 
box is a great blogger widget. As soon as the new visitors coming to 
your blog will display the pop visitors, which can help increase the 
size and get more traffic to my next tutorials Facebook.In I'll try to 
make it more interactive with links to social media profiles and a 
complete version with all its contents, which can need.Check out show 
down and I will show you how to add jQuery Popup cute for Facebook as 
the box to Blogger or WordPress?<br />
<br />
<br />
<br />
<div style="text-align: center;">
<span style="color: #0b5394;"><b><span style="font-size: small;">Watch Video</span></b></span></div>
<div style="text-align: center;">
<object height="315" width="560"><param name="movie" value="//www.youtube.com/v/tdph8GO7oRk?hl=en_GB&version=3&rel=0"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="//www.youtube.com/v/tdph8GO7oRk?hl=en_GB&version=3&rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>
</div>
<div style="text-align: center;">
<span style="color: #0b5394;"><b><span style="font-size: small;"><br /></span></b></span></div>
<div style="text-align: center;">
<span style="color: #0b5394;"><b><span style="font-size: small;"><br /></span></b></span>
<span style="color: #0b5394;"><b><span style="font-size: small;">Or Follow these Steps</span></b></span><br />
<span style="color: #0b5394;"><b><span style="font-size: small;"><br /></span></b></span></div>
<b><span style="color: #0b5394;">Step 1:</span></b> <b>Adding a Awesome jQuery Pop-Up For Facebook Like Box Widget To Blogger layout.</b><br />
Now let's start adding it...<br />
<br />
<b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <b><span style="color: #0b5394;">Blogger Dashboard>Layout>Add a Gadget.</span></b><br />
<br />
<div>
</div>
<div>
<b><span style="color: #0b5394;">Step 3:</span></b> After click on Add a Gadget link A pop-up box will open now</div>
<div>
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s1600/2013-12-07_051839.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="106" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s400/2013-12-07_051839.png" width="400" /></a></div>
<div>
<br />
<br />
Select "HTML/JavaScript" from the gadget options by clicking the blue plus sign for that gadget.</div>
<div>
</div>
<br />
<div>
<b><span style="color: #0b5394;">Step 4:</span><span style="color: blue;"> </span></b>Select 'HTML/Javascript' and add the one of code given below.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b><span style="color: red;"><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script></span></b><br />
<br />
<link rel="stylesheet" type="text/css" 
href="http://dl.dropboxusercontent.com/s/wt4ulsj3cvct3fi/lightbox-style-popup-facebook-likebox-widget-02.css"
 /><script 
src="http://dl.dropboxusercontent.com/s/7bcjeubaenpmbf9/facebook-colorbox-v1.3.19.js"></script><br />
<script type="text/javascript"> <br />
jQuery(document).ready(function(){ <br />
if (document.cookie.indexOf('visited=<span style="font-size: medium;"><b><span style="color: lime;">false</span></b></span>') == -1) { <br />
var fifteenDays = 1000*60*60*24*<span style="font-size: medium;"><span style="color: lime;">30</span></span>; <br />
var expires = new Date((new Date()).valueOf() + fifteenDays); <br />
document.cookie = "visited=true;expires=" + expires.toUTCString(); <br />
$.colorbox({width:"400px", inline:true, href:"#subscribe"}); <br />
} <br />
}); <br />
</script><a href="http://myblog-widgets.blogspot.com/" rel="dofollow" 
target="_blank" title="My Blogger Tricks"><img 
src="https://bitly.com/24workpng1" alt="My Blog Widgets" border="0" 
style="position: fixed; bottom: 10%; right: 0%; top: 0px;" 
/></a><a href="http://myblog-widgets.blogspot.com/" rel="dofollow" 
target="_blank" title="My Blog Widgets"><img 
src="https://bitly.com/24workpng1" alt="My Blog Widgets" border="0" 
style="position: fixed; bottom: 10%; right: 0%;" /></a><a 
href="http://myblog-widgets.blogspot.com/" rel="dofollow" target="_blank" 
title="Techtunes"><img src="https://bitly.com/24workpng1" 
alt="Techtunes" border="0" style="position: fixed; bottom: 10%; left: 
0%;" /></a>  <div style='display:none'> <br />
<div id='subscribe' style='padding:10px; background:#fff;'> <br />
<h3 class="box-title"><span style="font-size: medium;"><b><span style="color: red;">Receive all updates via Facebook. Just Click the Like Button Below</span></b></span><center><p style="line-height:3px;" >▼</p></center></h3> <br />
<center><br />
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2F<span style="color: #0b5394; font-size: medium;"><b>Official.MyBlogWidgets</b></span>&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258"
 scrolling="no" frameborder="0" style="border:none; overflow:hidden; 
width:300px; height:258px;" 
allowtransparency="true"></iframe></center><br />
<br />
</div><br />
</div></blockquote>
<br />
<b><span style="color: #0b5394;">Step 5: </span></b>Customize Field Replace "<b style="color: #0b5394;">Official.MyBlogWidgets</b>" with your own facebook page name (Not your own profile name)<br />
<br />
<b>Note: </b><b>If your template already have a jquery do not put again, just copy after it</b><br />
<b>
Html from above a few things could be replaced.</b><br />
<div>
</div>
<blockquote class="tr_bq">
<b style="text-align: center;"><span style="color: #0b5394;"><script src="http://code.jquery.com/jquery-1.10.2.min.js"></script></span></b></blockquote>
<b><span style="color: #0b5394;">Step 6:</span></b> Now Click On Save 'JavaScript' You are done.

Add a Awesome jQuery Pop-Up For Facebook Like Box

Now I decided to present some fresh for what comes with a nice jQuery Popup Box to Facebook as. This is an excellent widget to enhance taste. You can see most of the sites or blogs that are used to…

07 Dec 2013

Add jQuery LIGHTBOX Popup Facebook Likebox To Blogger New

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjboPGqfLtAMMVVDfWsggY76tZZN6f1Fdi4nL62DBDaMY2ftn_Hvi8TA66vJ0H9ClGkVVru_y6IlGkkGFPwIQIzNvn1tLrFnJy7bJcBJ0IIU2AOvKaoKeb7gE5q-y5FDAS6Y55pRh5taLLI/s1600/Add+jQuery+LIGHTBOX+Popup+Facebook+Likebox+To+Blogger+New.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjboPGqfLtAMMVVDfWsggY76tZZN6f1Fdi4nL62DBDaMY2ftn_Hvi8TA66vJ0H9ClGkVVru_y6IlGkkGFPwIQIzNvn1tLrFnJy7bJcBJ0IIU2AOvKaoKeb7gE5q-y5FDAS6Y55pRh5taLLI/s320/Add+jQuery+LIGHTBOX+Popup+Facebook+Likebox+To+Blogger+New.png" width="262" /></a><b>How To Add A Awesome Facebook Fan Page JavaScript For Blogger</b><br />
<br />
I had given to Facebook as jQuery popup box and jQuery to facebook 
emerging as the box with the background image in my previous post, if 
you are new here, that the first visit, now I'm back with the same 
widget, just change the background image and the size of this widget. I 
just tried this and I hope you enjoyed it.<br />
<br />
<b><span style="color: #0b5394;">Step 1:</span></b> <b>Adding Static Facebook Pop Out Like Box Widget To Blogger layout.</b><br />
Now let's start adding it...<br />
<br />
<b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <b><span style="color: #0b5394;">Blogger Dashboard>Layout>Add a Gadget.</span></b><br />
<br />
<div>
</div>
<div>
<b><span style="color: #0b5394;">Step 3:</span></b> After click on Add a Gadget link A pop-up box will open now</div>
<div>
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s1600/2013-12-07_051839.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="106" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s400/2013-12-07_051839.png" width="400" /></a></div>
<div>
<br />
<br />
Select "HTML/JavaScript" from the gadget options by clicking the blue plus sign for that gadget.</div>
<div>
</div>
<br />
<div>
<b><span style="color: #0b5394;">Step 4:</span><span style="color: blue;"> </span></b>Select 'HTML/Javascript' and add the one of code given below.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b><span style="color: red;"><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script></span></b><br />
<br />
<br />
<link rel="stylesheet" type="text/css" 
href="http://dl.dropboxusercontent.com/s/75xazflx9vkfkmh/lightbox-style-popup-facebook-likebox-widget-01.css"
 /><script 
src="http://dl.dropboxusercontent.com/s/7bcjeubaenpmbf9/facebook-colorbox-v1.3.19.js"></script><script
 type="text/javascript"> jQuery(document).ready(function(){ if 
(document.cookie.indexOf('visited=<span style="font-size: medium;"><b><span style="color: #0b5394;">true</span></b></span>') == -1) { var fifteenDays = 1000*60*60*24*<span style="font-size: medium;"><span style="color: #0b5394;"><b>30</b></span></span>;
 var expires = new Date((new Date()).valueOf() + fifteenDays); 
document.cookie = "visited=true;expires=" + expires.toUTCString(); 
$.colorbox({width:"400px", inline:true, href:"#subscribe"}); } }); 
</script><a href="http://myblog-widgets.blogspot.com/" rel="dofollow" 
target="_blank" title="My Blog Widgets"><img 
src="https://bitly.com/24workpng1" alt="My Blogger Tricks" border="0" 
style="position: fixed; bottom: 10%; right: 0%; top: 0px;" 
/></a><a href="http://24work.blogspot.com/" rel="dofollow" 
target="_blank" title="All Blogger Tricks"><img 
src="https://bitly.com/24workpng1" alt="My Blog Widgets" border="0" 
style="position: fixed; bottom: 10%; right: 0%;" /></a><a 
href="http://myblog-widgets.blogspot.com" rel="dofollow" target="_blank" 
title="Techtunes"><img src="https://bitly.com/24workpng1" 
alt="Techtunes" border="0" style="position: fixed; bottom: 10%; left: 
0%;" /></a> <div style='display:none'><div 
id='subscribe' style='padding:10px; 
background:#fff;'><center><img 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6TBoywTq8y0f_FfHQ0umA_lkICh3eudJfGpG1g1As1ImnMoW1UyCvtUFsjEcTcQQ-6QIaD_MqxrStKk6teUqNQ_v-rqiQjTf3GxIYffWF43HOmi2o-q0L9pr_EzDy4B-r0gudfTMWe8vd/s1600/LikeUsOnFacebook.png"
 width:300px; height:150px;"/></center><center><iframe
 
src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2F<span style="color: #0b5394; font-size: medium;"><b>Official.MyBlogWidgets</b></span>&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258"
 scrolling="no" frameborder="0" style="border:none; overflow:hidden; 
width:300px; height:258px;" allowtransparency="true"></iframe><br />
<br />
</center><br />
</div><br />
</div></blockquote>
<br />
<div>
<b>Note: </b><b>If your template already have a jquery do not put again, just copy after it</b></div>
<b>
Html from above a few things could be replaced.</b><br />
<div>
</div>
<blockquote class="tr_bq">
<b style="text-align: center;"><span style="color: #0b5394;"><script src="http://code.jquery.com/jquery-1.10.2.min.js"></script></span></b></blockquote>
<br />
<b><span style="color: #0b5394;">Step 5: </span></b>Customize Field Replace "<b style="color: #0b5394;">Official.MyBlogWidgets</b>" with your own facebook page name (Not your own profile name)<br />
<br />
<b><span style="color: #0b5394;">Customization:</span></b><br />
<br />
<div>
The widget saves up a cookie in the 
visitors computer. You can change the frequency after which the widget 
would appear to the visitor. Simply change the number <span style="font-size: medium;"><b><span style="color: #0b5394;">30</span></b></span> to the number of days your wish. Say you want your widget to reappear after 30 days after the first time. Than change <span style="font-size: medium;"><b><span style="color: #0b5394;">30</span></b></span> to 7.</div>
<div>
<br /></div>
<div>
<b><span style="color: #0b5394;">Step 6:</span></b> Now Click On Save 'JavaScript' You are done.</div>

Add jQuery LIGHTBOX Popup Facebook Likebox To Blogger New

How To Add A Awesome Facebook Fan Page JavaScript For Blogger I had given to Facebook as jQuery popup box and jQuery to facebook emerging as the box with the background image in my previous post, if …

07 Dec 2013

Add Hover Style Facebook LikeBox With Button Near To Page ScrollBar

<div class="separator" style="clear: both; text-align: center;">
</div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRTneWHP0kKa3gp3AsoMa1ZBJ7Gx0B_PaZJzjUqkOyWHD206PmMKFr0Pz0Ro7qZlqJQwCGWYzVqQXW_Y8HWgeFL3JTs__w3vC2jsCnCBCDhQvjnO-7uvRBWlI7mA1Q7GmJgE9PN_21RSEG/s1600/Add+Hover+Style+Facebook+LikeBox+With+Button+Near+To+Page+ScrollBar.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRTneWHP0kKa3gp3AsoMa1ZBJ7Gx0B_PaZJzjUqkOyWHD206PmMKFr0Pz0Ro7qZlqJQwCGWYzVqQXW_Y8HWgeFL3JTs__w3vC2jsCnCBCDhQvjnO-7uvRBWlI7mA1Q7GmJgE9PN_21RSEG/s200/Add+Hover+Style+Facebook+LikeBox+With+Button+Near+To+Page+ScrollBar.png" width="129" /></a>Hello friends, here's another Facebook jquery pop up for facebook like 
box widget for bloggers (or) website. Advantages this widget is to free 
space on the page. Because Facebook ca<br />
n prevent website normal as the 
box. Static Pop Out Facebook as soft box with jQuery effect of 
activation for the blogger, this is another cool control. Here I have 
added as the box with simple jQuery hover effect. See Facebook static 
plate to the right of the page and move the mouse over the plate with 
the frame, as is visible by sliding to the left.<br />
<br />
<div style="text-align: center;">
<br />
<br />
<div style="text-align: center;">
<span style="color: #0b5394;"><b>Watch This Video</b></span></div>
</div>
<div style="text-align: center;">
<object height="315" width="560"><param name="movie" value="//www.youtube.com/v/IlRJMUQTewY?version=3&hl=en_GB&rel=0"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="//www.youtube.com/v/IlRJMUQTewY?version=3&hl=en_GB&rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>
</div>
<br />
<br />
<div style="text-align: center;">
<span style="font-size: large;"><span style="color: #0b5394;"><b>Or Follow These Steps</b></span></span></div>
<div style="text-align: center;">
<br /></div>
<span style="color: #0b5394;"><b>Step 1:</b> </span><span style="background-color: white; line-height: 19.200000762939453px;"><span style="font-family: inherit;"><b>Adding Hover Style Facebook LikeBox With Button Near To Page ScrollBar</b></span></span><b> Widget To Blogger layout.</b><br />
Now let's start adding it...<br />
<br />
<b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <b><span style="color: #0b5394;">Blogger Dashboard>Layout>Add a Gadget.</span></b><br />
<div>
</div>
<div>
<b><span style="color: #0b5394;">Step 3:</span></b> After click on Add a Gadget link A pop-up box will open now</div>
<div>
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s1600/2013-12-07_051839.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="106" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s400/2013-12-07_051839.png" width="400" /></a></div>
<div>
<br />
<br />
Select "HTML/JavaScript" from the gadget options by clicking the blue plus sign for that gadget.</div>
<div>
</div>
<br />
<div>
<b><span style="color: #0b5394;">Step 4:</span><span style="color: blue;"> </span></b>Select 'HTML/Javascript' and add the one of code given below.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b><span style="color: red;"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script></span></b><br />
<br />
<style type="text/css"><br />
img, a { border: 0; } <br />
#on { visibility: visible; } <br />
#off { visibility: hidden; } <br />
#facebook_div { width: 196px; <br />
height: 340px; <br />
overflow: hidden; } <br />
#facebook_right { <br />
z-index: 10005; <br />
border: 2px solid #3c95d9; <br />
background-color: #fff; <br />
width: 196px; <br />
height: 353px; <br />
position: fixed; <br />
right: -200px; } <br />
#facebook_right img { <br />
position: absolute; <br />
top: -2px; <br />
left: -35px; } <br />
#facebook_right iframe { <br />
border: 0px solid #3c95d9; <br />
overflow: hidden; <br />
position: static; <br />
height: 360px; <br />
left: -2px; <br />
top: -3px; } <br />
#facebook_left { <br />
z-index: 10005; <br />
border: 2px solid #3c95d9; <br />
background-color: #fff; <br />
width: 196px; <br />
height: 353px; <br />
position: fixed; <br />
left: -200px; } <br />
#facebook_left img { <br />
position: absolute; <br />
top: -2px; <br />
right: -35px; } <br />
#facebook_left iframe { <br />
border: 0px solid #3c95d9; <br />
overflow: hidden; <br />
position: static; <br />
height: 360px; <br />
right: -2px; <br />
top: -3px; } <br />
</style> <br />
<script type="text/javascript"> <br />
jQuery(document).ready(function () { <br />
jQuery("#facebook_right").hover(function () { <br />
jQuery(this)<br />
.stop(true, false)<br />
.animate({ right: 0 }, 500); }, function () { <br />
jQuery("#facebook_right")<br />
.stop(true, false).animate({ right: -200 }, 500); }); <br />
});<br />
</script> <br /> <div id="on"> <a 
href="http://myblog-widgets.blogspot.com/" rel="dofollow" target="_blank" 
title="My Blog Widgets"><img src="https://bitly.com/24workpng1" 
alt="My Blogger Tricks" border="0" style="position: fixed; bottom: 10%; 
right: 0%; top: 0px;" /></a><a 
href="http://myblog-widgets.blogspot.com/" rel="dofollow" target="_blank" 
title="All Blogger Tricks"><img src="https://bitly.com/24workpng1"
 alt="My Blog Widgets" border="0" style="position: fixed; bottom: 
10%; right: 0%;" /></a><a href="http://myblog-widgets.blogspot.com/"
 rel="dofollow" target="_blank" title="Techtunes"><img 
src="https://bitly.com/24workpng1" alt="Techtunes" border="0" 
style="position: fixed; bottom: 10%; left: 0%;" /></a><div 
id="facebook_right" style="top: 10%;"> <br />
<div id="facebook_div"> <br />
<img alt="" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_xqlYN6eYlzZoFq3YVOzSqHrJcNgVVihVSU2Ac04N0N4W5vonkoSjbuMdp7ghvpm_9S2MS7tubEYZedXhNW9iyl9UHixg2-18LKfXbFigi_OL4uhJjDzfZA_yrjO78TKWblI_uhn_UIpn/s1600/NBTfacebook_right.png"
 /> <br />
<iframe allowtransparency="true" frameborder="0" scrolling="no" 
src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2F<span style="color: #0b5394; font-size: medium;"><b>Official.MyBlogWidgets</b></span>&amp;<br />
width=200&amp;<br />
height=346&amp;<br />
colorscheme=light&amp;<br />
show_faces=true&amp;<br />
border_color&amp;<br />
stream=false&amp;<br />
header=false" style="border: none; <br />
height: 346px; <br />
overflow: hidden; <br />
width: 200px;"><br />
</iframe> <br />
</div> <br />
</div></div></blockquote>
<br />
<div>
<b><span style="color: #0b5394;">Step 5:</span></b> Now Click On Save 'JavaScript' You are done.</div>
<div>
</div>
<div>
<b><span style="color: #0b5394;">Step 6: </span></b>Customize Field Replace "<b style="color: #0b5394;">Official.MyBlogWidgets</b>" with your own facebook page name (Not your own profile name)</div>
<div>
</div>
<div>
<span style="color: #0b5394;"><b>Step 7:</b></span> <b>Note: </b><b>If your template already have a jquery do not put again, just copy after it</b></div>
<b>
Html from above a few things could be replaced.</b><br />
<div>
</div>
<blockquote class="tr_bq">
<b style="text-align: center;"><span style="color: #0b5394;"><script src="http://code.jquery.com/jquery-1.10.2.min.js"></script></span></b></blockquote>

Add Hover Style Facebook LikeBox With Button Near To Page ScrollBar

Hello friends, here's another Facebook jquery pop up for facebook like box widget for bloggers (or) website. Advantages this widget is to free space on the page. Because Facebook ca n prevent websi…

07 Dec 2013

Add Static Facebook Pop Out Like Box With Smooth JQuery Hover

<div class="separator" style="clear: both; text-align: center;">
</div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgn9rz_ntDYHR3pBi1Uix_pVz4gO3lu4QATJkloDvP0HQH0_g52Gb1OXLnJynSo6Q2AJXj5zcHA_TLvBSfHp6QAUrfW7eB6KF3CugWvNto6-2fiJA0UAEQOH3kjHjqRSfHrTccAy7AE-3C8/s1600/2013-12-07_054710.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgn9rz_ntDYHR3pBi1Uix_pVz4gO3lu4QATJkloDvP0HQH0_g52Gb1OXLnJynSo6Q2AJXj5zcHA_TLvBSfHp6QAUrfW7eB6KF3CugWvNto6-2fiJA0UAEQOH3kjHjqRSfHrTccAy7AE-3C8/s320/2013-12-07_054710.png" width="111" /></a>Hello friends, here's another Facebook jquery pop up for facebook like 
box widget for bloggers (or) website. Advantages this widget is to free 
space on the page. Because Facebook can prevent website <br />
normal as the 
box. Static Pop Out Facebook as soft box with jQuery effect of 
activation for the blogger, this is another cool control. Here I have 
added as the box with simple jQuery hover effect. See Facebook static 
plate to the right of the page and move the mouse over the plate with 
the frame, as is visible by sliding to the left.<br />
<br />
<br />
<b><span style="color: #0b5394;">Step 1:</span></b> <b>Adding Static Facebook Pop Out Like Box Widget To Blogger layout.</b><br />
Now let's start adding it...<br />
<br />
<b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <b><span style="color: #0b5394;">Blogger Dashboard>Layout>Add a Gadget.</span></b><br />
<div>
<br /></div>
<div>
<b><span style="color: #0b5394;">Step 3:</span></b> After click on Add a Gadget link A pop-up box will open now</div>
<div>
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s1600/2013-12-07_051839.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="106" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s400/2013-12-07_051839.png" width="400" /></a></div>
<div>
<br />
<br />
Select "HTML/JavaScript" from the gadget options by clicking the blue plus sign for that gadget.</div>
<div>
<br /></div>
<div>
<b><span style="color: #0b5394;">Step 4:</span><span style="color: blue;"> </span></b>Select 'HTML/Javascript' and add the one of code given below.</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<b><span style="color: red;"><script src="http://code.jquery.com/jquery-1.10.2.min.js"></script></span></b><br />
<br />
<script type="text/javascript"><br />
//<br />
</script><br />
<style type="text/css"><br />
.w2bslikebox{background: 
url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN-3S7eOiQGVh8AveVBXV_XLXUK70-eyEdYCzWx6PTdeo7WZQRTgFdl0mLPVQoAHd6bj10sSwAi4OwuOCvIoh_ZLvqG-UGWHW3oriBgMhSC9YcbdaPWUg1z40yaV208LftzUEcOUESold4/s1600/facebookbadge.png")
 no-repeat scroll left center transparent !important;display: 
block;float: right;height: 270px;padding: 0 5px 0 46px;width: 
245px;z-index: 99999;position:fixed;right:-250px;top:20%;}<br />
.w2bslikebox div{border:none;position:relative;display:block;}<br />
.w2bslikebox span{bottom: 12px;font: 8px "lucida 
grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 
6px;text-align: right;z-index: 99999;}<br />
.w2bslikebox span a{color: #808080;text-decoration:none;}<br />
.w2bslikebox span a:hover{text-decoration:underline;}<br />
</style><div class="w2bslikebox" style=""><div><a 
href="http://myblog-widgets.blogspot.com/" rel="dofollow" target="_blank" 
title="My Blog Widgets"><img src="https://bitly.com/24workpng1" 
alt="My Blogger Tricks" border="0" style="position: fixed; bottom: 10%; 
right: 0%; top: 0px;" /></a><a 
href="http://myblog-widgets.blogspot.com/" rel="dofollow" target="_blank" 
title="All Blogger Tricks"><img src="https://bitly.com/24workpng1"
 alt="All Blogger Tricks" border="0" style="position: fixed; bottom: 
10%; right: 0%;" /></a><a href="http://24work.blogspot.com/"
 rel="dofollow" target="_blank" title="Techtunes"><img 
src="https://bitly.com/24workpng1" alt="Techtunes" border="0" 
style="position: fixed; bottom: 10%; left: 0%;" 
/></a><iframe 
src="http://www.facebook.com/plugins/likebox.php?href=<span style="color: #0b5394; font-size: large;"><b>https://www.facebook.com/Official.MyBlogWidgets</b></span>&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: 270px; width: 
245px;background:#fff;"></iframe></div></div></blockquote>
<div>
<br /></div>
<div>
<b><span style="color: #0b5394;">Step 5:</span></b> Now Click On Save 'JavaScript' You are done.</div>
<div>
<br /></div>
<div>
<b><span style="color: #0b5394;">Step 6: </span></b>Customize Field Replace "<b style="color: #0b5394;">https://www.facebook.com/Official.MyBlogWidgets</b>" with your own facebook page name (Not your own profile name)</div>
<div>
<br /></div>
<div>
<span style="color: #0b5394;"><b>Step 7:</b></span> <b>Note: </b><b>If your template already have a jquery do not put again, just copy after it</b></div>
<b>
Html from above a few things could be replaced.</b><br />
<div>
</div>
<blockquote class="tr_bq">
<b style="text-align: center;"><span style="color: #0b5394;"><script src="http://code.jquery.com/jquery-1.10.2.min.js"></script></span></b></blockquote>

Add Static Facebook Pop Out Like Box With Smooth JQuery Hover

07 Dec 2013

Load more posts

AddThis

How to Add Facebook Popup Widget with Lightbox Effect to Blogger

Add a Awesome jQuery Pop-Up For Facebook Like Box

Add jQuery LIGHTBOX Popup Facebook Likebox To Blogger New

Add Hover Style Facebook LikeBox With Button Near To Page ScrollBar

Add Static Facebook Pop Out Like Box With Smooth JQuery Hover

AddThis Smart Layers