My Blog Widgets: Blogger Widgets

Google+ Followers Widget Generator For Blogger | Wordpress | Website

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirzENCQ7WW-MCQMTtQp7ZYtl9plu9B07RYE3bpKW8dKYN_55RFMG1dP1TL43pHzPCnOip0k3V9T3hiGG9UKbSw-qAg1JKiatc4BVyu9pchaEyHIqup8jo6JgKA6pbXaojzbpbt2u866SOg/s1600/Generate+Google++Followers+Widget+For+WebsiteBloggerWordpress.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirzENCQ7WW-MCQMTtQp7ZYtl9plu9B07RYE3bpKW8dKYN_55RFMG1dP1TL43pHzPCnOip0k3V9T3hiGG9UKbSw-qAg1JKiatc4BVyu9pchaEyHIqup8jo6JgKA6pbXaojzbpbt2u866SOg/s1600/Generate+Google++Followers+Widget+For+WebsiteBloggerWordpress.jpg" width="315" /></a></div>
<h4>
<span style="font-family: inherit; font-weight: normal;">Recently Google has introduced new Google plus follower widget that 
allow website/blog owners to attract new readers, as well as provides 
facilities to facility to visitors to stay connect with the 
website/blog. Google + is also a product of a Google. As a social 
networking website authors are creating there website/blog pages on it. 
Google plus is not just a social networking website but also its allows authorship program
 that use to blog owners to display images in search engines below link.
 This gadget will highlights total followers and offers audience to 
follow you on Google+. and hence with the media of google plus you will 
be able grow your blog traffic.</span></h4>
<div>
<span style="font-family: inherit; font-weight: normal;"><br /></span></div>
<h4>
<span style="color: #134f5c;">How To Add It On Blogger Blog?</span></h4>
<b>Step 1:</b> <b>Loging</b> in to your blogger account.<br />
<b>Step 2:</b> Go To <b>Layout</b> > click on <b>Add New Gadget</b><br />
<b>Step 3:</b> Click on <b>HTML/JavaScript </b>link<br />
<b>Step 3:</b> <b>Generate your widget code</b> from above generator.<br />
<b>Step 4:</b> <b>Copy and paste </b>generated code<b> code in to HTML/JavaScript</b>.<br />
<b>Step 5:</b> <b>Save</b> and arrange layout according to your requirement. That set.<br />
<br />
<center>
<iframe frameborder="0" height="600px" scrolling="no" src="https://dl.dropboxusercontent.com/s/2vkjsp0we0gu9c0/Online%20Google%20Plus%20Follower%20Widget%20Generator%20by%20My%20Blog%20Widgets.htm" width="730px"></iframe></center>
<h4>
Feed Back</h4>
<div style="text-align: center;">
</div>
Share your valuable feed back with us or you having any kind of query than comment it below i will glad to help you.

Google+ Followers Widget Generator For Blogger | Wordpress | Website

Recently Google has introduced new Google plus follower widget that allow website/blog owners to attract new readers, as well as provide...

How to Add Stylish & Attractive "Advertise Here" Widget for Blogger

<span id="5316528554514960520">Hello My Dear Readers today i will give you a nice and atrractive advertise here widget
 for sidebar it's very Good Widget and it's easy to customize,it's 
totally built in CSS and Jquery. Every one is makes blog for earning 
some money but when you fail to make money from your Blog through any 
advertising site then it's better for you to atract advertisers and i 
hope you all get new advertisers for your website and soon you will 
began to Make a Dashing amount of money.</span><span id="5316528554514960520"> </span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgazRIQVR5B-bjZWd3JICk5QSXY1sZdf_FUxEiAg7tuKX54cTUN-EgOZNiGdRBSw3fo0_ixxHTEfMBemU5reVCFpzFDpe0jk9mkYGR0Bpkd40R4mD3tULbfSKMUH-k1al6BHet4o3TICMKd/s1600/Stylish+&+Attractive+Advertise+Here+Widget+for+Blogs.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="289" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgazRIQVR5B-bjZWd3JICk5QSXY1sZdf_FUxEiAg7tuKX54cTUN-EgOZNiGdRBSw3fo0_ixxHTEfMBemU5reVCFpzFDpe0jk9mkYGR0Bpkd40R4mD3tULbfSKMUH-k1al6BHet4o3TICMKd/s320/Stylish+&+Attractive+Advertise+Here+Widget+for+Blogs.gif" width="320" /></a></div>
<br />
<span id="5316528554514960520"><b><span style="color: #0b5394;"><span style="font-size: small;">Follow these Steps:</span></span></b></span><br />
<span id="5316528554514960520"><span style="font-size: small;"><span style="color: #0b5394;"><b> </b></span></span></span><b><span style="color: #0b5394;"> </span></b><br />
<b><span style="color: #0b5394;">Step 1:</span></b> <b>Adding Stylish & Attractive "Advertise Here" Widget for Blogs.</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 />
<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" 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>
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>Add the one of code given below.</div>
<span id="5316528554514960520"><span style="font-size: small;"><span style="color: #0b5394;"><b><span id="5316528554514960520"></span></b></span></span></span><br />
<blockquote class="tr_bq">
<span style="font-size: small;"><b>
<span style="font-weight: normal;"><span style="color: black;"><span style="font-family: inherit;"><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;"><style>
 #F4U-ads img { margin: 0px 8px 4px 0px; padding: 3px; text-align: 
center; border: 3px solid #c0c0c0; -webkit-border-radius:70px; 
-moz-border-radius:70px; -o-border-radius:70px; border-radius:70px; 
-webkit-transition: all 0.45s ease-out; -moz-transition: all 0.45s 
ease-out; -o-transition: all 0.45s ease-out; transition: all 0.45s 
ease-out; } #F4U-ads img:hover { margin: 0px 8px 4px 0px; padding: 3px; 
text-align: center; border: 3px solid red; -webkit-border-radius:0px; 
-moz-border-radius:0px; -o-border-radius:0px; border-radius:0px; } 
</style></span><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;"> <div
 id="F4U-ads" align="left"> <table border="0"  cellpadding="2" 
cellspacing="6" width="265" bgcolor="#fff"><tbody> <tr> 
<td> <center> </span><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;"><a href="<span style="background-color: red;"><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;">Advertiser URL</span></span>" rel="nofollow"> <img border="0" alt="<span style="background-color: orange;"><b><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;">AD DESCRIPTION</span></b></span>" width="125" src="<span style="background-color: lime;"><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwXzL3HXe6arTmVkOzP3IrZCEwPuekeL87EkAEUrfON_g-joHyiQ0rAN0t1-MOFm40o8amqmaetNT0dLtILqXGvuPx6DYLWe7xyqVU_4rz8xppZQ_MS-Z7n5p1x5VcFsFyPB9MLh03v2d4/s1600/advertise+here.png</span></span>" height="125"/></a> </center> </td> <td> <center> </span><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;"><a
 href="Advertiser URL 2" rel="nofollow"> <img border="0" alt="AD 
DESCRIPTION" width="125" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwXzL3HXe6arTmVkOzP3IrZCEwPuekeL87EkAEUrfON_g-joHyiQ0rAN0t1-MOFm40o8amqmaetNT0dLtILqXGvuPx6DYLWe7xyqVU_4rz8xppZQ_MS-Z7n5p1x5VcFsFyPB9MLh03v2d4/s1600/advertise+here.png"
 height="125"/></a> </center> </td> </tr> 
<tr> <td> <center> </span><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;"><a
 href="ADVERTISER URL 3" rel="nofollow"><img border="0" alt="AD 
DESCRIPTION" width="125" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwXzL3HXe6arTmVkOzP3IrZCEwPuekeL87EkAEUrfON_g-joHyiQ0rAN0t1-MOFm40o8amqmaetNT0dLtILqXGvuPx6DYLWe7xyqVU_4rz8xppZQ_MS-Z7n5p1x5VcFsFyPB9MLh03v2d4/s1600/advertise+here.png"
 height="125"/></a> </center> </td> <td> 
<center> </span><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;"><a
 href="ADVERTISER URL 4" rel="nofollow"> <img border="0" alt="AD 
DESCRIPTION" width="125" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwXzL3HXe6arTmVkOzP3IrZCEwPuekeL87EkAEUrfON_g-joHyiQ0rAN0t1-MOFm40o8amqmaetNT0dLtILqXGvuPx6DYLWe7xyqVU_4rz8xppZQ_MS-Z7n5p1x5VcFsFyPB9MLh03v2d4/s1600/advertise+here.png"
 height="125"/></a> </center> </td> </tr> 
</tbody> </table> </div></span></span></span></span></b></span></blockquote>
<br />
<div style="background-color: white; color: #464646; font-family: Lora, serif; font-size: 14px; line-height: 21px;">
<span style="font-size: small;"><b>
<span style="font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif; list-style: none; margin: 0px; outline: none; padding: 0px;">Replace <span style="background-color: red;"><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;">            </span></span> To Your Advertising Url</span></b></span></div>
<span style="font-size: small;"><b>
</b></span>
<div style="background-color: white; color: #464646; font-family: Lora, serif; font-size: 14px; line-height: 21px;">
<span style="font-size: small;"><b><span style="font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif; list-style: none; margin: 0px; outline: none; padding: 0px;">Replace <span style="background-color: orange;"><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;">            </span></span> To Ad Description</span></b></span></div>
<span style="font-size: small;"><b>
<div style="background-color: white; color: #464646; font-family: Lora,serif; line-height: 21px;">
<span style="font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif; list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;">Replace <span style="color: lime;"><span style="background-color: #741b47;"><span style="background-color: lime;"><span style="color: black;"><span style="list-style: none outside none; margin: 0px; outline: medium none; padding: 0px;">            </span></span></span></span></span>  With Your Image Link</span></div>
<br /><span id="5316528554514960520">
Final Words</span><b><span style="font-weight: normal;"><br /><span id="5316528554514960520">
<span style="color: black;">If  you like it then please Share your views using comment box in future
 we will introduce more Widgets like this. Happy Earning.....</span></span></span></b><br /><span id="5316528554514960520">
