how to add banner ads in WordPress

How To Add Affiliate Banner Ads In WordPress Blog

I have often been asked how to add affiliate banner ads in a WordPress blog. In today’s post I will show you how to add banner ads under the header and also how to add banners into the widgets on the sidebar. As well, I will show you how to copy the affiliate banner ad images into your computer, upload them to a draft blog post and then, how to link these images to your affiliate link.

For this post I have created two videos. First one looks at adding banner ads under the header and the second shows how to add banner ads into the widgets. As I have previously talked about widgets in the WordPress tutorials, here I will only show you the video and if you want to read about the widgets and see the images related to this topic please see the post about widgets.

As well, because the videos I created are on YouTube as separate entities, there is a bit of repetition in the videos. So please bear with me.

The first topic to be covered is:

How To Add Affiliate Banner Ads Under The Header

The method I am going to show you is a little technical, but if you’ll watch the video and follow the steps, you will find it simple enough to do it yourself.

In this video, I will show you that in order to add a banner ad under the header you will need to go into the editor of your theme and add the header ad there. Although it is very simple to do, I want to caution you that before you make any changes to the editor files of your theme, always copy the original editor information to your notepad, just in case something will go awry (although, if you follow the steps I suggest, nothing will go wrong).

In the video I will give you 2 codes to copy into your ad:

1. First is the rel=”nofollow” code you need to add to your affiliate link to make sure that search engines will not follow it. I have discussed this topic at length in the post about nofollow links here… If you want to know more about nofollov links and why you need to use them, please do yourself a favor and read the nofollow article.

2. Second, you need to create a division when you add your banner ad under the header. The two codes (tags) I mention are:

  1. the opening tag: <div id=”ads”>
  2. closing tag: </div>

Your ad needs to be placed between the two tags (codes). As well, I always add a space between these tags to be on the save side.

In the text editor, your affiliate banner ad will look like the HTML code shown below:

<div id=”ads”>

<a href=”” target=”_blank” rel=”nofollow”><img class=”aligncenter size-full wp-image-150″ src=”” alt=”banner ad” width=”728″ height=”90″ /></a>


Published, it will look exactly as shown below, except larger (I use 728×90 banner, which is the typical size for a banner under the header):

banner ad


Note! If you are going to copy  <div id=”ads”> and rel=”nofollow” tags from this blog post and then paste it into your text editor of your draft post (as I suggest), make sure that you change the quotation marks to quotation marks typed in from your text editor. I noticed that for some reason, the published quotation marks get “corrupted” and look different than the quotation marks in the text editor. This “corruption” of quotation marks may cause the header ad not show up.

The last thing I want to mention is that because you are making changes in the editor of your theme, every time your theme will be updated these additions will disappear. So, if you want to keep the affiliate banner under the header of your blog, unfortunately, you need to do this process after each update of your theme.


How To Add A Banner Ad Under The Header In WordPress: Video



How To Add Affiliate Banner Ads To Widgets In WordPress Sidebar

In this section I will share the video that shows you how to add an affiliate banner ad into a widget of a sidebar. As I mentioned already, I have discussed the addition of text and images to widgets in the WP tutorials and if you are not clear about widgets, please refer to the tutorial that discusses this topic.



As you can see, adding affiliate banner ads in WordPress blog, be it in the widgets or under the header, is not a rocket science. Just to reiterate, though, you don’t have to be afraid of going into your editor and make some changes there. Just make sure that you copy the editor before you make any changes to it, to be on the save side.

If you enjoyed these videos and learned something from them, please leave me a comment and add a “Like” to Facebook and Google +. Thank you.


Don't Miss A Thing!  Sign Up For Weekly Newsletter & Updates
online success optin

Enter your name & email and  get a FREE copy of my ebook, Your Online Success Starts Here


, , , , , ,

5 Responses to How To Add Affiliate Banner Ads In WordPress Blog

  1. Rahul February 24, 2016 at 7:24 am #

    Such a awesome video, nicely define
    Thankyou for sharing such a informative post with us.

  2. Rahim November 22, 2015 at 6:13 am #

    very well defined Video ! i really appreciate it
    Thanks a lot

    Rahim recently posted…How to Defer Parsing of Javascript in WordPressMy Profile

  3. M-Minhaj June 30, 2015 at 8:17 pm #

    Hi Dita Irvine,

    Yes i am also looking for article how to add not affiliate but banner ads on my blog! Lastly i founded this great post.

    Really these 2 videos are great to teach how to add banner adds!

    Awesome video you made for us.

    Subscribed your channel (I am so worried to see only 47 subscribers)

    However, thanks for sharing useful article and videos with us. Keep it up.

    And would love to see your comment on my blog. Will you Dita?

    Happy blogging.
    M-Minhaj recently posted…How to get quality backlink PR 8 in just 3 minutes workMy Profile

  4. Worli May 16, 2015 at 7:00 pm #

    Hello Dita Irvine,

    Nice tips! saved the code, thank you!

    BTW, I think if you create a child theme, you don’t have to repeat the process every time you update your blog theme. Please read more about child theme in “WordPress Codex.” It will give you more information. There is a plugin too available for that.
    Worli recently posted…PDF to Word Converter OnlineMy Profile