Skip to content

How to monetize classifieds website with banner ads

There are several ways to earn money from classifieds website: featured ads, making some classified categories paid, classifieds banner ads, contextual ads like Google AdSense and other banner networks. In this tutorial we will teach you how to monetize classifieds website with banner ads.

How to monetize classifieds website with banner ads

For banner ads you can use external services like buysellads.com and share 25% or revenue with them. In return you will be listed on their marketplace and attract potential advertisers. Payments are processed using paypal which is convenient in most cases.

If you do not want to share revenue or payment with card or paypal is not available for your advertisers then you can use your own banner system. With your own banner system you are very flexible with banner placement on your website. For example you can insert random banner after x number of items in list view. This is targeted for visitors on mobile phones.

Setup your own banner advertisement system

For using you own banner system we need following:

  • Google analytics for tracking click events
  • FTP access to upload banner images

First decide on banner size. We prefer 300x150 pixel animated banners; they look good on sidebar for desktop users, look good on mobile phones, and animation draws attention for promoting valuable short messages regarding advertisement. Animation should be 3-4 frames; file size should not be bigger than 60 Kb.

After deciding on banner size create “promo banner” to advertise your available banner space. Promo banner can include some text like “50K views/month”, “Your ad here” etc.

“Advertise here” page

Create “Advertise here” page for promoting and explaining banner advertisement. Give some statistics info on that page: number of monthly views, number of monthly users visiting your website. Explain technical requirement for banner images, image size and file size, animation allowed or not, alternate banners allowed or not, show banner locations with website screenshots on PC and on mobile view. Alternate banners are good for two reasons:  test which banner performs better in terms of click through rate, showing different banner randomly to not annoy users visually. We will link to this page with “promo banner” and from all banner locations with simple text “Advertise here”.

Content you should have on “advertise here” page:

  • Some important statistics from google analytics about traffic on your website: monthly visitors, page views.
  • Technical requirement of banner images.
  • Places where banners will be shown with PC and mobile screenshots.
  • Contact us form, email or phone number for contacting with banner inquiries.
  • Previous and current well known advertisers who advertised on your website, can show short testimonial from them. This will give confidence potential advertisers.

When contacted for banner advertisement you will need from advertiser following items:

  • Ready-made banners matching your technical requirement for images. If customer does not have ready banners then ask for 2-3 images about their product and make banner yourself. You can ask extra payment for it if you have too many advertisers, if not make banner design for free. It is up to you.
  • URL where banner will be linked. It can be on their website or classified item on your website. Make sure that link is not pointing to your competitor’s website. URL to the item on your website is best option here, because you will keep visitors inside your website while promoting advertisers item and earning money for it.
    Remember to add utm variables to track visits generated after clicking banner on your website. You can add tracking variable to any url be it external or internal link.
    UTM variables are: utm_source, utm_medium, and utm_campaign. For example, the following link would allow you to identify the traffic to example.com that came from a “banner” from “your_website” related to particular “advertiser”: https://example.com?utm_source= your_website&utm_medium=banner&utm_campaign=advertiser
  • If advertised content, banner and URL is ok with your policy then ask for payment from customer.

Upload banner images and screenshots using FTP to your server. Use absolute url of images in banner widget and inside advertisement page.

Code for custom banner ads

After having all this information ready you can use following HTML code in your banner area, preferably on sidebar. Javascript in this code will perform following actions:

  • Randomize banner order
  • Use alternative banner image and alternate URLs randomly if presented
  • Insert banners after defined number of ads on category pages and places where classified items are listed. This will be shown to mobile users only. Remember classifieds sites have very high percentage of mobile users.
  • Show advertise here text link near banners.
  • Track banner click events with google analytics. Tracking click events is different than UTM variables. UTM variables will be recorder on advertiser’s website; click events will be recorder on your website and can be viewed in your analytics account. Remember that some banners can display direct call to action phone number so counting clicks is not reliable in terms of counting actions derived from given banner.

Here is banner HTML code, add it to your sidebar widget by navigating to “Appearance” -> “Widgets” page. Add “Text” widget to “Content right” widget area. Paste following html code to text area and select text type as “HTML / javascript”. If you have multilingual website paste same code to other locales, inside this widget, as well. This widget code will work with most default themes provided by classibase. We tested it with Classibase version 1.9.1 themes.

Do not use words like “banner”, “ads”, “adverts” etc. for banner file name, inside links, class names because they may be blocked by ad blockers installed on visitors web browser. Use names that to not trigger blocking of your classifieds banners.