</span></b></span><span id="5316528554514960520"><span style="font-size: small;"><span style="color: #0b5394;"><b><span id="5316528554514960520"></span></b></span></span></span>

How to Add Stylish & Attractive "Advertise Here" Widget for Blogger

Hello My Dear Readers today i will give you a nice and atrractive advertise here widget for sidebar it's very Good Widget and it's ...

How to Add Meta Tags for Each Post in Blogger V2

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9G4MQYKTgmaRKANHLrckotUQhXIRqWFDG6jHrysEeNDi1_rtJy37wcNSHTFUckBJb9SFH5Qh1GvnDteYSP9WRx0-FeYsPiT7CNOuGW3CrNFWFadgFj2z_qZJAcahIz1DZaorw575wH5o3/s1600/How+to+Add+Meta+Tags+for+Each+Post+V2.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="312" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9G4MQYKTgmaRKANHLrckotUQhXIRqWFDG6jHrysEeNDi1_rtJy37wcNSHTFUckBJb9SFH5Qh1GvnDteYSP9WRx0-FeYsPiT7CNOuGW3CrNFWFadgFj2z_qZJAcahIz1DZaorw575wH5o3/s640/How+to+Add+Meta+Tags+for+Each+Post+V2.jpg" width="640" /></a></div>
<span style="font-size: small;"><span style="font-family: inherit;">As we 
all know that Meta Tags are very important for every single website in 
blogger and not also fr blogger it's also very important in every kind 
of website, blog, software and every kind of software and other things 
need search description, and We could say that search description is an 
another name of Meta tags for websites, blogs etc. But if meta tags 
could be added for every individual post in blogger without any code 
then it can be very helpful very a kind of big achievement for bloggers,
 be'coz then our SEO will be more powerful in search engines. As we 
wrote a last post about on this topic that how to add meta tags for each
 post and that also working trick of it but there is one drawback of 
that trick is that we had to add every meta tag code for every single 
post and also had to save in blogger template, so this i very time 
consuming trick and this also increase the loading time of template. So,
 today we have a  new and very simple trick for this task and you don't 
need to add code and also not have to save your template every time. </span></span><br />
<span style="font-size: small;"><span style="font-family: inherit;"><br /></span></span>
<span style="font-size: small;"><span style="font-family: inherit;"><span style="font-size: large;"><span style="color: #0b5394;"><b>Let's Start</b></span></span></span></span><br />
<ol>
<li><span style="font-size: small;"><span style="font-family: inherit;">Login to Blogger</span></span></li>
<li><span style="font-size: small;"><span style="font-family: inherit;">Go to Dashboard</span></span></li>
<li><span style="font-size: small;"><span style="font-family: inherit;">Create a new post</span></span></li>
<li><span style="font-size: small;"><span style="font-family: inherit;">After written by your whole article</span></span></li>
<li><span style="font-size: small;"><span style="font-family: inherit;">Open SEARCH DESCRIPTION (on the right side of post editor)</span></span></li>
<li><span style="font-size: small;"><span style="font-family: inherit;">Enter your SEARCH DESCRIPTION in that box (<i>like in image below</i>)</span></span></li>
<li><span style="font-size: small;"><span style="font-family: inherit;">And, finally publish your article. </span></span></li>
</ol>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigD3Rg7ikb4MTu3BrU2oRpg5NGtHTJmSnFanAezfTMSYkC1VKBKA_T1AyEABIcpSkmBEpmUrLRfRYTKAKGdjzGwdopRqKy1oczJ9JBYe8ym7UjrvsPGUxgA41pjPZvFL20A4w-rycSxZNu/s1600/Best+Meta+Tag.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigD3Rg7ikb4MTu3BrU2oRpg5NGtHTJmSnFanAezfTMSYkC1VKBKA_T1AyEABIcpSkmBEpmUrLRfRYTKAKGdjzGwdopRqKy1oczJ9JBYe8ym7UjrvsPGUxgA41pjPZvFL20A4w-rycSxZNu/s1600/Best+Meta+Tag.png" /></a></div>
<span style="font-family: Verdana, sans-serif; font-size: medium;"></span><br />
<br />
<div style="text-align: center;">
<span style="font-family: inherit;"><span style="font-size: small;">This a best and perfect way of adding meta tags for every post in blogger.</span></span></div>

How to Add Meta Tags for Each Post in Blogger V2

As we all know that Meta Tags are very important for every single website in blogger and not also fr blogger it's also very importan...

Mashable Style Social Subscription Widget

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq9XWQd-e0lT-w9THyQfTFjHStdOU-vcy1K9lGh6_UH2krBH09x6GGb1fAZ_8EHVObzub5WuasU-iSIRN01rbrK9K9-CyFdN2dtPY9QMVixHLHeu5ydikJJZjwvasr8Vf9eA5HrJzdaYAz/s1600/Mashable+Style+Social+Subscription+Widget+Generator.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="148" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq9XWQd-e0lT-w9THyQfTFjHStdOU-vcy1K9lGh6_UH2krBH09x6GGb1fAZ_8EHVObzub5WuasU-iSIRN01rbrK9K9-CyFdN2dtPY9QMVixHLHeu5ydikJJZjwvasr8Vf9eA5HrJzdaYAz/s320/Mashable+Style+Social+Subscription+Widget+Generator.png" width="320" /></a></div>
The great social media blog Mashable is always an inspiration in whatever they do. I came across a great wordpress plugin created by inspiredmagz
 and they named it as mashable social bar. We downloaded their plugin 
and converted it to a blogger compatible form. We also managed to solve 
its compatibility issues for IE and further strengthened its HTML 
structure. This widget can now be used in every blogspot blog just with 
an extremely easy installation step. As you can see this widget contains
 links to your Facebook Fan page, Google+ page and recommendation button, twitter follow button, RSS and LinkedIn links and most importantly an attractive subscription form that will 
further increase the number of your Email subscribers. The conversion 
didn't took me very long and I am pleased to present it to all of you.<br />
<br />
<br />
<span style="color: #0b5394;"><span style="font-size: medium;"><b><span style="font-family: 'Trebuchet MS',sans-serif;">How to Install This Widget On 'Blogger' ?</span></b></span></span><br />
<ol>
<li><b>Customize Options</b> in Given <span style="color: #0b5394;"><b>Widget Generator Form</b></span></li>
<li>Click on <span style="color: #0b5394;"><span style="font-size: small;"><b>Generate</b></span> </span>Button</li>
<li>Finally Click<span style="color: #0b5394;"> <span style="font-size: small;"><b>Add to Blogger</b></span></span> Button to add this widget on Your blog</li>
</ol>
<div style="font-family: Georgia,"Times New Roman",serif;">
<i style="color: #999999;">**Note:- After changing any values, First Click <b><span style="color: #0b5394;">Generate </span></b>Button and then See Your <span style="color: #0b5394;"><b>Preview</b></span></i><i><span style="color: #999999;">.<span style="font-family: Georgia, 'Times New Roman', serif;"></span><b style="font-family: Georgia,"Times New Roman",serif;"> </b><span style="font-family: Georgia, 'Times New Roman', serif;"><span style="color: #0b5394;"></span></span> </span></i>

</div>
<br />
<center>
<iframe frameborder="0" height="1200px" scrolling="no" src="https://dl.dropboxusercontent.com/s/44opa5nzxoumv56/Mashable%20Style%20Social%20Subscription%20Widget%20Generator%20by%20Muhammad%20Nauman.html" width="700px"></iframe></center>
<br />
<div style="text-align: center;">
<span style="color: #0b5394;"><b>Any Problem....?</b></span></div>
<div style="text-align: center;">
<span style="color: #0b5394;"><b>Ask in Comment....</b></span></div>

Mashable Style Social Subscription Widget

The great social media blog Mashable is always an inspiration in whatever they do. I came across a great wordpress plugin created by inspi...

Advanced Auto Scrolling Recent Posts Widget Generator For Blogger / Blogspot

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOm4gWsfF-c8LnH1RWYAqyJfNaoZ86wV3WXG9sjF_UEd8-s5u9N1coPPGephbZWM3UjjsfmfdASoI0ebTIp9d2wuJIshyVo0yH6h_RzTGbHTnil9FbT9aiVTDoQUL94d7L799DiIo3Vxt5/s1600/Advanced+Auto+Scrolling+Recent+Posts+Widget+Generator+For+Blogger++Blogspot.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="146" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOm4gWsfF-c8LnH1RWYAqyJfNaoZ86wV3WXG9sjF_UEd8-s5u9N1coPPGephbZWM3UjjsfmfdASoI0ebTIp9d2wuJIshyVo0yH6h_RzTGbHTnil9FbT9aiVTDoQUL94d7L799DiIo3Vxt5/s320/Advanced+Auto+Scrolling+Recent+Posts+Widget+Generator+For+Blogger++Blogspot.png" width="320" /></a></div>
If you have a lot of post on the blog, or if you want to show everyone 
your list of favorite books, but have little space in the sidebar widget
 this will be a great help to you. This post explains how to add auto 
