27 July, 2013

Beautiful 125*125 Banner Ad Slot With Hover Effect

Saturday, July 27, 2013

Share it Please
Beautiful 125*125 Banner Ad Slot With Hover Effect

Beautiful 125125 Banner Ad Slot With Hover Effect



Every Blogger want to earn some money.So some of them use different advertisement ads on their blog and earn from them.And most of them like me offers visitors,readers and advertisers to place their ads on their blogs and they earn a good income from these ads.So Today, i am sharing Beautiful 125*125 Banner Ad Slot With Hover Effect for blogs with you people.Pretty design and look beautiful on mouse hover.

So Lets Start...

Beautiful 125*125 Banner Ad Slot With Hover Effect

Step 1
Go To Your Blogger Layout
Click On Add Widget
Add HTML/JAVA Widget
And Paste Below Code In It


<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 #3399FF; -webkit-border-radius:0px; -moz-border-radius:0px; -o-border-radius:0px; border-radius:0px; } </style>
 <div id="F4U-ads" align="left"> <table border="0"  cellpadding="2" cellspacing="6" width="265" bgcolor="#fff"><tbody> <tr> <td> <center> 
<a href="Advertiser URL" rel="nofollow"> <img border="0" alt="AD DESCRIPTION" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHZuKR7BI0S-0pcRz-4p-7PKS-gXO_QiLKsVnQ1Q-P9yVCCma9mKd-vuBMAIPpSSdaeeJUTm0M1OBtR6OJCHlDrNlQlBbzxBx4rlrndpSgZA93f600mtTQqcPFOGEyU7-ZZn9-IkiRW9c/s1600/ad-here.png" height="125"/></a> </center> </td> <td> <center> 
<a href="Advertiser URL 2" rel="nofollow"> <img border="0" alt="AD DESCRIPTION" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHZuKR7BI0S-0pcRz-4p-7PKS-gXO_QiLKsVnQ1Q-P9yVCCma9mKd-vuBMAIPpSSdaeeJUTm0M1OBtR6OJCHlDrNlQlBbzxBx4rlrndpSgZA93f600mtTQqcPFOGEyU7-ZZn9-IkiRW9c/s1600/ad-here.png" height="125"/></a> </center> </td> </tr> <tr> <td> <center> 
<a href="ADVERTISER URL 3" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHZuKR7BI0S-0pcRz-4p-7PKS-gXO_QiLKsVnQ1Q-P9yVCCma9mKd-vuBMAIPpSSdaeeJUTm0M1OBtR6OJCHlDrNlQlBbzxBx4rlrndpSgZA93f600mtTQqcPFOGEyU7-ZZn9-IkiRW9c/s1600/ad-here.png" height="125"/></a> </center> </td> <td> <center> 
<a href="ADVERTISER URL 4" rel="nofollow"> <img border="0" alt="AD DESCRIPTION" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHZuKR7BI0S-0pcRz-4p-7PKS-gXO_QiLKsVnQ1Q-P9yVCCma9mKd-vuBMAIPpSSdaeeJUTm0M1OBtR6OJCHlDrNlQlBbzxBx4rlrndpSgZA93f600mtTQqcPFOGEyU7-ZZn9-IkiRW9c/s1600/ad-here.png" height="125"/></a> </center> </td> </tr> </tbody> </table> </div>
You May Also Like: Facebook Like Popup Box Widget For Blogger

Instruction

Replace             with your Advertiser Url
Replace             with your Add Description
Replace             with your Image Url

Note:
if you find any problem regarding 'Beautiful 125*125 Banner Ad Slot With Hover Effect' feel free to comment below.

1 comments: