125 by 125 Ad Banner Widget For Blogger/Blogspot Blogs.

 

125-by-125-Ad-Banner-Widget

 

Early this morning I tried to create some tables using simple HTML. Remarkably I arrived at a really easy and well optimized code that could be used to show your 125 by 125 Ad banners just like the one on my sidebar. This widget is named “125 by 125 Ad Banner Widget

See an example below,

 

 

 

 

         

 125 by 125 Ad Banners Widget  (1)

AD DESCRIPTION AD DESCRIPTION
AD DESCRIPTION AD DESCRIPTION

Here is the code to be pasted in your HTML/JavaScript Widget,

<div align="center">
<table border="0"  cellpadding="2" cellspacing="6" width="265" bgcolor="#ffffff">
<tbody><tr>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>
</tr>
<tr>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>
</tr>

</tbody></table>

<table border="0" bordercolor="#0084ce" cellpadding="2" cellspacing="6" width="265" bgcolor="#ffffff">
<tbody>
      <tr>
       <td><center><a href="URL OF ADVERTISER" rel="nofollow"><img width="265" height="37" border="0" alt="Advertise Now!" src="URL OF BANNER’S IMAGE" /></a></center></td>
      </tr>


    </tbody></table>

</div>

 

Now make the following changes,

1.  Replace URL OF ADVERTISER with the website link of the advertiser

2.  Replace URL OF BANNER’S IMAGE with the Image link of the Advertiser’s banner

3.  Replace AD DESCRIPTION with some information related to the Ad. The description appears when some hovers his mouse cursor over the banner.

4.  If you want to increase the distance between the ad blocks then adjust width="265" . By default 265 is the minimum width of this banner widget. You can’t further decrease the width.

 

  • If you want to increase the number of rows of this ad widget and want to add two other Ad blocks i.e 6 ad blocks. Then simply copy paste the code below just above </tbody></table>

<tr>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>
</tr>

 

 

  • If you want to have a more fancy Ad widget like the one below,

125 by 125 Ad Banners Widget  (2)

BEST--- 2
3 4
 

ADVERTISE

then copy and paste the code below in your HTML/Javascript Widget

<div align="center">
<table border="0"  cellpadding="2" cellspacing="6" width="265" bgcolor="#ffffff">
<tbody><tr>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>
</tr>
<tr>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>

<td><center><a href="URL OF ADVERTISER" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="125" src="URL OF BANNER’S IMAGE" height="125"/></a></center></td>
</tr>

</tbody></table>

<table border="0" bordercolor="#0084ce" cellpadding="2" cellspacing="6" width="265" bgcolor="#ffffff">
<tbody>
      <tr>
       <td><center><a href="URL OF ADVERTISER" rel="nofollow"><img width="265" height="37" border="0" alt="Advertise Now!" src="URL OF BANNER’S IMAGE" /></a></center></td>
      </tr>


    </tbody></table>

</div>

 

Follow the same steps as instructed above to customize this new code.

If you are searching for some Ad Banner Images than may be you will like the Animated 125 by 125 AD Banners

I hope you will surely like this widget. The internet is full of tutorials for such a widget but most of them use complex CSS and ask you to edit your blogger template but this one is using simple HTML and is a copy-paste widget code. Kindly let us know how you find it.

If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »

44 comments