scrolling (marquee) recent posts Widget on his blog that looks good on 
your blogspot blog. This is similar to the display of recent post in 
your sidebar, but this will have a marquee in this widget. Now if you 
want to show your blog in this way, either on top or bottom of your 
blog, then you can use this new widget. <br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4axKNmHtv4V0PsFkLu0rMz-iobaXuALOFjPHa-lLoBMiIGVsocQ_BgX4kYwTikd13LTvPEHw8fenqv3V6CAUgas4kIZ75K0gyCEXhLTLah317obAvvlMjrG7oEi3kzJRG3CHx4DFoLDuM/s1600/Advanced+Auto+Scrolling+Recent+Posts+Widget+Generator+For+Blogger++Blogspot.gif" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="72" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4axKNmHtv4V0PsFkLu0rMz-iobaXuALOFjPHa-lLoBMiIGVsocQ_BgX4kYwTikd13LTvPEHw8fenqv3V6CAUgas4kIZ75K0gyCEXhLTLah317obAvvlMjrG7oEi3kzJRG3CHx4DFoLDuM/s640/Advanced+Auto+Scrolling+Recent+Posts+Widget+Generator+For+Blogger++Blogspot.gif" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">This Widget is look like this scrolling.</td></tr>
</tbody></table>
<br />
<span style="color: #0b5394;"><span style="font-size: large;"><b><span style="font-family: 'Trebuchet MS',sans-serif;">How to Install This Widget On 'Blogger' ?</span></b></span></span><br />
<ol>
<li><b>Customize Options</b> in Given <span style="color: #0b5394;"><b>Widget Generator Form</b></span></li>
<li>Click on <span style="color: #0b5394;"><span style="font-size: medium;"><b>Generate</b></span> </span>Button</li>
<li>Click <span style="color: #0b5394;"><span style="font-size: medium;"><b>Preview</b></span></span>** Button to see your widget Preview </li>
<li>Finally Click<span style="color: #0b5394;"> <span style="font-size: medium;"><b>Add to Blogger</b></span></span> Button to add this widget on Your blog</li>
</ol>
<div style="font-family: Georgia,"Times New Roman",serif;">
<i style="color: #999999;">**Note:- After changing any values, First Click <b><span style="color: #0b5394;">Generate </span></b>Button and then See Your <span style="color: #0b5394;"><b>Preview</b></span></i></div>
<i><span style="color: #999999;"><b style="font-family: Georgia,"Times New Roman",serif;"> </b><span style="font-family: Georgia, 'Times New Roman', serif;">Note:-</span><b style="font-family: Georgia,"Times New Roman",serif;"> </b><span style="font-family: Georgia, 'Times New Roman', serif;">Choose appropriate Image Bullet or Icon That have transparent <b><span style="color: #0b5394;">Background </span></b>and small in <span style="color: #0b5394;"><b>Size  </b></span></span> </span></i>

<br />
<br />
<br />
<center>
<iframe frameborder="0" height="700px" scrolling="no" src="http://dl.dropboxusercontent.com/s/e06ywvmp3uye0zn/Advanced%20Auto%20Scrolling%20Recent%20Posts%20Widget%20Generator%20For%20Blogger.html" width="700px"></iframe></center>
<div style="text-align: center;">
<span style="color: #0b5394;"><b>If any Problem Ask in Comments.</b></span></div>

Advanced Auto Scrolling Recent Posts Widget Generator For Blogger / Blogspot

If you have a lot of post on the blog, or if you want to show everyone your list of favorite books, but have little space in the sidebar ...

Cursor Generator For Blogger | How to Change Mouse Cursor in Blogger

<br />
<h2 style="text-align: left;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdGulQSPz2JLZsCz76tYBjucBvSDlNepTalW5o0C3nnicXh2Csm4bbDAOJlRIUk7kKTMsdq2eJAeCaLCpi8OkhKgTfluRVM5oar0aQs1cphpPSXoa-6ViN92ruPaReFDzr5f8lhAEP9EJj/s1600/Cursor+Generator+For+Blogger.gif" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="253" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdGulQSPz2JLZsCz76tYBjucBvSDlNepTalW5o0C3nnicXh2Csm4bbDAOJlRIUk7kKTMsdq2eJAeCaLCpi8OkhKgTfluRVM5oar0aQs1cphpPSXoa-6ViN92ruPaReFDzr5f8lhAEP9EJj/s320/Cursor+Generator+For+Blogger.gif" width="320" /></a><span style="color: red;"><span style="font-size: small;"><span style="color: #0b5394;">Change Mouse Cursor Generator By <a href="https://www.facebook.com/ProCracker1" target="_blank">Muhammad Nauman</a></span></span></span></h2>
How to change mouse cursor in blogger blog to animated cursors.One of 
the best way to add extra fun to your blog is, changing mouse cursor on 
your blog. Changing the mouse cursor in blogger or blogspot blogs is 
very easy.This tutorial will help you to change the mouse cursor of your
 blog to animated cursors.Many bloggers are asking such kind of 
questions but there is no tutorial available on the internet.I created 
this post because there are a blogger friend who asked how to change the
 pointer / cursor on the blogger. This you can do to decorate the look 
of blog.<br />
<br />
I take the cursor image from http://www.cursors-4u.com and  
http://rw-designer.com you can change it anytime depends on your festive
 moods.<br />
<br />
<h4 style="text-align: left;">
<span style="color: #0b5394;"><b>How To Add Mouse Cursor Widget To Blogger?</b></span></h4>
<ul style="text-align: left;">
<li>Choose a type of Mouse Cursor below</li>
<li>Click on <b>"Genetate"</b> button</li>
<li>Finally click on <b>"Add to Blogger"</b> to add it to your blog.</li>
</ul>
<center>
<iframe frameborder="0" height="4420px" scrolling="no" src="https://dl.dropboxusercontent.com/s/sjpf7p26uxgg2kt/cursors.html" width="700px"></iframe></center>
<div style="text-align: center;">
<span style="color: #0b5394;"><b>If any Problem Ask in Comment.
</b></span></div>

Cursor Generator For Blogger | How to Change Mouse Cursor in Blogger

Change Mouse Cursor Generator By Muhammad Nauman How to change mouse cursor in blogger blog to animated cursors.One of the best way to a...

How To Add Animated Flash Clock Widget To Blogger | Blogspot

<div>
<div>
<div class="dropcap">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhM3iQA_HemXU1YlLjds2QyE7SAgfFNBldXfbEud_94j-hnp0xcdm7c6BDFzbZqCemSEH4iYRVXcc0JgqpSs4DFmB64tPy1WchaJ5h6gSnznOenCL7ijgGQIVtrGMGUqChzWo1R-W2ovWTr/s1600/Add+Animated+Flash+Clock+to+Blog.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhM3iQA_HemXU1YlLjds2QyE7SAgfFNBldXfbEud_94j-hnp0xcdm7c6BDFzbZqCemSEH4iYRVXcc0JgqpSs4DFmB64tPy1WchaJ5h6gSnznOenCL7ijgGQIVtrGMGUqChzWo1R-W2ovWTr/s1600/Add+Animated+Flash+Clock+to+Blog.jpg" /></a></div>
Here's the cool Clock. This tutorial will show you how to Add animated 
flash clock gadget your Blogger blog. A clock gives a beautiful look to a
 website. A clock is a necessity for a personal website, forum, blog 
etc.Isn’t it exciting when you get a highly quality flash Clock 
absolutely Free? you can add this flash animated clock your blog 
easily.i've tested this Flash Clock on internet explorer, mozzilla 
firefox & many other web browsers. it's very fast and fresh.You 
simply have to Click on Add to Blogger to add it.</div>
</div>
</div>
<br />
<span style="color: #0b5394;"><b>Follow Admin On Facebook For Getting Latest Updates:<div class="fb-follow" data-href="http://www.facebook.com/ProCracker1" data-colorscheme="light" data-layout="standard" data-show-faces="true"></div>
</div>
<br />
<span style="color: #0b5394;"><b> </b><b> </b></span><br />
<span style="color: #0b5394;"><b>How to Add this: </b></span><br />
<span style="color: #0b5394;"><b>Step 1:</b></span> Choose a type of clock belo<b>w<span style="color: #0b5394;"></span></b><br />
<span style="color: #0b5394;"><b>Step 2:</b></span> Fill <b>Height</b> and <b>Width</b> of the Widget<br />
<span style="color: #0b5394;"><b>Step 3:</b> </span>Finally click on <b>“Add to Blogger”</b> to add it to your blog.<br />
<br />
<center>
<iframe allowtransparency="true" frameborder="0" height="1450px" scrolling="no" src="https://dl.dropboxusercontent.com/s/hh3ztkelo8vu4kn/cloack.html" width="100%"></iframe></center>
<br />

How To Add Animated Flash Clock Widget To Blogger | Blogspot

Here's the cool Clock. This tutorial will show you how to Add animated flash clock gadget your Blogger blog. A clock gives a beaut...

Send Free SMS to Pakistan, Send Free SMS Text Messages to Any Network Without Registration

<div style="text-align: center;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB4suiNwLjAA8drfLk1wO9vvec76WqmL8vuYEwxnZCsVQaPzNrkVIg2tB-oDwTO4aJOrI247sPUNhKUgh5LM2b9C_uD8XlFWR8wfv3rqFpBmAXY4NnNilEI-XVYaR22A-5w-K9bJMA3VQ0/s1600/Send+Free+SMS+to+Pakistan,+Send+Free+SMS+Text+Messages+to+Any+Network+Without+Registration.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="261" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB4suiNwLjAA8drfLk1wO9vvec76WqmL8vuYEwxnZCsVQaPzNrkVIg2tB-oDwTO4aJOrI247sPUNhKUgh5LM2b9C_uD8XlFWR8wfv3rqFpBmAXY4NnNilEI-XVYaR22A-5w-K9bJMA3VQ0/s320/Send+Free+SMS+to+Pakistan,+Send+Free+SMS+Text+Messages+to+Any+Network+Without+Registration.jpg" width="320" /></a></div>
<div style="text-align: left;">
Send SMS Everywhere in Pakistan, No Registration Required. 1000 Character Support, Send SMS in Pakistan, Send SMS Free, Send SMS Free in Pakistan, Send Free SMS, Send Free SMS in Pakistan, Send Free SMS to Ufone, Send Free SMS to Warid, Send Free SMS to Jazz, Send Free SMS to Zong, Send Free SMS to Telenor, Send Free SMS to Moblie, Send Free SMS to Pakistan, Free SMS Send, Send Text Messages, Free SMS to Pakistan, Send Free SMS To Any Network In Pakistan, Pakistan Free SMS Service enjoy our sms service.
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

<ins class="adsbygoogle"
     style="display:inline-block;width:728px;height:90px"
     data-ad-client="ca-pub-6366058496501190"
     data-ad-slot="2262673061"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<iframe align="middle" frameborder="0" height="550" scrolling="no" src="http://smsserver.send92.com/index.php" style="overflow: hidden;" width="100%"></iframe></div>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

