How To Add 125 x 125 Ads Without Using A Plugin to WP Sidebar

By 8 Comments

Here you will learn how to add a 125 x 125 ads without using a plugin for WordPress - Some of you have been emailing me asking what plugin I use to display the 125 x 125 ad units in the sidebar of my blog.

Well the short answer is that I’m not currently using a plugin to make this happen, I’m just using a bit of simple HTML coding which I will share with you shortly.

There are however dedicated plugins such as WP125 plugin. You can actually find this plugin in the WordPress repository or via the plugins page in your WordPress dashboard.

The only snag I’ve found with this plugin is that on some themes, when you set it to 2 columns, it doesn’t quite fit into the side bar properly, and therefore it stacks unevenly, if that makes sense. So you get four 125 x 125 ad units in a vertical line, one on top of another.

125 x 125 ad without using a plugin

I’ve found its best used for blogs using themes that have a 300px width sidebar. If you’re using Thesis it’s quite simple, you just adjust the width of the sidebar to fit it in.

OK, so I prefer to not use a plugin, and if you want to do the same, below you will find the HTML code you will need to copy and paste into a text widget placed anywhere in your WordPress sidebar.

<div align="center">
<div class="textwidget"><a href="http://www.mybloggoeshere.com/page"><img class="ad-left" src="http://www.mybloggoeshere.com/photo.png" /></a>
<a href="http://www.mybloggoeshere.com/page"><img class="ad-right" src="http://www.mybloggoeshere.com/photo.png" /></a>
<a href="http://www.mybloggoeshere.com/page"><img class="ad-left" style="margin-bottom:0;" src="http://www.mybloggoeshere.com/photo.png" /></a>
<a href="http://www.mybloggoeshere.com/page"><img class="ad-right" style="margin-bottom:0;" src="http://www.mybloggoeshere.com/photo.png" /></a></div>
</div>

Once you’ve added the code and saved it. Go to media and upload 4 x of your 125 x 125 ad units into your image folder you want to display in the sidebar, then copy and paste the URL of each image into a note pad on your desktop for later.

Now go back to the widgets section, and locate the text widget with the above code you pasted earlier. Replace all the URL’s starting with src=”URL goes here“ with the image URL you pasted in the Note Pad document, it should replace the demo URL that’s currently in it’s place (http://myblog.com…). Hit save, clear cache and check to see if the images are showing. They should be… OK you’re not finished yet, you now need to link them up to their respectful pages.

Go back to the text widget in appearance > widgets and put the destination URL in which you want each of the 125 x 125 images linked to, i.e. an affiliate link. These URL’s need to be pasted to replace the URL located in <a href=”URL goes here“. Hit save again, clear your cache and check to make sure everything has gone smoothly. The 125 x 125 images should now be linked to their respected locations.

Troubleshooting

1. The images don’t appear aligned.
Solution - Check that the images are exactly 125 x 125 px.

2. The images appear to close to each other
Solution -  Add a margin value, default is set to 0.

3. I want more than just 4 ad units
Solution - Repeat the code into a new text widget.

  • http://www.rancorinfotech.com Aditya

    Hey Fab,
    Great review mate.And yes html coding can help in setting dimensions of an ad.Also if one don’t know the coding stuff then DREAMWEAVER is the best choice to have.One just have to put images on the page and all coding is done automatically,and adjusting the size then,should not be a problem.

    • http://www.magnet4marketing.net Fabrizio Van Marciano

      Thanks mate, I’ve never actually used Dreamweaver for anything, and I didn’t know that it could actually do that for you with HTML, sounds interesting now actually. I’ll have to check it out for the future. Thanks for the heads up.

      • http://www.rancorinfotech.com Aditya

        Let me know if it worked for you Fab,and also if it haven’t.May be i could help a lot more.

  • Ben

    Do you have any suggestion for other blogs platform, in particular Blogger?

    • http://www.magnet4marketing.net Fabrizio Van Marciano

      Hey Ben thanks for the question, I’d imagine you can use the same code for Blogger, I don’t see how it wouldn’t work. You would however need to host your images on a server somewhere else like Flickr or PhotoBucket. I’ll test it on one of my Blogger templates and see if it works sometime today mate. I’ll post an update here later :)

  • http://www.globalnetworkseo.com anshul

    Hi Feb!
    what a information.and i think if any one who don’t know the html there are no need to worry about this because coding will be set up automatically when you put any stuff on the page so it will work as a user friendly.nice work feb.i like it.
    thanks for the sharing this blog.

  • Samantha Wright

    Great tutorial Fabzy, I know exactly what you mean about getting WP125 fitting in some sidebars, it’s a real pain in the butt, I’m sure this little tutorial will work wonders for many. I’d also love to know if this code would work in blogger blog :) x

    • http://www.magnet4marketing.net Fabrizio Van Marciano

      Yes I’m glad you know what I mean by this. I’ll be testing it on Blogger template soon Sammy :)