More Than Scratch The Surface » blogger

Show Adsense To Search Visitors Only – On Blogger

Stephen Cronin — Sat, 31 Jan 2009 13:14:53 +0000

Want to make money online with Google Adsense? If so, you better make sure you don’t get smart priced! One of my most successful posts covers how to avoid smart pricing by only serving Adsense to search engine visitors. That post was written for the WordPress platform. In this post, I outline how to do the same on Blogger blogs (although there are severe limitations).

Why Only Show Adsense To Search Visitors?

First, why are we doing this? The main reason for showing Adsense to search visitors only, is to try to avoid smart pricing. I won’t go over smart pricing again (go read the above post in detail), but here’s the brief summary:

Smart Pricing is a penalty Google applies to Adsense accounts that don’t convert well for the advertiser and results in you earning only about 10% of what you’d normally earn per click. Search engine visitors provide targeted traffic for the advertiser, which converts well (no problem). Regular readers and social networks visitors provide untargeted traffic, which doesn’t covert well, increasing your chances of being smart priced (problem).

After reading Grizzly’s recent post on making money online anonymously, I learnt that it’s even more complicated than that. Grizzly, who’s a master of making money online, reveals that when he writes a post his CPC (Cost Per Click) drops for a couple of days:

Whenever I post I get a surge of traffic – the surge is un-targeted (my readers) and my CPC drops for several days until readers tail off. As long as my ad impressions stay above the 3000 barrier my CPC doesn’t drop more than 10 cents a click. If my ad impressions fall below the 3000 barrier I see a 30 cent drop in earnings per click.

Grizzly also says that his CPC dropped when he received a surge of traffic from a forum. It follows that the same would happen when you receive a surge of traffic from the social networks (ie Digg, StumbleUpon, etc).

It may be that this phenomenon is separate to smart pricing, or it may be that it’s actually a part of smart pricing and that smart pricing is far more complex than anyone has guessed.

Either way, showing Adsense to search engine visitors only should ensure that Adsense units are only served to targeted traffic, which should protect your CPC and help you make more money.

Serving Adsense Only To Search Visitors on Blogger

I’ve already covered how to display Adsense units only to search visitors for WordPress and I actively use the method on this blog. However, I also have a few Blogger blogs (and Grizzley’s site is on Blogger), so I started wondering how to show Adsense only to search traffic on Blogger.

With WordPress it’s easy. You can use PHP on the server side to detect where the visitor came from, then decide whether to include the Adsense code. If they came from a search engine, the Adsense code is added to the HTML sent to the browser. If they came from somewhere else, then it’s not.

However, with Blogger, it’s not possible to detect where the user came from on the server side. The only option is to use JavaScript, on the client side, to a) detect where the user came from and b) show the Adsense code or not.

Part A – Detecting Search Engine Visitors

Detecting search engine visitors is relatively easy. We can use JavaScript’s document.referrer to work out where the user came from. Converting the code I used for the PHP in JavaScript, we can do something like:

Note: In the document.cookie line, you must change “.scratch99.com” to your own domain!

This code detects whether the user arrived from one of a number of search engines and, if so, sets a variable called ‘sevisitor’ to true. It also creates a cookie, so these visitors can be identified if they subsequently navigate to another page (they will no longer appear to have come from a search engine).

We’ll use the variable or cookie later to decide whether we’re going to display Adsense.

So where does this code go? We only need this code once on the page, regardless of how many Adsense units we show, so we’ll put it at the top. The bad news is that it doesn’t work if you try to add it via a Blogger gadget, so we’ll have to add it to the template itself, as follows:

In Blogger, go to Layout, then choose Edit HTML
Make a backup of your template by clicking Download Full Template
Click Expand Widget Templates
Search for <data:blog.pageTitle/> (near the top somewhere)
Place the code above on the line immediately below this.
Save the template

Your blog should now be setting the variable and the cookie.

Part B – Showing Adsense To Search Visitors

Next we need to detect whether the variable and cookie are set and, if so, show the Adsense unit. To check whether they’re set, we’re going to use the following code:

