Treasures …: Tweaking ads based on the user [Part 3 of 3]

 

In my last two articles I described how someone using our ads can vary what ads to show depending on who is visiting. For this last article, I’d like to list out what Javascript variables are of use to you and two examples of using them.

Useful JavaScript Variables
Variable Name	Description
screen.width	The width (in pixels) of the user’s screen.
screen.height	The height (in pixels) of the user’s screen.
document.referrer	If it exists, the URL the user came from to arrive at this page. (E.g. google)
navigator.appVersion	Gives information about the Operating System being used. (E.g. ‘5.0 (X11; en-US)’).
navigator.userAgent	Gives information about the browser being used.

You can feel free to use the above variables in any fashion to display the right ads for you.

Varying an eMiniMalls Format

So the first trick using the above JavaScript variables is to change the eMiniMalls format you are using depending on the size of the user’s screen. In the below example, anyone with a large screen gets a 460×180 eMiniMalls format, whereas people with a mid-sized screen get a 300×250 format, while people with a smaller screen are left with a 160×160 format.

<script type="text/javascript">
<!--
/* Example code to vary the eMiniMall format with the
    user's screen size. For a list of formats, go to:
    http://chitika.com/mmformats.php
*/
if (screen.height >= 1024 || screen.width >= 768) {
   /* The user has a large screen, use a large
       eMiniMall format.                                        */
   ch_width = "468";
   ch_height = "180";
} else if (screen.height >= 800 || screen.width >= 600) {
   /* The user has a mid-sized screen, use the 300x250
       eMiniMall format.                                        */
   ch_width = "300";
   ch_height = "250";
} else {
   /* For a small screen, use a 160x160 format. */
   ch_width = ch_height = "160";
}
ch_client = "demo";
ch_default_category = "200001";
//--gt;
</script>
<script type="text/javascript"
       src="http://scripts.chitika.net/eminimalls/mm.js">
</script>

 

Varying how Linx Highlights your page

Suppose you want to run Linx, but you don’t want it to highlight your entire page if they came to your site from within your site. For this example, we’ll suppose that we’re running a site called example.com, and it’s running Chitika | Linx. In addition, for people who are using browsing my site, I only want to highlight words inside the class called ‘entry’.

 

<script type="text/javascript">
<!--
/* Example code to vary the classes Linx highlights
   depending on whether or not they come from example.com.
*/
ch_client = "demo";
ch_includeClasses = "entry";
if ("".length == 0 || String(document.referrer).toLowerCase().indexOf('example.com') == -1) {
    ch_includeClasses = "";
}
//-->
</script>
<script type="text/javascript"
       src="http://scripts.chitika.net/static/linx/chitika_linx.v3.js">
</script>

That’s it. Now anyone going to any of my pages from within my site (or directly) will only see linx highlight inside ‘entry’, which is a section of my pages. For help on generating more typical Linx code, please go to the Linx code panel.
If you have any other ideas on how to use these JavaScript variables in a useful way, please share them in the comments!

Posted by Mike Axiak, Web Developer