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)
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)
|
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 »
Thks Mohd that is surely a handy widget. I am grateful to you!
ReplyDeleteGreat widget....... i always to wanted to know how to do it as i have blogspot blog.Thanks, for making it seem so simple.
ReplyDeleteyou welcome smith and Shabnam
ReplyDeleteThank you !
ReplyDeleteHi Mohd
ReplyDeleteThis 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
@Manisha
ReplyDeleteAdds 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.
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..
ReplyDeleteGood 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.
ReplyDeletehttp:///www.melandriaromero.net
Hi, thank you for this tips,wish i can use it in my next blogger,no space to add it in this.
ReplyDeletehttp://webizland.blogspot.com
@Melandria
ReplyDeleteDear 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.
Salam,Thanks dear Mohamed for your advice,it works now,but can't have space between the adds space ..Salam
ReplyDeletehttp://webizland.blogspot.com
Hey Mo,
ReplyDeleteThanks 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
@wayne
ReplyDeleteDear 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 :>
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
ReplyDeleteThis is great but now I was wondering if there is a way to hack it.
ReplyDeleteso 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/
@vishu
ReplyDeleteYou 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.
So easy and great!! Thanks.
ReplyDeleteCan I use the larger ads with that code and the code will create smallest version by itself !!!
ReplyDeletethanks bro...
ReplyDeletenais inpo, and I already replace my ENTRECARD inside widget ad banner, but with more explain. at here http://laptophacker.blogspot.com/
Cool...and it's work...
ReplyDeleteThanks...
thanx for, i need this.
ReplyDeletethanx for code, i need this.
ReplyDeletei din't get plz explain briefly and simply plzzz....bro.
ReplyDelete@Chetan
ReplyDeleteJust 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. :>
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@Anonymous
ReplyDeleteMake 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.
Love this!! I'm using it at the bottom of my blog as a place for my sponsors and affiliates.
ReplyDeleteNice one and simple too,bookmarked a long time back just applied today on my site
ReplyDeleteThanks a lot brother, love your blog so much. Love the way you share.. keep doing your best brother.
ReplyDeleteLombok, Indonesia
hmm i m not getting any advertisement for my site , other wise i will definitely use it ! :(
ReplyDeleteMohammad 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 ??
ReplyDeleteMohammad - 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.
ReplyDeleteThe source for my pictures is Picasa album, where I keep the all my photos for my blog. What am I doing wrong?
thanks, Martin
just few words for you YOU ARE AWESOME!
ReplyDeletehttp://totopcexpert.blogspot.com
Assalam-O-Alaikum Bro. What To Write At The Place Of Following???
ReplyDeleteURL OF ADVERTISER
URL OF BANNER’S IMAGE
AD DESCRIPTION
Sorry For Weak English!!!
a lot of information, visit http://info4indonesia.blogspot.com/
ReplyDeleteby 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
ReplyDeletehow will we get adsense code for 125*125 banner is it available in adsense or not please reply
ReplyDeletePLEASE HOW CAN WE USE THIS FORMULAR TO ADD HTML BANNER ADS?
ReplyDeleteBut 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.
ReplyDeleteif they put their ads how i can make money money with it
ReplyDeleteMohammad 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 ..:)
ReplyDeleteMohamed 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.
ReplyDeleteThis is an excellent tutorial. I so appreciate it! I could not find a 125x125 anywhere that was any good.
ReplyDelete@Mohammad Mustafa Ahmedzai Salam alaikum brother , how do i get the image url of the advitazer
ReplyDelete