rss
banner ad
0

How to Add 125×125 Banner Ads to Your Right Sidebar

Many people like to display 125×125 banner ads in their sidebar. In this tutorial, I’ll show you how to add them to your own site.

Step 1 – Upload a Generic 125×125 Banner

banner125The image to the right is already located in the /images folder found in your theme folder, so you can use that if you like. The file name is banner125.gif.

Alternatively, you can use your own generic 125×125 banner; just be sure to name it banner125.gif and upload it to the /images folder within your theme folder (or change the file name used below to reflect the name of your own file).

Step 2 – Create a New Text Widget in Your Right Sidebar for the Banner Ads

Add a new text widget to your top right sidebar, give it a title if you like. Then copy and paste the following code into the widget box:

<ul id="banner125" class="clearfix">

<li class="ad1"><a href="http://www.link1.com"><img src="http://www.mysite.com/wp-content/themes/wp-prolific-basic/images/banner125.gif" alt="banner ad" /></a></li>

<li class="ad2"><a href="http://www.link2.com"><img src="http://www.mysite.com/wp-content/themes/wp-prolific-basic/images/banner125.gif" alt="banner ad" /></a></li>

<li class="ad3"><a href="http://www.link3.com"><img src="http://www.mysite.com/wp-content/themes/wp-prolific-basic/images/banner125.gif" alt="banner ad" /></a></li>

<li class="ad4"><a href="http://www.link4.com"><img src="http://www.mysite.com/wp-content/themes/wp-prolific-basic/images/banner125.gif" alt="banner ad" /></a></li>

</ul>

Note 1: In the above code, you’ll need to change mysite.com to your own site domain name.

Note 2: In the img src code above, you may need to change the /wp-prolific-basic/ part to reflect the actual name of your theme folder.

For WP-Prolific Basic version, the img src would be:
<img src="http://www.mysite.com/wp-content/themes/wp-prolific-basic/images/banner125.gif" alt="banner ad" />

For WP-Prolific Premium version, the img src would be:
<img src="http://www.mysite.com/wp-content/themes/wp-prolific-prem/images/banner125.gif" alt="banner ad" />

For WP-Prolific Developer version, the img src would be:
<img src="http://www.mysite.com/wp-content/themes/wp-prolific-dev/images/banner125.gif" alt="banner ad" />

Step 3 – Replace the Generic Banners and Links With Real Ads

All you need to do is upload your 125×125 banner image(s) to the /images folder, and change the code above to reflect that.

For example, if you upload a new banner called ad125.gif, and you want to link that banner to www.solostream.com, you would simply change the code to this:

<li class="ad1"><a href="http://www.solostream.com"><img src="http://www.mysite.com/wp-content/themes/wp-prolific-basic/images/ad125.gif" alt="banner ad" /></a></li>

And that’s it. The Stylesheet is already set up to display the ads correctly.

About the Author

This is the author bio section from your user profile page. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi quis risus at nisl blandit feugiat. Ut vel orci quis sem dapibus iaculis. Aliquam ut nunc quis nisi tincidunt tincidunt. Pellentesque enim. Sed et leo nec augue mollis pharetra. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi quis risus at nisl blandit feugiat. Ut vel orci quis sem dapibus iaculis.

Leave a Reply




If you want a picture to show with your comment, go get a Gravatar.