<!--  banner ad widget code. Edit url and image src.  -->
<div class="cb-bnr" style="text-align:center">
<div class="cb-bnr-row">
<a href="http://example.com/page1.html" rel="nofollow"><img src="http://example.com/adhr.gif"/></a>
<a href="http://example.com/page2.html" rel="nofollow"><img src="http://example.com/bnr2a.gif" data-altsrc="http://example.com/page2b.html||http://example.com/bnr2b.gif|||http://example.com/page2c.html||http://example.com/bnr2c.gif"/></a>
<a href="http://example.com/page3.html" rel="nofollow"><img src="http://example.com/bnr3a.gif" data-altsrc="http://example.com/bnr3b.gif|||http://example.com/page3c.html||http://example.com/bnr3c.gif"/></a>
</div>
<p class="cb-bnr-prom"><a href="http://example.com/advertise-here-page.html">Advertise here</a></p>
</div>
<!--  END of editable area  -->
<style>
/* reklam rows */
.cb-bnr{margin:0 -10px;}
.cb-bnr-row{display:none;}
.cb-bnr .cb-bnr-row{display:block;}
.cb-bnr-prom{padding:0;margin:0;}
.cb-bnr-prom a{padding:10px 0;display:block;}
.cb-bnr-row a{display:block;text-align:center;margin:10px 0;line-height:1;padding:0;}
.cb-bnr-row img{width:100%; height:auto;}

@media screen and (max-width: 600px){
.cb-bnr{margin:0;}
}
@media screen and (max-width: 450px) {
.content table.list_style_full tr.cb-bnr-row{display:block;line-height:1;padding:0;}
.content table.list_style_full tr.cb-bnr-row td{display:block;margin:0;}
}
</style>
<script>
function randomBnr(){
	/*
	* Shuffle jQuery array of elements - see Fisher-Yates algorithm
	*/
	jQuery.fn.shuffle=function () {
		var j;
		for (var i=0; i < this.length; i++) {
			j=Math.floor(Math.random() * this.length);
			$(this[i]).before($(this[j]));
		}
		return this;
	};
	$('.cb-bnr .cb-bnr-row a').shuffle();
	
	// convert alternative data to proper jquery data if defined
	$('.cb-bnr .cb-bnr-row a:has(img[data-altsrc])').each(function(){
		var $me=$(this);
		var $img=$('img',$me);
		var default_url=$me.attr('href');
		var default_img=$img.attr('src');
		var data_str=$img.data('altsrc');
		var data_arr=data_str.split('|||');
		var data=[{url:default_url,img:default_img}];
		for(x in data_arr)
		{
			var data_url_src=data_arr[x].split('||');
			if(data_url_src.length>1){
				data_img=data_url_src[1];
				data_url=data_url_src[0];
			}
			else{
				data_img=data_url_src[0];
				data_url=default_url;
			}
			data.push({url:data_url,img:data_img});
		}
		
		// remove data attribute from html 
		$img.removeAttr('data-altsrc');
		// add json data 
		$img.data('altsrcjs',data);
		
		//select random index and apply to current item
		var ind=Math.floor(Math.random() * data.length);
		$img.data('ind',ind);
		$me.attr('href',data[ind].url);
		$img.attr('src',data[ind].img);
	});
	
	// track clicks
	$('body').on('click','.cb-bnr-row a',function(e){
		// if google analytis is not loaded then continue load linked page
		if (e.isDefaultPrevented() || typeof ga !== "function") return;
		// cancel event and record click
		e.preventDefault();
		var $me = $(this);
		var href = $me.attr('href');
		var src = $('img',$me).attr('src');
		ga('send', {'hitType': 'event','eventCategory': 'bnr','eventAction': href,'eventLabel': src,'hitCallback': loadPage});
		// redirect after one second if recording takes too long
		setTimeout(loadPage, 1000);
		// redirect to outbound page
		function loadPage() {document.location = href;} 		
	});	
}
function initBnrRow(){
	console.log('initBnrRow');
	// define where to insert bnr in list of items
	var insert_pos=[3,7,20,30,40];
	var $rek=$('.cb-bnr .cb-bnr-row a');
	var $rek_prom=$('.cb-bnr .cb-bnr-prom');
	var rek_len=$rek.length;
	var rek_ind=0;

	if(rek_len>0){		
		// init rows
		$('table.list_style_full').each(function(){
			var $me=$(this);
			var $tr=$('tr',$me);
			var len=$tr.length;
			var len_td=$('td,th',$tr.first()).length;
			
			for(x in insert_pos){
				ind=insert_pos[x];				
				if(ind<len-1){					
					var $cur_rek=$rek.eq(rek_ind);
					var $cur_rek_img=$('img',$cur_rek);
					var $sel_rek=$cur_rek.clone();					
					var $new_tr=$('<tr class="cb-bnr-row"><td colspan="'+len_td+'"></td></tr>');
					$('td',$new_tr).append($rek_prom.clone());
					$('td',$new_tr).append($sel_rek);		
					$tr.eq(ind).after($new_tr);						
					rek_ind=(rek_ind + 1) % rek_len;	

					// check if it has alternate items, select next alternate
					var data=$cur_rek_img.data();
					if(typeof data.altsrcjs!='undefined'){												
						data.ind=(data.ind+ 1) % data.altsrcjs.length;
						$sel_rek.attr('href',data.altsrcjs[data.ind].url);
						$('img',$sel_rek).attr('src',data.altsrcjs[data.ind].img);
						$cur_rek_img.data('ind',data.ind);
						$('img',$sel_rek).removeData();
					}
				}
			}
		});
	}
}