<ins class="adsbygoogle"
     style="display:inline-block;width:728px;height:90px"
     data-ad-client="ca-pub-6366058496501190"
     data-ad-slot="2262673061"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<span style="color: #0b5394;"><b>Embed This in Your Site/Blog</b></span>

Send Free SMS to Pakistan, Send Free SMS Text Messages to Any Network Without Registration

Send SMS Everywhere in Pakistan, No Registration Required. 1000 Character Support, Send SMS in Pakistan, Send SMS Free, Send SMS Free in...

Make your Own Heart With Text (ASCII Heart Generator)

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi23eN8q1Inr2DUqz4NTjw4aY7jXshO69g39z9GcJnUoZKCR4B6Y7RsnNYaRQlWe29VJUeeiZw9LGNx1I0_LzDQiWyY8B5UytJWX4ksvMeWh9RomEvGD7kPp7XbtfQsIjgRkBNMPq7-ZD7Z/s1600/heart+generator.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="273" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi23eN8q1Inr2DUqz4NTjw4aY7jXshO69g39z9GcJnUoZKCR4B6Y7RsnNYaRQlWe29VJUeeiZw9LGNx1I0_LzDQiWyY8B5UytJWX4ksvMeWh9RomEvGD7kPp7XbtfQsIjgRkBNMPq7-ZD7Z/s320/heart+generator.jpg" width="320" /></a></div>
<span style="font-family: inherit;"><span style="font-size: small;">This
 is simple Text to Heart Text Generator for bloggers and also for fb 
users, you can easily use it in Facebook Status, Google Plus Status, for
 Tweet and also in other social sites. This will generate your text into
 the heart shape. </span></span>
<span style="font-family: inherit;"></span><br />
<h4 style="text-align: left;">
<span style="color: #0b5394;"><span style="font-family: inherit;"><span style="font-size: small;">How to Use it?</span></span></span></h4>
<span style="font-family: inherit;"><span style="font-size: small;">
</span></span>
<br />
<ul style="text-align: left;">
<li><span style="font-family: inherit;"><span style="font-size: small;">Type Your Name in Text Box</span></span></li>
<li><span style="font-family: inherit;"><span style="font-size: small;">Hit on 'Create Button'</span></span></li>
<li><span style="font-family: inherit;"><span style="font-size: small;">That's it....!</span></span></li>
<li><span style="font-family: inherit;"><span style="font-size: small;">Now copy your generated text and paste any where, where you want to show your creativity.  </span></span></li>
</ul>
<center>
<iframe frameborder="0" height="600px" marginheight="0px" marginwidth="0px" name="My iFrame" scrolling="no" src="https://dl.dropboxusercontent.com/u/63968842/hearttextgenerator.html" style="border: 0px #FFFFFF none;" width="468px"></iframe></center>

Make your Own Heart With Text (ASCII Heart Generator)

This is simple Text to Heart Text Generator for bloggers and also for fb users, you can easily use it in Facebook Status, Google Plus St...

How to Add Professional Dropdown Menu in Blogger

<span style="font-family: inherit;">Drop
 down menus are very important in blogging and these kinds of stuff is 
also considerable for the visitors be'coz visitor when firstly see your 
menus and other widget and if he like that then she/he wish to visit 
again itself and content also very important fro the every blogger.</span><br />
<span style="font-family: inherit;"><br /></span>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhstkr5YMbFxt364-dEOz1dKGgYZQJR_FfrWfnrbCLRSh9augkM0T8WPgqocoioP2_EK5wqfWn_yasajsZGGuVJ0k8eaRXvekbWlPYskkOsJCpFaCBq0Vp2MO1iBwbByti3gL9YlZgRKlal/s1600/How+to+Add+Professional+Dropdown+Menu+in+Blogger.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="font-family: inherit;"><img border="0" height="296" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhstkr5YMbFxt364-dEOz1dKGgYZQJR_FfrWfnrbCLRSh9augkM0T8WPgqocoioP2_EK5wqfWn_yasajsZGGuVJ0k8eaRXvekbWlPYskkOsJCpFaCBq0Vp2MO1iBwbByti3gL9YlZgRKlal/s640/How+to+Add+Professional+Dropdown+Menu+in+Blogger.gif" width="640" /></span></a></div>
<b style="background-color: white; color: #333333; font-family: inherit; line-height: 19.19999885559082px;"><span style="color: #0b5394;">Step 1:</span></b><span style="background-color: white; color: #333333; font-family: inherit; line-height: 19.19999885559082px;"> </span><span style="color: #333333;"><span style="line-height: 19.19999885559082px;"><b>How to Add Professional Dropdown Menu in Blogger.</b></span></span><br style="background-color: white; color: #333333; line-height: 19.19999885559082px;" /><span style="background-color: white; color: #333333; font-family: inherit; line-height: 19.19999885559082px;">Now let's start adding it...</span><br style="background-color: white; color: #333333; line-height: 19.19999885559082px;" /><br style="background-color: white; color: #333333; line-height: 19.19999885559082px;" /><b style="background-color: white; color: #333333; font-family: inherit; line-height: 19.19999885559082px;"><span style="color: #0b5394;">Step 2:</span></b><span style="background-color: white; color: #333333; font-family: inherit; line-height: 19.19999885559082px;"> Login to Your Blogger Account.Go to your </span><b style="background-color: white; color: #333333; font-family: inherit; line-height: 19.19999885559082px;"><span style="color: #0b5394;">Blogger Dashboard>Layout>Add a Gadget.</span></b><br />
<div style="background-color: white; color: #333333; line-height: 19.19999885559082px;">
<span style="font-family: inherit;"><br /></span></div>
<div style="background-color: white; color: #333333; line-height: 19.19999885559082px;">
<span style="font-family: inherit;"><b><span style="color: #0b5394;">Step 3:</span></b> After click on Add a Gadget link A pop-up box will open now</span></div>
<div style="background-color: white; color: #333333; line-height: 19.19999885559082px;">
<span style="font-family: inherit;"><br /></span></div>
<div class="separator" style="background-color: white; clear: both; color: #333333; line-height: 19.19999885559082px; text-align: center;">
</div>
<div class="separator" style="background-color: white; clear: both; color: #333333; line-height: 19.19999885559082px; 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="color: #999999; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="0" height="106" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NBHy5gDBgEgcJxXLh_uiUcubKIfCWObP_PsxBB1lJOBdgv_IFLDpDcW7-a9VdOR1ihQexmiqwtC3lJh7V7TXfilbhjVGhPuVMzbRLrlQH7vivr3FbaIkrcfRGTCKzuvdNOxvLd3VYtjT/s400/2013-12-07_051839.png" style="-webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(192, 192, 192); height: auto; max-width: 95%; padding: 4px; transition: all 0.4s ease-in-out;" width="400" /></span></a></div>
<div style="background-color: white; color: #333333; line-height: 19.19999885559082px;">
<span style="font-family: inherit;"><br />Select "HTML/JavaScript" from the gadget options by clicking the blue plus sign for that gadget.</span></div>
<div style="background-color: white; color: #333333; line-height: 19.19999885559082px;">
<span style="font-family: inherit;"><br /></span></div>
<div style="background-color: white; color: #333333; line-height: 19.19999885559082px;">
<span style="font-family: inherit;"><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.</span></div>
<div style="background-color: white; color: #333333; line-height: 19.19999885559082px;">
<span style="font-family: inherit;"><br /></span></div>
<blockquote class="tr_bq">
<span style="font-family: inherit;"><style><br />
<br />
/* Blue Dropdown Menu by www.myblog-widgets.blogspot.com/ */<br />
#nav {<br />
display:inline-block;<br />
width:100%;<br />
margin:0px auto;<br />
padding:0;<br />
background:#335599 
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-BBxRdrWbZvjpxE0Vcrk6H2-mbspdxED4HFg3sxxPQ7vqv6T2nOrk8dkyE1eLJPkdUYoAjQlY5N9NKaKLYnIuboznUoS2JVcXI7yPnwu4PjmD1TPMWuPFx5Dfp0B-C9xDEtWBiplV4XW4/s320/bg-ABT.png)
 repeat-x 0 -110px;border-radius:10px; /*some css3*/<br />
-moz-border-radius:10px;<br />
-webkit-border-radius:10px;<br />
box-shadow:0 2px 2px rgba(0,0,0, .5);<br />
-moz-box-shadow:0 2px 2px rgba(0,0,0, .5);<br />
-webkit-box-shadow:0 2px 2px rgba(0,0,0, .5);<br />
}<br />
#nav li {<br />
margin:10px;<br />
float:left;<br />
position:relative;<br />
list-style:none;<br />
}<br />
#nav a {<br />
font-family:verdana;<br />
font-weight:bold;<br />
color:#e7e5e5;<br />
text-decoration:none;<br />
display:block;<br />
padding:8px 20px;border-radius:10px; /*some css3*/<br />
-moz-border-radius:10px;<br />
-webkit-border-radius:10px;<br />
text-shadow:0 2px 2px rgba(0,0,0, .7);<br />
}/* selected menu element */<br />
#nav .current a, #nav li:hover > a {<br />
background:#7788aa 
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-BBxRdrWbZvjpxE0Vcrk6H2-mbspdxED4HFg3sxxPQ7vqv6T2nOrk8dkyE1eLJPkdUYoAjQlY5N9NKaKLYnIuboznUoS2JVcXI7yPnwu4PjmD1TPMWuPFx5Dfp0B-C9xDEtWBiplV4XW4/s320/bg-ABT.png)
 repeat-x 0 -20px;<br />
color:#000;<br />
border-top:1px solid #f8f8f8;box-shadow:0 2px 2px rgba(0,0,0, .7); /*some css3*/<br />
-moz-box-shadow:0 2px 2px rgba(0,0,0, .7);<br />
-webkit-box-shadow:0 2px 2px rgba(0,0,0, .7);<br />
text-shadow:0 2px 2px rgba(255,255,255, 0.7);<br />
}/* sublevels */<br />
#nav ul li:hover a, #nav li:hover li a {<br />
background:none;<br />
border:none;<br />
color:#000;<br />
}<br />
#nav ul li a:hover {<br />
background:#335599 
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-BBxRdrWbZvjpxE0Vcrk6H2-mbspdxED4HFg3sxxPQ7vqv6T2nOrk8dkyE1eLJPkdUYoAjQlY5N9NKaKLYnIuboznUoS2JVcXI7yPnwu4PjmD1TPMWuPFx5Dfp0B-C9xDEtWBiplV4XW4/s320/bg-ABT.png)
 repeat-x 0 -100px;<br />
