How To Add A Banner Hyperlink In Wordpress Blog

Adding affiliate banners to your blog might not be something hard for those who knows how to do it but most newbies don't really know how to add banner ads on their website accept coping the already made code from their affiliate partner to their blog but what if you want to add custom ads that require you to provide your own banner and landing pages?

If you are new to blogging and not sure how to add clickable banner ads on your blog then I can help you because I really know how to get it done in few seconds but before then there are few things you need to get ready such as,

Landing pages URL

A landing page is a page where your banner ads will be redirected when someone clicks on it, it could be affiliate product pages or your own personal product page.

Get your banner ready

You need to have a banner designed to fit your desired widgets area but when it comes to affiliate marketing they might have good banner images for you to use or you can design one by yourself if you can.

Now, these two things are what you need mainly before you can add clickable banner ads to your blog but note this might not be necessary if your affiliate partners already have unique ad codes you can use.

Let us use Google's blogger for an example since you have the banner image and landing page URL address.

Goto your blogger dashboard and locate LAYOUT then you will Add Widgets options as you can see below.

Once you click Add Widgets a new small popup page will open and that is where you need to add your clickable banner ads codes, as I promised I will teach you how to do it.

Adding HTML tage

First, create a new post where you will upload your images see how I did mine below.

Note:

The post page you created will never be published because it contains nothing other than your affiliate or personal ad banners so you will need to save it as draft and copy the image URL by left clicking on the image and then select copy image address or copy link address as you can see below.

Then create the image code and URL code in HTML format as you can see.

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSjKtHgNMkr_XCXTTpF0gHsAV7npvZ2tdsWSP9KfHn8GernUJ99liVQMskmxCsMSYViOPOsdkhyhxn4Lp_5cQcMlw1SLIecKZARzfjW-KB0HXoOwdXJ6wTk7puNi05i6NFAI3HSYiIQsI/s1600/nettalk.png" />

Now, to make the banner clickable you need to add the landing page URL in this format.

<a href="http://www.xtremeloaded.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSjKtHgNMkr_XCXTTpF0gHsAV7npvZ2tdsWSP9KfHn8GernUJ99liVQMskmxCsMSYViOPOsdkhyhxn4Lp_5cQcMlw1SLIecKZARzfjW-KB0HXoOwdXJ6wTk7puNi05i6NFAI3HSYiIQsI/s1600/nettalk.png" /></a>

Adding Nofollow to the Banner Ads

In case you need to make the clickable banner ad Nofollow to avoid penalty from, search engines you will need to add this "rel="nofollow" immediately before the <a as you can see below.

<a "rel="nofollow" href="http://www.xtremeloaded.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSjKtHgNMkr_XCXTTpF0gHsAV7npvZ2tdsWSP9KfHn8GernUJ99liVQMskmxCsMSYViOPOsdkhyhxn4Lp_5cQcMlw1SLIecKZARzfjW-KB0HXoOwdXJ6wTk7puNi05i6NFAI3HSYiIQsI/s1600/nettalk.png" /></a>

Now save your widgets and refresh your page to see how the banner looks and equally clicks on it to be sure it redirects where you wanted it to be redirected.

Hope this helps, if you still need more help feel free to join the conversation and remember to check more awesome post like this in our Webmasters Category