addLoadEvent(function(){
randomBnr();
initBnrRow();
});
</script>

There are several scenarios for image data-altsrc attribute.

  • Do not define it if you do not have any alternate banners
  • To show different banner images and link to same destination URL then define alternative banner image sources separated by ||| following syntax data-altsrc="img1|||img2|||img3”
  • To show different images and link to different sources then use following syntax data-altsrc=" url1||img1|||url2||img2|||url3||im3”

Check how we used promo bar (with source code) to promote official social media account of classified ads website.

How to promote banner ads (advertisement)?

There are several promotion plans for banner ads on classifieds website:

  • Display your own promotional banner linking to advertise here page
  • Show “advertise here” link before or after banners
  • Send email newsletter to all registered users. Be careful with this because users must subscribe to your newsletter before you send them any newsletter, and you should have unsubscribe links in your newsletters. These rules differ for each country so check your legal requirements before sending newsletter.
  • Add footer link on some email messages sent from your website. These are usually emails when new user registers, notification emails sent to user when their listing approved. Text can be “Discover more advertising options” with link to advertise here page.
  • Write personally to companies posting more than 100 classified ads to your website. Ask them if they would like to promote their business with banner ads. Show some statistics with monthly click counts.
  • Ask for review from companies advertised using your banner ads and use it as testimonial on your website.  Also you can write a case study about how advertising on your website helped their business to increase sales.

FAQ

Where to place banner ads on classifieds website?

For best performance banner ads should be placed at the top of the page. In ClassiBase widget area named "Inner top". It should be visible on mobile and on desktop devices. Also you should not annoy users with banner size. Size it relative to user screen. So on mobile it should not cover more than 30% of screen.

Nest best place to place banner ad is after content. Be it ad page or category page, after main content is where users scroll to see more info. In ClassiBase it widget location for after content is "Inner bottom".

When you should consider monetizing your website with banner ads?

You can monetize with banner ads in following situations:

  • You have too many classified ads and feel that businesses using your website want more ways to show their offerings.
  • Users in your target country cannot use popular services like Google Adwords or any other advertisement network due to limitations.
  • When you can earn more by directly selling banner ads to your customers that are using Google Adsense.

Are banner ads profitable in comparison vs AdSense?

Direct banner ads are always should be profitable than advertising via google. Remember that google takes some portion of revenue to operate and gives you 68% of revenue. When you directly sell your banners you can earn 100% of revenue. Also promoting directly on your website with monthly banners may be cheaper than pay per click advertisement for your clients. You need to find that balance where you and your advertiser wins.

You can always use your own banner ads and AdSense at the same time on your website. Banner ads are not contextual and you are not competing with Google. You will generate more income when they are used together.

How to find customers for banner ads?

You can find customers for banner ads from your existing users and from advertisers showing ads using google AdSense. You need to rich to all your potential advertisers and offer your banner ads. You can give some test period if they ask for it. Because they need to make sure that banner ads on your website are worth its price.

Final thoughts for monetizing classifieds website with banner ads

Banner advertisement is one of monetization methods that can be more profitable than using Google AdSense. You can use  We explained how to add banners to your website with custom PHP code. Finding advertisers, pricing and promotion of banner advertisement is also explained in this article.

You can always try banner advertisements. If it works and you find loyal advertisers then keep using it. If it doesn't work and you struggle finding advertisers then you can continue using Google AdSense or check additional ways to monetize classifieds website.

 

Leave a Reply

Your email address will not be published. Required fields are marked *