var results = document.cookie.match ( '(^|;) ?sevisitor=([^;]*)(;|$)' );
if (sevisitor == true || results[2] == 1) {

Put this together with your Adsense code and it should look something like this:

You’ll have to replace the xxxx’s with the appropriate numbers from your Adsense code and you’ll have to change any other details (such as ad width and height if you’re not using a large rectangle).

There’s no need to replace special characters with HTML entities, as mentioned in my post on showing Adsense within the post body. In fact, that won’t work in this case.

What this script does is first check whether the variable or the cookie is set and if so, builds a string containing the Adsense code, then writes it. We have to build a string then write it, because there’s an external script called by the Adsense code. If there wasn’t an external script called, we could just strip the

Blogger – How To Add Adsense Inside Single Posts Only

Stephen Cronin — Fri, 16 Jan 2009 13:21:59 +0000

I was recently optimizing Adsense on one of my Blogger sites and decided I wanted to place Adsense inside the posts – but only on single posts, not on the home page or in the archives. Here’s how.

Why Blogger?

Although my primary blog platform is WordPress, I do occasionally use Blogger for some side projects. Why? Go and read everything that Grizzley’s written on his Make Money Online For Beginners site. Blogger can be an excellent option. It’s free, easy to create a site, can scale to handle massive traffic etc.

The only downside to Blogger is the limited ability to customize the site. With WordPress I can change pretty much anything I want. With Blogger I can only change things within the narrow framework that Blogger allows. In this case, I ran into the limitations with the built-in options to display Adsense ads.

Blogger’s Built In Options To Display Adsense

The easiest way to add Adsense to a Blogger blog is via the built-in gadget. I won’t go through the whole process, as it’s written about elsewhere, but you can add an Adsense gadget in the same way you can add a Profile gadget, Text gadget, Poll gadget, etc. Just go to Layout, then Page Settings, then click on Add a Gadget, select the Adsense gadget and then configure it.

The first time you use it, Blogger will ask you for your Adsense publisher number and link the blog to your Adsense account. Then you simply decide where you want the gadget to appear, what size and colour the ads should be and you’re off! You’re ready to start making money online.

You can also add Adsense between posts. To do this, click Edit on the Body gadget and turn on the Show Adsense Between Posts option. You’ll then be presented with the same options that the gadget gives you (size, colour etc).

Limitations With Built-In Options

There are several limitations to using Blogger’s built-in Adsense gadget:

1. Can’t Put Adsense Ads Within Posts

The main limitation with using the built-in Adsense gadget is that you can’t place ads within a post. You can add them before posts, after posts, between posts, in the sidebar, but not in the actual post.

It’s well known that the CTR (click through rate) is higher for ads within a post than for ads in other positions. So putting Adsense within a post will make more money for you. I cover how to do this below.

2. Can’t Use Channels

Another limitation of the built-in Adsense gadget is that you can’t use channels to track the performance of ad units.

However, this isn’t really a limitation – if you want to use channels, simply create your code on the Adsense site, then copy and paste your Adsense code into a JavaScript gadget, instead of using an Adsense gadget. In all other ways it will work the same as the Adsense gadget.

3. Blogger Only Shows Three Ad Units

The last limitation is only an issue for those people who place an Adsense unit in the sidebar. Some people choose not to do this, but I find that an Adsense unit in the sidebar performs relatively well (not as good as units at the top of the page, but better than those lower down the page).

The problem is that Google makes sure that only three ad units are displayed on a Blogger page, as per their Terms Of Service. Great in general, but it means you have less control over which ad units appear. Unfortunately the sidebar is rendered last in most templates, so it’s one of the units that disappear if there are too many units on the page.

This won’t happen on the single post page. However, if you display ads between posts (or within posts) then the sidebar ad unit will disappear on pages with multiple posts, such as the home page and archive pages. I explain how to overcome this below.

Adsense Within Posts

As I mentioned above, you can’t place Adsense ads within the post body using the built-in gadgets. To do this, we’re going to have to put our Adsense code directly into the template.

We still can’t put the ad unit in the middle of the post, but we can put it at the top of the post, below the title, with the text wrapping around it. Great! That’s proven to be the most effective placement, so that’s exactly what we want.

Now, the technique used to do this isn’t new. In fact I learned how to do it by reading Bonnie Calhoun’s Wrapping Adsense in Blog Post. You can go and read her post for the full instructions, but here are the basic steps:

Get your Adsense code from the Adsense website
Parse the code to replace special characters with HTML entities
In Blogger, go to Layout, then choose Edit HTML
Make a backup of your template by clicking Download Full Template
Click Expand Widget Templates
Search for or
Place your Adsense code on the line immediately above this
Save the template

Note 1: It’s very important to parse the code as per Bonnie’s site (ie replace < with < and > with > etc). If you do not do this, your Adsense units will not display correctly and you risk being banned by Google.

Note 2: You probably want to place your Adsense code within a floating div, so that the text wraps around it.

Here’s what the code will look like (with the publisher specific information removed). The first and last lines should already exist in the template, the rest is what you’re adding.



<script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxxxxxx";
google_ad_host = "pub-xxxxxxxxxxxxxxxx";
google_ad_slot = "xxxxxx";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

This solves the problem of getting Adsense to appear within the post, driving up CTR. However, the sidebar unit will still disappear on the home page, as there will be more than 3 units on the page (one embedded in each post).

Only Showing Adsense In Posts On A Single Post

To solve the problem of the sidebar unit disappearing, I decided that I only wanted to show Adsense within the post (ie solution in the previous section) on single posts. I didn’t want this ad unit to appear on the home page or on archive pages.

It would be easy enough to do this in WordPress / PHP, but I had no idea how to customize a Blogger template. I consulted Blogger’s Help facility and found a list of Layouts Data Tags, which let me see what could be done. Despite the options being fairly limited, I found the answer I needed: The pageType tag, which can have a value of ‘item’, ‘archive’ or ‘index’.

My XML coding skills are a little rusty, but thankfully it wasn’t hard to work out how to include some HTML based on the type of page:


PUT YOUR CODE HERE

This says: If it’s a single post, include the HTML (obviously you have to put it in). So single posts (pageType of item) will display the HTML, but the home page (pageType of index) and archive pages (pageType of archive) will not.

Applying this to our Adsense problem, here is the full code you need (with the publisher specific information removed). Use this instead of the code in the Adsense Within Posts section above. The first and last lines should already exist in the template, the rest is what you’re adding.




<script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxxxxxx";
google_ad_host = "pub-xxxxxxxxxxxxxxxx";
google_ad_slot = "xxxxxxxxxx";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

Of course, this means that only two Adsense units will be shown on the home page. If you’re doing things properly, most of your visitors should arrive on single posts, via the search engines, so this solution’s good enough for me.

Final Thoughts

If you want to make money online and you’ve decided that using Adsense on Blogger is the way to do it, then optimize it!

Hopefully this has helped you a) increase your CTR by showing you how to place Adsense units at the top of your posts and b) how to preserve income from the sidebar unit by stopping it from disappearing on multiple post pages.