PLEASE NOTE:
We have Zero Tolerance to Spam. Chessy Comments and Comments with 'Links' will be deleted immediately upon our review.
  1. Thks Mohd that is surely a handy widget. I am grateful to you!

    ReplyDelete
  2. Great widget....... i always to wanted to know how to do it as i have blogspot blog.Thanks, for making it seem so simple.

    ReplyDelete
  3. Hi Mohd
    This is a great tutorial ,I would like to know how we should register for the ads?how we can search or know right ads to put (resource for ads )?for eg. http://www.thechildhealthsite.com ads I see in many blogs and website ,how do we connect with it and place ad in our website.This info shall help a lot to put few more ads in my site.
    Awaiting ur reply
    Thanks

    ReplyDelete
  4. @Manisha

    Adds can either be bought or sell. Bloggers mostly prefer to be publishers i.e show ads on their blogs. You can get ads to display on your blog from many services like agitize.com, buysellads.com and technoratimedia.com. Most of these require more than 100,000 pageviews monthly so I guess at present you go with agitize.

    ReplyDelete
  5. I just setup my first blogger account and create my new blogger blog, your post is very helpful and help me to setup 125X125 banner display, thank you..

    ReplyDelete
  6. Good day, I tried your formula but it did not work in my blog, i really don't know what is wrong with it. I just copied it and paste it and do the procedure as written. Hope you can help me. Many thanks.

    http:///www.melandriaromero.net

    ReplyDelete
  7. Hi, thank you for this tips,wish i can use it in my next blogger,no space to add it in this.
    http://webizland.blogspot.com

    ReplyDelete
  8. @Melandria

    Dear your sidebar width is pretty small. These banners look good on magazine style templates that I usually design.


    @samaracande

    You can easily add it friend by adjusting the sizes a bit. You have enough space on right sidebar.

    ReplyDelete
  9. Salam,Thanks dear Mohamed for your advice,it works now,but can't have space between the adds space ..Salam
    http://webizland.blogspot.com

    ReplyDelete
  10. Hey Mo,

    Thanks very much for this. Just one question. How can i put a slight border around the ads? Or is it just easier to do it on PS?

    Thanks

    ReplyDelete
  11. @wayne

    Dear simply replace border="0" with,

    style="border:1px solid #289728;"

    and change the border width, style and colour accordingly.

    Replace border="0" as many times as it appears.


    Hope this was clear :>

    ReplyDelete
  12. Thnx for this great work. May I use some of your posts to my blog. I will also leave a credit link of your blog. My e mail ID is vishkumawat93@gmail.com

    ReplyDelete
  13. This is great but now I was wondering if there is a way to hack it.

    so every time you refresh it, it will show different image of ads but the same address referring.

    I really want one on my blog http://zeegi-comix.blogspot.com/

    ReplyDelete
  14. @vishu
    You surely can! :>

    @Zeegi
    That is a good idea and I will share this trick on my next post. Kindly give me a day or two.

    ReplyDelete
  15. Can I use the larger ads with that code and the code will create smallest version by itself !!!

    ReplyDelete
  16. thanks bro...
    nais inpo, and I already replace my ENTRECARD inside widget ad banner, but with more explain. at here http://laptophacker.blogspot.com/

    ReplyDelete
  17. Cool...and it's work...
    Thanks...

    ReplyDelete
  18. thanx for code, i need this.

    ReplyDelete
  19. i din't get plz explain briefly and simply plzzz....bro.

    ReplyDelete
  20. @Chetan

    Just copy the first code in your HTML/JavaScript widget and Replace URL OF ADVERTISER with the website link of the advertiser
    Replace URL OF BANNER’S IMAGE with the Image link of the Advertiser’s banner. That's it. Don't bother read the stuff after step#4. :>

    ReplyDelete
  21. Hi, I cannot make the url's work ( advertiser's urls); on back office i can put a correct html code but on a home page it turns to http://piccolocuoco.blogspot.com/ URL. Can you heklp me? Thanks!

    ReplyDelete
  22. @Anonymous

    Make sure you are only replacing URL OF ADVERTISER with a URL/link of the advertiser and not some sort of html code.
    If possible so then please make your question more clear buddy.

    ReplyDelete
  23. Love this!! I'm using it at the bottom of my blog as a place for my sponsors and affiliates.

    ReplyDelete
  24. Nice one and simple too,bookmarked a long time back just applied today on my site

    ReplyDelete
  25. Thanks a lot brother, love your blog so much. Love the way you share.. keep doing your best brother.

    Lombok, Indonesia

    ReplyDelete
  26. hmm i m not getting any advertisement for my site , other wise i will definitely use it ! :(

    ReplyDelete
  27. Mohammad can you please tel us how can we get advertiser add ???i have google adsense account how can we get that banner adds??on my blog ??

    ReplyDelete
  28. Mohammad - I like this code and it's a great design - however, it will not display the banners - only the basic outline of the box and the url links to websites. It will also display the comments I altered.
    The source for my pictures is Picasa album, where I keep the all my photos for my blog. What am I doing wrong?

    thanks, Martin

    ReplyDelete
  29. just few words for you YOU ARE AWESOME!
    http://totopcexpert.blogspot.com

    ReplyDelete
  30. Assalam-O-Alaikum Bro. What To Write At The Place Of Following???
    URL OF ADVERTISER
    URL OF BANNER’S IMAGE
    AD DESCRIPTION
    Sorry For Weak English!!!

    ReplyDelete
  31. a lot of information, visit http://info4indonesia.blogspot.com/

    ReplyDelete
  32. by displaying ads from other advertisers will my adsense account will be blocked or not because i once used Kontera ads my adsense account was blocked

    ReplyDelete
  33. how will we get adsense code for 125*125 banner is it available in adsense or not please reply

    ReplyDelete
  34. PLEASE HOW CAN WE USE THIS FORMULAR TO ADD HTML BANNER ADS?

    ReplyDelete
  35. But there is one thing. You said that we have to put url of our advertiser. But how to put that until we get an advertiser for our site. How to get the advertiser url. Plz help.

    ReplyDelete
  36. if they put their ads how i can make money money with it

    ReplyDelete
  37. Mohammad thanks for the post ,I wonder if you could tell me how the code needs to be changed to run the squares horizontally under the Header I have customized the template accordingly to let me do this just need the correct code to put in thanks ..:)

    ReplyDelete
  38. Mohamed thanks for tutorial, but I want you to take a look at the code above, you have 5 banners ads placement instead of 4 and the one for six, you have 7 around the please. Your blog has really thought me a lot in the blogging tricks.

    ReplyDelete
  39. This is an excellent tutorial. I so appreciate it! I could not find a 125x125 anywhere that was any good.

    ReplyDelete
  40. @Mohammad Mustafa Ahmedzai Salam alaikum brother , how do i get the image url of the advitazer

    ReplyDelete