color:#fff;border-radius:10px; /*some css3*/<br />
-moz-border-radius:10px;<br />
-webkit-border-radius:10px;<br />
text-shadow:0 2px 2px rgba(0,0,0, 0.7);<br />
}#nav ul li:first-child > a {<br />
-moz-border-radius-topleft:10px; /*some css3*/<br />
-moz-border-radius-topright:10px;<br />
-webkit-border-top-left-radius:10px;<br />
-webkit-border-top-right-radius:10px;<br />
}<br />
#nav ul li:last-child > a {<br />
-moz-border-radius-bottomleft:10px; /*some css3*/<br />
-moz-border-radius-bottomright:10px;<br />
-webkit-border-bottom-left-radius:10px;<br />
-webkit-border-bottom-right-radius:10px;<br />
}/* drop down */<br />
#nav li:hover > ul {<br />
opacity:1;<br />
visibility:visible;<br />
}<br />
#nav ul {<br />
opacity:0;<br />
visibility:hidden;<br />
padding:0;<br />
width:175px;<br />
position:absolute;<br />
background:#aabbcc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-BBxRdrWbZvjpxE0Vcrk6H2-mbspdxED4HFg3sxxPQ7vqv6T2nOrk8dkyE1eLJPkdUYoAjQlY5N9NKaKLYnIuboznUoS2JVcXI7yPnwu4PjmD1TPMWuPFx5Dfp0B-C9xDEtWBiplV4XW4/s320/bg-ABT.png) repeat-x 0 0;<br />
border:1px solid #7788aa;border-radius:10px; /*some css3*/<br />
-moz-border-radius:10px;<br />
-webkit-border-radius:10px;<br />
box-shadow:0 2px 2px rgba(0,0,0, .5);<br />
-moz-box-shadow:0 2px 2px rgba(0,0,0, .5);<br />
-webkit-box-shadow:0 2px 2px rgba(0,0,0, .5);-moz-transition:opacity .25s linear, visibility .1s linear .1s;<br />
-webkit-transition:opacity .25s linear, visibility .1s linear .1s;<br />
-o-transition:opacity .25s linear, visibility .1s linear .1s;<br />
transition:opacity .25s linear, visibility .1s linear .1s;<br />
}<br />
#nav ul li {<br />
float:none;<br />
margin:0;<br />
}<br />
#nav ul a {<br />
font-weight:normal;<br />
text-shadow:0 2px 2px rgba(255,255,255, 0.7);<br />
}<br />
#nav ul ul {<br />
left:160px;<br />
top:0px;<br />
}<br />
<br />
</style> <br />
<br />
    <ul id="nav"><br />
        <li><a href="<span style="background-color: orange;">#</span>">Home</a></li><br />
        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">Tutorials</span></a><br />
            <ul><br />
                <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">HTML / CSS</span></a></li><br />
                <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #6aa84f;"><span style="background-color: #93c47d;">JS / jQuery</span><span style="background-color: white;"></</span></span>a><br />
                    <ul><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">jQuery</span></a></li><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">JS</span></a></li><br />
                    </ul><br />
                </li><br />
                <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">PHP</span></a></li><br />
                <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">MySQL</span></a></li><br />
                <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">XSLT</span></a></li><br />
                <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">Ajax</span></a></li><br />
            </ul><br />
        </li><br />
        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">Resources</span></a><br />
            <ul><br />
                <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">By category</span></a><br />
                    <ul><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">PHP</span></a></li><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">MySQL</span></a></li><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">XSLT</span></a></li><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">Ajax</span></a></li><br />
                    </ul><br />
                </li><br />
                <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">By tag name</span></a><br />
                    <ul><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">captcha</span></a></li><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">gallery</span></a></li><br />
                        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">animation</span></a></li><br />
                    </ul><br />
                </li><br />
            </ul><br />
        </li><br />
        <li><a href="<span style="background-color: orange;">#</span>"><span style="background-color: #93c47d;">About</span></a></li><br />
        <li><a href="http://myblog-widgets.blogspot.com/"><span style="background-color: #93c47d;">FAQ's</span></a></li><br />
    </ul></span></blockquote>
<span style="font-family: inherit;"><br /></span>
<span style="color: #0b5394; font-family: inherit; font-size: large;"><b>Make Changes.....!!!</b></span><br />
<span style="font-family: inherit;">1. Replace it <span style="background-color: orange;">#</span> with your link. </span><br />
<span style="font-family: inherit;">2. Replace all <span style="background-color: #93c47d;">Green Area</span> with your showing menu name.</span>

How to Add Professional Dropdown Menu in Blogger

Drop down menus are very important in blogging and these kinds of stuff is also considerable for the visitors be'coz visitor when firs...

How to Add Meta Tags for Each Post on Blogger

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQqzvtCWdJEcIBmRvDP7BBZAmoybopAsDgI5erRf5jx83kjDdYimRS0NBiZjtuCrSgloYoxNgHlvTHZAU35rzFFLiKCf8UpZYBxCvRxbOjmK1S0_Wc8BJ5mM87GA870jqmsIOgo5CKC3Dv/s1600/meta_tags.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="160" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQqzvtCWdJEcIBmRvDP7BBZAmoybopAsDgI5erRf5jx83kjDdYimRS0NBiZjtuCrSgloYoxNgHlvTHZAU35rzFFLiKCf8UpZYBxCvRxbOjmK1S0_Wc8BJ5mM87GA870jqmsIOgo5CKC3Dv/s200/meta_tags.jpg" width="200" /></a></div>
<span style="font-family: inherit;">Meta
 Tags are very important part of our blog OR website be'coz it can 
manage our blog in the search engines and these kinds of little tricks 
are very easy to use and also very effective for our blog, be'coz it can
 increase our blog's reputation on the search engines and also when we 
search any topic on the Google, OR in Yahoo! then most probably your 
blog will be on the top be'coz meta tags are always responsible for that
 kind of task and deal with search engines.</span><br />
