Adding Banner ads to your blog is something you will want to know how to do if you plan to make money with your blog. You can add your Affiliate Banner Ad to your sidebar areas using widgets, or you can add them to the text part of your Posts, like the Hostgator Banner Ad I’ve added at the top of this Post. Both of these slightly different tasks are really easy to do…….once you know how.
Post Updated February 2016.
If you want to know more about how to Add Affiliate Links into words in the text Content part of your blog posts, see the updated article: How to Add Affiliate Links into Words and Text
Easy Guide: How To Add Banner Ads to Your Blog
First, you need to decide where you want to place your Banner Ads on your blog – Sidebars, Header area, Footer area, or within the text of a Post? What’s the difference? Adding a Banner Ad to your Sidebar, Header or Footer means that every Page and Post on your blog will display the same Banner Ad. Why?
It’s because Sidebars, Header Areas and Footer areas are the parts of your blog that are a static part of the overall blog design, so it will be visible on all your Posts and Pages as well as your Home page. Whereas, if you add your Banner Ad within the Content areas of a Post or Page – where you write your text – you can restrict the ad to be seen on that Post only.
How to Add Affiliate Ads To Side Bars
You use a different method to add a Banner Ad to a Sidebar area, than the way you add them into your Content areas. So first I’ll explain how to add Affiliate Banner Ads into your Sidebars.
Everything you can see in any blogger’s Sidebars, including Banner Ads, are put there using Widgets. A variety of Widgets are supplied as a part of your WordPress theme.
How to Add Widgets to Sidebars
This is really easy to do, once you know how. Widgets are included in every WordPress blog Dashboard. You find them at your Dashboard>Appearance>Widgets. There are widgets for Blogroll, Recent Posts, Categories, Archives, and many others too. You can find them all in the Widgets part of your WordPress Dashboard. All the things you can see in the right (or left) hand column (sidebar) of every Page and Post on this blog, are put there using Widgets.
For example: adding a Recent Posts Widget to your sidebar. First you find the relevant widget on the main Widget page of your dashboard. That is where all of the various standard Widgets are stored. In this example, you look for the Recent Posts Widget.
Then you drag that Recent Posts Widget across from your WordPress dashboard to the Widget Sidebar area of your choice. You then drop that Recent Posts Widget into your selected sidebar position. All done. Your Recent Posts are now visible, and automatically kept up to date by WordPress, and will be seen on every Page and Post of your blog.
Check out how it looks on your site, marvel at your own cleverness (briefly) and then read on to find out how to add Affiliate Banner ads to your blog, so you can start to get those millions rolling in.
How to Add Banner Ads to Side Bars Using Widgets
If you want to add an Affiliate Banner Ad to a sidebar, you use a Widget called Text (Arbitrary text or HTML) widget, which comes included with your WordPress Theme. You find that widget from the Widgets part of your WordPress dashboard, and drag it across and drop it into one of the Sidebar areas just like you did with your Recent Posts widget. Now there is an extra step you have to make to add the Affiliate Banner Ad into that blank (as yet) Widget.
After you’ve dropped your blank Text Widget into your Sidebar area, stay on your Widget area page of your Dashboard that shows your Text (Arbitary text or HTML) sitting in your sidebar. There is a Drop Down Menu which drops down from your Text Widget and opens up a space in that Text Widget.
That widget space is where you copy/paste the Affliate Banner Ad HTML Code you previously organized and received for the Affiliate product you want to promote, sell, so you can earn your commission from the maker of that product..
Yes, it involves HTML, but in this case, it really is easy.
If you want to know more about Affiliate Marketing, Affiliate Links, understanding the HTML of Affiliate Links, how to add that HTML Affiliate Link HTML into the HTML version of your Blog’s articles, and how you can make money from Affiliate Marketing, see the updated article
How To Add Affiliate Links Into Words and Text.
Back to your Widget:
Your Affiliate Company (the company that has something you want to sell for a Commission on sales), say Hostgator, has already provided you with your own personalized HTML code for your Banner Ad. You just copy/paste that line of Affiliate Linked HTML Code into that blank Widget’s Drop-Down Text area. Then Save, and Update…..and there it is! Brilliant!
The first time you do this, you will feel very clever! I promise you! And of course, you are very clever, because you have learned to do something new, and it worked, and now you can sit back and watch the millions role in. Easy! Congratulations.
Now you are ready to be even more clever……
.
How to Add a Banner Ad into the Text of Blog Posts
No widgets required for this task. Open a New Post from your Dashboard and write your Post’s content text where you want to promote or review your chosen Affiliate Banner Ad.
You can read a detailed explanation of Affiliate Marketing, Affiliate Links, and the process of how to get your personalized identifying HTML Affiliate Link from the maker of the product you want to sell, at the updated article How To Add Affiliate Links into Words & Text.
OK, your Affiliate Company has already given you the HTML Code for your Banner Ad with it’s embedded personalized HTML code.
Now, staying on your already written Post’s Editing window (where you have written your product review), click the tab ‘Text ‘at the top right of your Editing page where it says Visual or Text.
You are now looking at the HTML version of what you previously wrote in the Visual Editor Content area using normal words. But don’t panic – you do not have to know anything about HTML to do this next bit.
You look at this HTML version of your post page and find the place in the text where you want to place your Banner Ad. This can be tricky to do if you are not familiar with HTML.
I often look for a Heading that is near where I want to place the Banner Ad, and find the place in the HTML text from there.
Left click to place your cursor at that desired place in the HTML Code text version of your post. Then copy/paste your affiliate’s Banner Ad HTML code into your post’s HTML version at the selected place.
Click update, and check how it looks in real life by clicking the Visual tab at the top right of the window.
And there it is! Your Affiliate Banner Ad, brilliantly embedded into the Content area of your article. Of course it also has your ‘hidden’ identifying link that tells your Affiliate that it was you who sent that reader/potential customer to them.
If one of your readers clicks on your Banner Ad with it’s link and decides to buy a product from that Affiliate, the Affiliate will send you the commission. Brilliant. Easy as. And the best part is that you write your review once, add the banner ad once, and the link sits there potentially bringing in commissions while you are asleep or down at the beach! Nice work, friends.
Once again, you will feel very clever – Yes!
My next post will offer all the current Hostgator Discount Hosting Coupons with details of which particular discount each one delivers to you, how they work, and what you have to do to cash in on those Coupon special offers.
…..Cue Motto!
Plan Well. Start Small. Think BIG!
Never miss our latest articles, get regular email updates: Subscribe to our Newsletter:
Thank You very much. It is so simple but brilliant.
No worries, Natalia, glad you found it useful. It’s amazing how all these things seem so baffling when you don’t know how to do them, but are so easy once you know how.
Carol
Thanks for the helpful info, admin. I’ll feel more than clever if it works for me. I’ll feel like a genius. lol
Regards,
Susan
Well done Susan – of course you are a genius! Good luck on your blogging adventures and I wish you many more genius moments – and don’t forget to tell your friends, sometimes they don’t notice how brilliant we are.
Pingback: Tutorial: How To Add Affiliate Links into Text & Images
Thanks a MILLION!!!!!! I did it 🙂
Well done Anita. You are now officially a geek Grade 1 – now brag about it to your friends, or family. Sometimes you just need to impress people…right?
I notice at your blog that you have used upper case letters throughout. Using capitals like that is generally interpreted as SHOUTING at people, and bad online manners.
Some people might be turned off by this. Just saying, OK? and maybe something to think about.
This is the only thing that is working on my blog, manually paste the code in every post.
The thing is, that I would like to place the ad-code in the template code, so it appears in every post footer. I have read so many guides and non of them is working. Does anyone know how to do this or can tell my where there is a guide, that is not just a copy from another website? I have read about this so many places and I can’t get it to work 🙁
Hi Michael. If you want to add an Affiliate Banner code so it is appears on every page and post, you have to add it into a widget, and put the widget in either your sidebars, or footer, or widget areas in your Head section if your theme provides them there. If you do that your banner ad will always appear on every page and post because it has been added to your website theme itself, not your Content areas (the text of your Pages and Posts).
I explained how to do that in the first part of this Post: adding Affiliate Banners to Sidebars using widgets. It’s exactly the same for adding them in widgets into your Footer – just a different location of the widget.
That is what is meant by ‘site wide’ – added to your theme structure (using widgets), and not your written Content areas.
So to add an affiliate banner into your footer, you must drag and drop a Widget into your Footer Widget area (on your Dashboard>Widgets screen) and then copy/paste your affiliate banner code into that widget’s text area. Upload, and it’s done.
Pingback: How to Add Nofollow Links to Blogroll, Feedburner & Affiliate Widgets
Thanxs for such lovely tricks really i have no idea in this field and you thought me how to add a banner in a word press site the credit goes to you thanxs alot love you for this bye….!!!!
I’m glad you found it useful Shahbaz – it’s fun isn’t it!
Really helpful thank you!!
Hi Carol, very well written article I must say. It is surprising how many people do not know how to monetize their web site or blog and end up losing interest in what they are trying to achieve. I only hope that several of those that were on the brink of throwing the towel in, read your article.
Yes it is true. Adding banner ads is only the first step in the money making process though.
Do we choose a certain wordpress theme from the very start to anticipate spaces for left and right side of thee blogs for adverts later on?
I use the Weaver II theme – you can choose how many columns and whether you have left or right hand sidebars. Check that any theme you choose has plenty of design options unless you know exactly what you want.
Hello Carol.
You have done a fantastic job in explaining how
to add affiliate banners to one’s blog. Even though
some people have “banner blindness” it is still worth it to set it up.
I’ll be checking here on the site more often for more great tips!
Much success,
Christian
Thanks Christian!
Great write up. This was very helpful for me as I am planning to provide ad space for advertisers on my blog. Keep up the good work.
Well done, Arpit – good luck with your site.
I followed the steps above but i don’t get the banner.It only displays the html link on my blog.
Hi Brown, I do not know why you are not getting your banner ads displayed properly on your blog. I do know that this article explains in detail how I do it and it works for me, and also hundreds of other people who do it the same way.
Perhaps if you reread my article and try again, it might work for you. Otherwise I cannot give you any more information – sorry. Goodluck.
Great post Carol! Very straightforward and to the point, I understood this in a matter of minutes.
hello
What you have said is clear, but in the text widget, its not showing any html, only content and title is shown, when I paste the link in the content area, the link is only seen on the website not the banner. I want the banner to be visible, please let me know how to do this.
Kavitha
Hi Kevitha. I’m not sure where your problem is, so I will explain exactly how and where you get your banner code for your banner ad.
1. First, join the Affiliate Program of the website or product you want to promote on your blog.
2. You then select the specific banner ad you want to use from the examples offered at your Affiliate’s website.
3. When you select that banner, the Affiliate’s website will give you your personalized HTML code that will display that banner ad (and includes the identifying code that tells your Affiliate’s website that any clicks on that add came from your website).
4. Open your text widget in your Dashboard.
5. Paste the HTML code you got from your affiliate’s website into the widget
6. If you wish, you can add your own text as a Title for the widget.
7. When you click ‘Save’ at the bottom of the Widget, the banner add appears in your sidebar.
Hope that helps.
Carol
How can i put the ads just like your first ads (top right side) so that first paragraph letters covers it up.
PLZ HELP
Hi Nabodit, this can be tricky. I find you have to experiment with the size of the banner ad and if necessary try to edit your spacing in the HTML version of your post.
I just try trial and error until I get it to look ok. Sometimes I have to change the location and/or size dimensions of the affiliate ad to a bit later in the post and with a shape that stretches across the text lines.