<br />
<span style="font-family: inherit;"><b style="background-color: white; color: #333333; line-height: 19.19999885559082px;"><span style="font-family: inherit;"><b style="background-color: white; color: #333333; line-height: 19.19999885559082px;"><span style="color: #0b5394;"><br /></span></b></span></b></span>
<span style="font-family: inherit;"><b style="background-color: white; color: #333333; line-height: 19.19999885559082px;"><br /></b></span><br />
<span style="font-family: inherit;"><b style="background-color: white; line-height: 19.19999885559082px;"><span style="color: #0b5394;">Step 1 :</span></b><span style="background-color: white; color: #333333; line-height: 19.19999885559082px;"> Now let's start adding it... </span></span><br />
<span style="background-color: white; color: #333333; line-height: 19.19999885559082px;"><span style="font-family: inherit;"><br /></span></span>
<br />
<div style="background-color: white;">
<div style="color: #333333; line-height: 19.19999885559082px; text-align: right;">
<div style="text-align: left;">
<span style="font-family: inherit;"><b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <span style="color: #0b5394;"><b>Blogger Dashboard></b><b>Template</b>> <b>Edit HTML</b>><b>Proceed</b>.</span></span></div>
</div>
<div style="color: #333333; line-height: 19.19999885559082px; text-align: right;">
<div style="text-align: left;">
<span style="color: #0b5394;"><span style="font-family: inherit;"><br /></span></span></div>
</div>
<div style="text-align: right;">
<div style="color: #333333; line-height: 19.19999885559082px; text-align: left;">
<span style="font-family: inherit;"><b><span style="color: #0b5394;">Step 3:</span></b> Find [by pressing <kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; margin: 2px 3px; padding: 1px 5px;">Ctrl</kbd> + <kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; margin: 2px 3px; padding: 1px 5px;">F</kbd> ] this code in the template:</span></div>
<blockquote class="tr_bq" style="color: #333333; line-height: 19.19999885559082px; text-align: left;">
<span style="font-family: inherit;"><b:include data=’blog’ name=’all-head-content’/></span></blockquote>
<div style="color: #333333; line-height: 19.19999885559082px; text-align: left;">
<b><span style="color: #0b5394;">Step 4: </span></b><span style="text-align: right;"><span style="font-family: inherit;">Paste below code just after the above code.</span></span></div>
<blockquote class="tr_bq" style="color: #333333; line-height: 19.19999885559082px;">
<div style="text-align: left;">
<span style="font-family: inherit;"><b:if cond=’data:blog.url == “Your Blog URL”‘></span></div>
<span style="font-family: inherit;"></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><meta content=’Write some Description For Your Blog’ name=’description’ /></span></div>
<span style="font-family: inherit;">
</span>
<br />
<div style="text-align: left;">
<span style="font-family: inherit;"><meta content=’A Few Keywords For Your Blog’ name=’keywords’ /></span></div>
<span style="font-family: inherit;">
</span>
<div style="text-align: left;">
<span style="font-family: inherit;"></b:if></span></div>
<span style="font-family: inherit;">
</span></blockquote>
<div style="color: #333333; line-height: 19.19999885559082px; text-align: left;">
<b><span style="color: #0b5394;">Step 5:</span></b></div>
<div style="color: #333333; line-height: 19.19999885559082px; text-align: left;">
</div>
<ul>
<li style="text-align: left;"><span style="font-family: inherit;">Remember this is your main meta tag of your blog.</span></li>
<li style="text-align: left;"><span style="font-family: inherit;">Now If you want to add meta tags for every post then follow below steps.</span></li>
<li style="text-align: left;"><span style="font-family: inherit;">If you have 300 post in your blog then you have to paste below code 300 times for every post.</span></li>
</ul>
<br />
<blockquote class="tr_bq" style="color: #333333; line-height: 19.19999885559082px; text-align: left;">
</blockquote>
<blockquote class="tr_bq">
<div style="color: #333333; line-height: 19.19999885559082px; text-align: left;">
<span style="font-family: inherit;"><b:include data=’blog’ name=’all-head-content’/></span></div>
<div style="text-align: left;">
<span style="color: #333333; line-height: 19.19999885559082px;"><span style="font-family: inherit;"><br /></span></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><b:if cond=’data:blog.url == “</span><span style="background-color: #e06666; color: #333333; line-height: 19.19999885559082px;">Your Blog URL</span><span style="color: #333333; line-height: 19.19999885559082px;">”‘></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><meta content=’<span style="background-color: #674ea7;">Write some Description For Your Blog</span>’ name=’description’ /></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span>
<span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><meta content=’<span style="background-color: #c27ba0;">A Few Keywords For Your Blog</span>’ name=’keywords’ /></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span>
<span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"></b:if></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span>
</span><br />
<div style="text-align: left;">
<span style="color: #333333; line-height: 19.19999885559082px;"><span style="font-family: inherit;"><br /></span></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><b:if cond=’data:blog.url == “</span><span style="background-color: orange; color: #333333; line-height: 19.19999885559082px;">Your Post URL<span style="background-color: white;">"</span></span><span style="color: #333333; line-height: 19.19999885559082px;">‘></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><meta content=’<span style="background-color: #93c47d;">Write some Description For Your Blog Post</span>' name=’description’ /></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span>
<span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><meta content=’<span style="background-color: #6fa8dc;">A Few Keywords For Your Blog Post</span>’ name=’keywords’ /></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span>
<span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"></b:if></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span>
</span><br />
<div style="text-align: left;">
<span style="color: #333333; line-height: 19.19999885559082px;"><span style="font-family: inherit;"><br /></span></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><b:if cond=’data:blog.url == “</span><span style="background-color: orange; color: #333333; line-height: 19.19999885559082px;">Your Post URL</span><span style="color: #333333; line-height: 19.19999885559082px;">”‘></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><meta content=’<span style="background-color: #93c47d;">Write some Description For Your Blog Post</span>' name=’description’ /></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span>
<span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"><meta content=’<span style="background-color: #6fa8dc;">A Few Keywords For Your Blog Post</span>’ name=’keywords’ /></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span>
<span style="color: #333333; line-height: 19.19999885559082px;"></span></span><br />
<div style="text-align: left;">
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;"></b:if></span></span></div>
<span style="font-family: inherit;"><span style="color: #333333; line-height: 19.19999885559082px;">
</span></span></blockquote>
<br />
<blockquote class="tr_bq" style="color: #333333; line-height: 19.19999885559082px; text-align: left;">
</blockquote>
<div style="text-align: left;">
<span style="color: #0b5394;"><span style="font-size: large; line-height: 19.19999885559082px;"><b>Make Changes...!!!</b></span></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;">Replace it <span style="background-color: #e06666;">Your Blog URL</span> with your blog link like www.widgetgenerators.blogspot.com</span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;">Replace it <span style="background-color: #674ea7;">Write some Description For Your Blog</span> with your blog's Description</span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;">Replace it <span style="background-color: #c27ba0;">A Few Keywords For Your Blog</span> with your blog's keywords.</span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;">Replace it <span style="background-color: orange;">Your Post URL</span> with your post link like www.widgetgenerators.blogspot.com/2012/10/add-adsense-ads-below-post-title-in.html</span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;">Replace it <span style="background-color: #93c47d;">Write some Description For Your Blog Post</span> with your post description.</span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: inherit;">Replace it <span style="background-color: #6fa8dc;">A Few Keywords For Your Blog Post</span> with your post's keywords</span></div>
<div style="text-align: center;">
<b style="color: #333333; line-height: 19.19999885559082px; text-align: left;"><span style="color: #0b5394;"><br /></span></b>
<b style="color: #333333; line-height: 19.19999885559082px; text-align: left;"><span style="color: #0b5394;">Step 6: </span></b><span style="text-align: right;"><span style="font-family: inherit;">Finally Save your template.</span></span></div>
</div>
</div>

How to Add Meta Tags for Each Post on Blogger

Meta Tags are very important part of our blog OR website be'coz it can manage our blog in the search engines and these kinds of litt...

How to Add JQuery Load More Posts OR Infinite Scrolling to Blogger

<span style="font-family: inherit;">Technology
 is running with rocket's speed and also technology is increasing in 
the world of web that why we can add as much as new features in the blog
 be'coz blogging is so much flexible than a website. So, we can add many
 new and professional features in our blog and same like it "There is an
 another feature named as <b><span style="color: #0b5394;">LOAD MORE POSTS</span></b>. Today you will get to 
know that how can we add that <b><span style="color: #0b5394;">LOAD MORE POSTS</span></b> or <b><span style="color: #0b5394;">INFINITE POSTS 
SCROLLING</span></b>. This is very simple and very easy to install but this effect 
made by jQuery.</span><br />
<span style="font-family: inherit;"><br /></span>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUTIBm3tDzEuy-px6KGxV5u7khgujGbCFPXrsSe2c9Tc-uN1afEMBvanxaQf1F7_Flz4xAB7tTQIwiPNwLRZsjFVHt3QRH9Kn6pzQoqnaBbRwuHl8V6tl-1cWaEjsK1nMcF1EYYG9tuQcw/s1600/How+to+Add+Load+More+Posts+OR+Infinite+Scrolling+to+Blogger.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="480" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUTIBm3tDzEuy-px6KGxV5u7khgujGbCFPXrsSe2c9Tc-uN1afEMBvanxaQf1F7_Flz4xAB7tTQIwiPNwLRZsjFVHt3QRH9Kn6pzQoqnaBbRwuHl8V6tl-1cWaEjsK1nMcF1EYYG9tuQcw/s640/How+to+Add+Load+More+Posts+OR+Infinite+Scrolling+to+Blogger.jpg" width="640" /></a></div>
<span style="font-family: inherit;"><br /></span>
<b><span style="color: #0b5394;">Step 1 :</span></b> Now let's start adding it...

<br />
<br />
<br />
<div>
<div style="text-align: right;">
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <span style="color: #0b5394;"><b>Blogger Dashboard></b><b style="background-color: white;">Template</b>> <b><span style="background-color: white;">Edit HTML</span></b>> <b>Proceed</b>.</span></div>
<div style="text-align: left;">
<span style="color: #0b5394;"><br /></span></div>
</div>
<div style="text-align: right;">
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 3:</span></b> Find [by pressing  <kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">Ctrl</kbd><span style="font-family: Georgia, serif; font-size: 13.63636302947998px;"> + </span><kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">F</kbd> ] this code in the template:</div>
<blockquote class="tr_bq" style="text-align: left;">
<span style="font-size: x-small;"><span style="font-family: "Courier New",Courier,monospace;"></head></span></span></blockquote>
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 4:</span></b><span style="font-family: inherit;"> <span style="font-size: medium; text-align: right;">Paste below code before </head></span></span></div>
<blockquote class="tr_bq" style="text-align: left;">
<span style="font-family: "Courier New",Courier,monospace;"><b:if cond='data:blog.pageType == "index"'><br />
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'/><br />
<script src='https://googledrive.com/host/0Bxsq9VDr3zyFMjNlYjhNeWlza1U' type='text/javascript'/><br />
<script type='text/javascript'><br />
jQuery.ias({<br />
    container : '.blog-posts',<br />
    item: '.post-outer',<br />
    pagination: '#blog-pager',<br />
    next: '#blog-pager-older-link a',<br />
    loader: 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-cSjtHWjiGGDAOoVrLrV1XhzYSpjUXedqBnpSCed9BMlseQaN94ZoXNS3QNf8gLwD1K9Cz73cuigdjLoB5UBGo48CQgG7ROI656LRHIqacYpXwppmiJTy_ieY3kSShHQkexer2o4bkPRg/s1600/wgloading.gif'<br />
});<br />
  </script><br />
</b:if></span></blockquote>
<br />
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 5:</span></b> <span style="font-family: inherit;">You have Done. <span style="text-align: right;">Finally <b><span style="color: #0b5394;">Save Your Template.</span></b></span> </span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><br /></span></div>
<div style="text-align: center;">
<span style="font-family: inherit;">Load
 More Post widget simply made  by using the jQuery and this can install 
very easily but adding the some simple codes, but as we said this widget
 made by jQuery you it can affect your template some where like 
javascript could be affect by this jQuery codes but don't worry it will 
not affect your other important plugins. So go and add this.</span></div>
</div>
</div>

How to Add JQuery Load More Posts OR Infinite Scrolling to Blogger

Technology is running with rocket's speed and also technology is increasing in the world of web that why we can add as much as new fea...

How to Add Pro Download Button With Mouse Hover Effect in Your Blog

<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/AVvXsEjsmy9XDkzMUmLauFvzoiCjAgfZsS4tT4jkJtEjssjoVE1MUwl2mzcsClooucltPdjjiYbOWaVtG5zv51IXy0qALxKu75rVt1z4HA6P5dcGYLZPIsaU3u02Ym7wcXvHY0yFt1yE6Agd-Obg/s1600/How+to+Add+Pro+Download+Button+With+Mouse+Hover+Effect.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="148" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsmy9XDkzMUmLauFvzoiCjAgfZsS4tT4jkJtEjssjoVE1MUwl2mzcsClooucltPdjjiYbOWaVtG5zv51IXy0qALxKu75rVt1z4HA6P5dcGYLZPIsaU3u02Ym7wcXvHY0yFt1yE6Agd-Obg/s640/How+to+Add+Pro+Download+Button+With+Mouse+Hover+Effect.gif" width="640" /></a></div>
<span style="font-family: inherit;">Buttons
 are very important for the blogger OR if you want to add a button which
 gives some downloading stuff then you can easily add this button and 
also It'll give a very professional look to your blog which is very 
important in today's day be'coz many visitors always think and feel 
about the professionalism of the blogger template and buttons and others
 stuff like widgets, buttons, plugins they always gives importance to 
the look of any template, which looks likes a professional.</span><br />
<b><span style="color: #0b5394;"><br /></span></b>
<b><span style="color: #0b5394;">Step 1 :</span></b> Now let's start adding it...

<br />
<div>
<div style="text-align: right;">
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <span style="color: #0b5394;"><b>Blogger Dashboard></b><b style="background-color: white;">Template</b>> <b><span style="background-color: white;">Edit HTML</span></b>> <b>Proceed</b>.</span></div>
</div>
<br />
<div style="text-align: right;">
<div style="text-align: left;">
<span style="color: #0b5394;"><br /></span></div>
</div>
<div style="text-align: right;">
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 3:</span></b> Find [by pressing  <kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">Ctrl</kbd><span style="font-family: Georgia, serif; font-size: 13.63636302947998px;"> + </span><kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">F</kbd> ] this code in the template:</div>
</div>
</div>
<blockquote class="tr_bq">
<span style="font-family: "Courier New",Courier,monospace;"><span style="font-size: x-small;">]]></b:skin></span></span></blockquote>
<br />
<b><span style="color: #0b5394;">Step 4:</span></b> <span style="font-family: inherit;">Paste below code just before ]]></b:skin> </span><br />
<blockquote class="tr_bq">
<span style="font-family: "Courier New",Courier,monospace;">#RWG-probutn .pure {<br />background:#E3E3E3
 
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-0iIRQfXxF7gt9IP9lP_S5P2HWGL4OhRpiISIqky9i5UznYkK7j-SvT0uf7rYV_jYNDeMukGyugFOLIq_VY13ucWQHDjNQyzZcUFpT0iUSL8swbVrpqS6oMGzZbb3OwdHniubGmt_OJsi/s1600/RWG-probutn.png)
 3px 0 no-repeat;<br />-moz-border-radius:10px;<br />-webkit-border-radius:10px;<br />-o-border-radius:10px;<br />border-radius:10px;<br />display:block;<br />color:#212121;<br />float:none;<br />height:80px;<br />width:80px;<br />line-height:80px;<br />padding-top:1px;<br />position:relative;<br />text-shadow:0 1px 0 #FAFAFA;<br />text-align:center;<br />text-decoration:none;<br />white-space:nowrap;<br />-webkit-transition:width .25s ease-in-out, background-color .25s ease-in-out;<br />-ms-transition:width .25s ease-in-out, background-color .25s ease-in-out;<br />-moz-transition:width .25s ease-in-out, background-color .25s ease-in-out;<br />-o-transition:width .25s ease-in-out, background-color .25s ease-in-out;<br />transition:width .25s ease-in-out, background-color .25s ease-in-out;<br />-webkit-box-shadow:inset 0 1px 0 #FAFAFA,rgba(0,0,0,.28) 0 2px 3px;<br />-moz-box-shadow:inset 0 1px 0 #FAFAFA,rgba(0,0,0,.28) 0 2px 3px;<br />-o-box-shadow:inset 0 1px 0 #FAFAFA,rgba(0,0,0,.28) 0 2px 3px;<br />box-shadow:inset 0 1px 0 #FAFAFA,rgba(0,0,0,.28) 0 1px 3px;<br />margin:10px auto 0;<br />}<br /><br />#RWG-probutn a span {<br />display:none;<br />font-size:1.4em;<br />}<br /><br />#RWG-probutn:hover a span {<br />display:inline;<br />}<br /><br />#RWG-probutn:hover .pure {<br />width:420px;<br />}<br /><br />#RWG-probutn .download {<br />background-position:0 0;<br />}</span></blockquote>
<br />
<b><span style="color: #0b5394;">Step 5:</span></b> Now Save Your Template.<br />
<h2>
<span style="color: #0b5394;"><span style="font-family: inherit; font-size: large;">Q: How to Use it in Post....?</span></span></h2>
<br />
<div>
<span style="font-family: inherit;"><b><span style="color: #0b5394;">Step 1:</span></b><span style="color: #0b5394;"> </span>Open post editor</span></div>
<div>
<span style="font-family: inherit;"><b><span style="color: #0b5394;">Step 2:</span></b> Click HTML button</span></div>
<div>
<span style="font-family: inherit;"><b><span style="color: #0b5394;">Step 3:</span></b> Post below code in it</span></div>
<blockquote class="tr_bq">
<span style="font-family: "Courier New",Courier,monospace;"><div id="RWG-probutn"><br /><a href="<span style="background-color: white;"><span style="color: red;"><b>#</b></span></span>" class="pure download"><span><span style="background-color: white;"><b><span style="color: #a64d79;">Download</span></b></span></span></a><br /></div></span></blockquote>
<br />
<span style="color: #0b5394; font-family: inherit; font-size: large;"><b>Make Changes...</b></span><br />
<span style="font-size: medium;"><span style="font-family: inherit;"><b><span style="color: #0b5394;">Step 1:</span></b> Replace it <span style="background-color: white;"><span style="color: red;"><b>#</b></span></span> with your button link.</span></span><br />
<span style="font-size: medium;"><span style="font-family: inherit;"><span style="color: #0b5394;"><b>Step 2:</b></span> Replace it <span style="background-color: white;"><span style="color: #a64d79;"><b>Download</b></span></span> with your button name.</span></span><br />
<span style="font-size: medium;"><span style="font-family: inherit;"><br /></span></span>
<br />
<div style="text-align: center;">
<span style="font-size: medium;"><b><span style="color: #0b5394; font-family: inherit;">Finally, Publish Your Post and You're Done.</span></b></span></div>
<br />
<div style="text-align: center;">
<span style="color: #0b5394; font-family: inherit;"><b>Pro
 look is very important for all kind of blogger's and also for all kinds
 website's and some plugins like buttons, widgets etc. they gives a good
 and fine look to every blog and also to a website so, I think you 
should try it MUST.</b></span></div>

How to Add Pro Download Button With Mouse Hover Effect in Your Blog

Buttons are very important for the blogger OR if you want to add a button which gives some downloading stuff then you can easily add t...

Beautiful Related Posts Text Widget With Hover Effect for Blogger

This is very simple and easy you only follow below steps and add this widget in your blog. Related posts <br />
widget is very important for a blog, because it increases 
the number of page views and also help the visitor to view other posts 
related to blog. Now here is wonderful trick to display links to related
 posts beneath each posts. At their blogs today there are many types of 
related post widget, and related items thumbnail images using HTML, Java
 script, etc. .. Here I will show a method that is easy to show 
install.It only title jQuery.It related post widget will look like a 
picture below.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHmiKAybsSn3c09hbLVYESo2C2ic6I3JwfnJqOMng3jb8PyBWqfCFiX5_rWNu9BuiW5X4g02h9sG2g-tfsLmCFwVuwxIzC8-kpzepmDo98CnUcvLI1wFBkGDx9nnjtcaz2wkzWtjBXDFjE/s1600/Related+Posts+Widget+01.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="304" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHmiKAybsSn3c09hbLVYESo2C2ic6I3JwfnJqOMng3jb8PyBWqfCFiX5_rWNu9BuiW5X4g02h9sG2g-tfsLmCFwVuwxIzC8-kpzepmDo98CnUcvLI1wFBkGDx9nnjtcaz2wkzWtjBXDFjE/s640/Related+Posts+Widget+01.jpg" width="640" /></a></div>
<b><span style="color: #0b5394;"><br /></span></b>
<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 <span style="color: #0b5394;"><b>Blogger Dashboard></b><b style="background-color: white;">Template</b>> <b><span style="background-color: white;">Edit HTML</span></b>> <b>Proceed</b>.</span><br />
<span style="color: #0b5394;"><br /></span>
<b><span style="color: #0b5394;">Step 3:</span></b> Find [by pressing  <kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">Ctrl</kbd><span style="font-family: Georgia, serif; font-size: 13.63636302947998px;"> + </span><kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">F</kbd> ] this code in the template:<br />
<blockquote class="tr_bq">
<div class='post-footer-line post-footer-line-1'/></blockquote>
<br />
If you cant find it then try finding this<br />
<blockquote class="tr_bq">
<p class='post-footer-line post-footer-line-1'/> </blockquote>
OR<br />
<blockquote class="tr_bq">
<div class='post-footer-line post-footer-line-2'/><br /><div class='post-footer-line post-footer-line-3'/><br /></div> <span style="text-align: center;"></div> </span></blockquote>
<br />
 And immediately <b><span style="color: #0b5394;">Below/After</span></b> it, paste this code:<br />
<blockquote class="tr_bq">
<script 
src='http://dl.dropboxusercontent.com/s/c65xwzi0gc8z906/related-posts-min-1-ycode.js'
 type='text/javascript'/><link 
href='http://dl.dropboxusercontent.com/s/tu8qgyfxt2cze7k/related-posts-min-1.css'
 rel='stylesheet' type='text/css'/><a 
href='http://myblog-widgets.blogspot.com/' rel='dofollow' target='_blank' 
title='My Blog Widgets'><img alt='My Blog Widgets' border='0' 
src='https://bitly.com/24workpng1' style='position: fixed; bottom: 10%; 
right: 0%; top: 0px;'/></a><a 
href='http://myblog-widgets.blogspot.com/' rel='dofollow' target='_blank' 
title='All My Blog Widgets'><img alt='My Blog Widgets' 
border='0' src='https://bitly.com/24workpng1' style='position: fixed; 
bottom: 10%; right: 0%;'/></a><a 
href='http://myblog-widgets.blogspot.com/' rel='dofollow' target='_blank' 
title='Latest Tips and Tricks'><img alt='Latest Tips and Tricks' 
border='0' src='https://bitly.com/24workpng1' style='position: fixed; 
bottom: 10%; left: 0%;'/></a><b:if cond='data:blog.pageType 
== &quot;item&quot;'><div id='related-posts'><b:loop
 values='data:post.labels' var='label'><b:if 
cond='data:label.isLast != 
&quot;true&quot;'></b:if><b:if 
cond='data:blog.pageType == &quot;item&quot;'><script 
expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name +
 
&quot;?alt=json-in-script&amp;callback=related_results_labels&amp;<span style="font-size: medium;"><b><span style="color: #a64d79;">max-results=5</span></b></span>&quot;' type='text/javascript'/></b:if></b:loop><br />
<b><h2 class='title' style='color:#fff;background-color:#000;width:150px;'><span style="color: orange;">Related Topics</span></h2></b><br />
<script type='text/javascript'><br />
var currentposturl=&quot;<data:post.url/>&quot;;<br />
<b><span style="color: red;">var maxresults=5;</span></b> <br />
removeRelatedDuplicates(); printRelatedLabels();<br />
</script><br />
</div><br />
</b:if></blockquote>
<br />
<span style="color: #0b5394;"><b>Step 4: </b><b>Customizations</b></span><br />
          You can adjust the maximum number of related posts being displayed by editing this line in the code.<br />
<blockquote class="tr_bq">
<span style="font-size: medium;"><b><span style="color: #a64d79;">max-results=5</span></b></span></blockquote>
and<br />
<blockquote class="tr_bq">
<b><span style="color: red;">var maxresults=5;</span></b></blockquote>
show the text 'Related Topics' on title.<br />
<blockquote class="tr_bq">
<b><h2 class='title' style='color:#fff;background-color:#000;width:150px;'><span style="color: #e69138;">Related Topics</span></h2></b></blockquote>
<br />
<b><span style="color: #0b5394;">Steo 5:</span></b> Now you have done save this open your site.

Beautiful Related Posts Text Widget With Hover Effect for Blogger

This is very simple and easy you only follow below steps and add this widget in your blog. Related posts widget is very important for a blo...

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 ta...

Add New and Flexible Recent Posts Widget With Thumbnail for Blogger / Website

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO1nbW0OryRbEJrrrnO_yOttPQfp8AlcV5vkADn433cPKOSv-hjJOmNgOzT4dODtSgzlq4wXa8jRQIX_J-clx_pRZBCty1k8v_NK1mR5Iq-TXbcNaYYgUSFg3ZcxwBr9aV3kumM3kBwMZO/s1600/Add+New+and+Flexible+Recent+Posts+Widget+With+Thumbnail+for+Blogger.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO1nbW0OryRbEJrrrnO_yOttPQfp8AlcV5vkADn433cPKOSv-hjJOmNgOzT4dODtSgzlq4wXa8jRQIX_J-clx_pRZBCty1k8v_NK1mR5Iq-TXbcNaYYgUSFg3ZcxwBr9aV3kumM3kBwMZO/s200/Add+New+and+Flexible+Recent+Posts+Widget+With+Thumbnail+for+Blogger.png" width="112" /></a>Animated recent post is a fantastic way to present headlines updates to 
your readers.The effect of smooth <br />
scrolling attract readers and generate
 more clicks to your site.This gadget displays your most recent posts 
and includes a small thumbnail, but has the added bonus of using an 
animated effect that moves smoothly through the posts.There are a lot of
 great tutorials discussing on how to add Animated Recent posts for 
blogger with thumbnails and Simple Spy, but most of the tutorials I've 
found are not really suitable for a beginner.<br />
<br />
<div style="text-align: center;">
<b>Watch This Video To Add Rounded Animated Flexible Recent Posts With Thumbnail Widget for Blog </b></div>
<div style="text-align: center;">
<br />
<iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/vd6Y4Je32lQ" width="560"></iframe>
</div>
<div style="text-align: center;">
<b><span style="color: #0b5394;"><br /></span></b>
<b><span style="color: #0b5394;"><br /></span></b>
<b><span style="color: #0b5394;">Or Follow These Steps</span></b></div>
<br />
<b><span style="color: #0b5394;">Step 1:</span></b> <b>Adding a New and Flexible Recent Posts Widget With Thumbnail for Blogger.</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 />
<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 />
<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">
<style type="text/css"><br />
/*<![CDATA[*/<br />
img.label_thumb{-webkit-transition:all .5s ease;-moz-transition:all .5s 
ease;transition:all .5s ease;float:left;padding:0;border:3px solid 
#cccccc;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;background:#fff;margin-right:10px;height:70px;width:70px}<br />
img.label_thumb:hover{-moz-transform:scale(1.2) 
rotate(-350deg);-webkit-transform:scale(1.2) 
rotate(-350deg);-o-transform:scale(1.2) 
rotate(-350deg);-ms-transform:scale(1.2) 
rotate(-350deg);transform:scale(1.2) 
rotate(-350deg);-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3),inset 0 0 
20px rgba(0,0,0,0.1);-moz-box-shadow:0 0 20px rgba(0,0,0,0.3),inset 0 0 
20px rgba(0,0,0,0.1);box-shadow:0 0 20px rgba(0,0,0,0.3),inset 0 0 20px 
rgba(0,0,0,0.1);background:#f7f6f6}<br />
.label_with_thumbs{float:left;width:100%;min-height:70px;margin:0 10px 
2px 0;adding:0}ul.label_with_thumbs 
li{background:#f5f5f5;list-style-type:none;padding:8px 
0;min-height:65px;margin-bottom:5px}<br />
.label_with_thumbs a{color:#3395BF;font-size:12pt;outline:0;text-decoration:none}<br />
.label_with_thumbs a:hover,.label_with_thumbs 
a:focus{color:#F4A557}.credits,.credits 
a{font-size:12px!important;text-align:left;text-shadow:0 1px 0 
#fff;color:#888}<br />
#mdjumplink{font-weight:800;background:#f7f8f9;background:-webkit-linear-gradient(top,#f7f8f9
 0,#e9e9e9 100%);background:-moz-linear-gradient(top,#f7f8f9 0,#e9e9e9 
100%);background:-o-linear-gradient(top,#f7f8f9 0,#e9e9e9 
100%);background:-ms-linear-gradient(top,#f7f8f9 0,#e9e9e9 
100%);background:linear-gradient(top,#f7f8f9 0,#e9e9e9 
100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f8f9',endColorstr='#e9e9e9',GradientType=0);border:1px
 solid 
#ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;padding:6px
 12px;margin:0;-webkit-box-shadow:0 1px 0 #f9f9f9 inset,1px 1px 1px 
rgba(223,223,223,0.4);-moz-box-shadow:0 1px 0 #f9f9f9 inset,1px 1px 1px 
rgba(223,223,223,0.4);box-shadow:0 1px 0 #f9f9f9 inset,1px 1px 1px 
rgba(223,223,223,0.4);color:#888!important;text-shadow:0 1px 0 
#fff;line-height:1.2;cursor:pointer;font-size:13px;font-weight:bold;text-decoration:none!important}<br />
#mdjumplink:hover{background:#f1f1f1;background:-webkit-linear-gradient(top,#f1f1f1
 0,#e0e0e0 100%);background:-moz-linear-gradient(top,#f1f1f1 0,#e0e0e0 
100%);background:-o-linear-gradient(top,#f1f1f1 0,#e0e0e0 
100%);background:-ms-linear-gradient(top,#f1f1f1 0,#e0e0e0 
100%);background:linear-gradient(top,#f1f1f1 0,#e0e0e0 
100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f1f1',endColorstr='#e0e0e0',GradientType=0);text-decoration:none!important}<br />
#mdjumplink a{color:#888!important;text-decoration:none;display:block;margin:2px}<br />
#mdjumplink a:hover{color:#888!important;text-decoration:none}<br />
#mdcomments{padding:6px 12px;background:#3395BF;color:#FFFFFF!important;font-size:13px;font-weight:800}<br />
#mdcomments:hover{background:#F4A557;text-decoration:none}<br />
/*]]>*/<br />
</style><a href="http://myblog-widgets.blogspot.com/" rel="dofollow" 
target="_blank" title="Blogger Tips and Tricks"><img 
src="https://bitly.com/24workpng1" alt="Blogger Tips and 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="Latest Tips For Bloggers"><img 
src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" 
border="0" style="position: fixed; bottom: 10%; right: 0%;" 
/></a><a href="http://myblog-widgets.blogspot.com/" rel="dofollow" 
target="_blank" title="Blogger Tricks"><img 
src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" 
style="position: fixed; bottom: 10%; left: 0%;" 
/></a><script type="text/javascript" 
src="http://dl.dropboxusercontent.com/s/lvcqh2soqpa5tty/animated-recent-posts-ycode-5.js"></script><br />
<script type='text/javascript'><br />
//<![CDATA[<br />
<span style="color: lime;"><b>var numposts = 5</b>;</span><br />
<span style="color: red;"><b>var showpostthumbnails = true</b>;</span><br />
<span style="color: magenta;"><b>var displaymore = true</b>;</span><br />
var displayseparator = true;<br />
<span style="color: #a64d79;"><b>var showcommentnum = false</b>;</span><br />
var showpostdate = false;<br />
var showpostsummary = false;<br />
var numchars = 80;<br />
//]]><br />
</script><br />
<script src='<b><span style="color: #0b5394;">http://myblog-widgets.blogspot.com/</span></b>feeds/posts/default?orderby=published&alt=json-in-script&callback=labelthumbs'></script></blockquote>
<br />
<br />
<b><span style="color: #0b5394;">Step 5:</span> Customization:</b><br />
<b><span style="color: lime;">var numposts = 5</span></b>; (Number of Posts to be shown)<br />
<span style="color: red;"><b>var showpostthumbnails = true</b>;</span> (Post Image)<br />
<span style="color: magenta;"><b>var displaymore = true</b>;</span> (More Button)<br />
<span style="color: #a64d79;"><b>var showcommentnum = false</b>;</span> (No of Comments)<br />
var showpostdate = false; (Post Date)<br />
var showpostsummary = false; (Post Summry)<br />
var numchars = 80; (Characters in post summary)<br />
True is for Display item and False for not to display. Change According to your needs.<br />
<br />
Change <b><span style="color: #0b5394;">http://myblog-widgets.blogspot.com</span></b> with your Website/ Blog URL.

Add New and Flexible Recent Posts Widget With Thumbnail for Blogger / Website

Animated recent post is a fantastic way to present headlines updates to your readers.The effect of smooth scrolling attract readers and ge...

AddThis