Archive for the ‘blogging’ Category

Proof that Alexa rankings can be very inaccurate for small websites

Thursday, July 29th, 2010

Here is a comparison of the actual viewing figures for this site (as recorded in Google Analytics), against the values that Alexa reports.

Alexa vs Google Analytics page views

This is a fairly small blog, getting 600-800 page views per day. If you too have a website which is of a similar size you might be interested in just how wrong Alexa’s statistics can be. Here is Alexa’s estimate as to how the number of page views I’m getting has changed in the last three months (snapshots all taken on the 15th July).

alexa page views

Looks pretty amazing right? A 2420% increase in page views in three months. But all is not as it seems. Here are my actual page views from Google Analytics (same three month period). You can see the actual figures show a very gentle increase in page views.

google page views

Alexa operates by sampling data from the people who have installed its toolbar, or who have installed (or had installed for them!) some other piece of software which sends data back to Alexa.

The percentage of internet users who have Alexa software on their computers is small so the data is subject to anomalies, especially as the website gets smaller. A large website such as Facebook or MySpace probably gets ok results from Alexa as there will be thousands of people browsing these sitse who have the toolbar installed. But the smaller the site, the bigger the potential for the results reported by Alexa to be out of sync with the actual results.

Alexa vs Google Analytics page views per person

So why the huge reality vs Alexa distortion for my site? I’ll come to that later. Next let’s looks at another graph. This is how Alexa thinks my page views per person is doing.

alexa page views per user

Pretty impressive! The page views per person has gone from 1-2 all the way up to 30 pages viewed per user. If that were accurate it would mean that people really love reading what I write! But unfortunately my blog isn’t quite that engaging. Here are the real figures. Each of my visitors looks at about 1.3 pages. That figure has remained fairly flat over the last three months.

google page views per user

Alexa vs Google Analytics visitors per country

Here is my final set of figures. This is where Alexa thinks most of my visitors are coming from.

alexa percent traffic by country

You can see from their figures that they think most (74%) of my visitors are in Japan. It is vaguely plausible as I do have quite a few Japan related postings on this site. However it isn’t accurate. Here are the real figures.

google percent of traffic

You can see that only 1.4% of my visitors are in Japan. This largest percentage of viewers is actually from the UK (44%), but Alexa only believes that 4.5% of my viewers come from the UK.

So why is Alexa so badly wrong?

What is causing Alexa to be so badly out of sync from reality? I am pretty sure I’ve worked out the reason. I believe that the massive inaccuracies are the result of a single person. Me.

Not on purpose, I did it entirely accidentally. But it is interesting that one person could cause the perceived page views of a 600-800 page per day blog to jump 2420% in three months. It is also interesting that one single person could accidentally cause the Alexa traffic rank to jump from about 600,000 to 200,000 in such a short time. And it is impressive that one single person could cause Alexa to think that 74% of visitors are from Japan when in fact only 1.4% of them are. Also that I could cause the average page views per person to go from 1-2, all the way up to 30ish.

How did I (accidentally) cause Alexa’s figures to be so wrong?

There is one main cause of this massive misreporting of figures. I installed the Quirk SearchStatus extension for Firefox. This extension add some small items to your status bar at the bottom of the browser. They can show the Google PageRank for the web page you are currently on, and they can show the Alexa traffic rank for the website you are on.

But the extension doesn’t silently report the statistics. It actually affects the Alexa traffic rank statistics. As you are browsing where you go will now be recorded by Alexa.

In my case I spend a lot of time on my own blog. It is WordPress blog so I need to access it to put up new posts, edit posts, check posts, moderate comments, and install/configure new/updated plugins. In a typical day this could easily generate another 30-50 page views of my blog that are reported to Alexa.

It would seem that although all my page views are coming from the same IP address, they are still able to make Alexa think that my blog is seeing a huge surge in traffic.

The timing is right too. The time I installed the plugin matches the time I started seeing this huge surge in Alexa rankings. And that’s not all. A short while after installing the plugin I headed to Takamatsu in Japan and continued working on my blog from there.

The fact that I had moved from the UK to Japan caused caused Alexa to think that most of my visitors were now coming from Japan.

Almost all of this was caused by me accessing my WordPress blog in a normal way whilst having this Firefox extension installed.

What it shows is how inaccurate the numbers can be for small sites such as mine. The number of people whose browsers report statistics to Alexa is sufficiently small that a single person can seriously skew the data.

So look at Alexa’s statistics if you really want to. But remember that unless you are looking at the stats for a huge site, they may well be way off the mark.

What I’ve learnt after 100 blog posts

Saturday, March 27th, 2010

Today marks a significant milestone for this blog. After two and a half years I have reached my 100th post! I thought this would be a good moment to look back at what I’ve learnt from writing a hobby blog.

mini keyboard and cadbury sweets

Why I created this blog

I’ve been a hobbyist website builder for about 13 years now. I’ve created a mixture of technical and personal topics. These have always been static websites where each page was created individually, either using a HTML editor such as HoTMetaL, or by using hand written HTML templates. Each website tended to stick to a particular topic, and some of them have done moderately well, getting many hundreds of visitors each day.

I had an ideal for another website where I could write about miscellaneous topics that didn’t fit anywhere else. I registered a new domain name with 1and1, created some static HTML templates, and started writing some content. I soon gave up as I found that I was spending too much time on the mechanics of creating each page, rather than on the more creative writing aspect. I abandoned the idea for a year, and didn’t think much more of it.

Starting up

I began reading about blogs, and self hosted blogging platform like WordPress. I thought that my miscellaneous topic website might work if I used something like WordPress as the content management system.

At the time I was on a very basic web hosting package with 1and1 and I had to upgrade to a more expensive package that included MySQL database support before I could install WordPress. Once the web hosting was upgraded I had the basic blog up and running in a couple of hours. I registered the domain name reviewmylife.co.uk to host the blog.

The domain name is fairly self explanatory; I’d be posting articles that in some way related to my life. I thought there would be reviews (of hardware, films, and so on), but the name was generic enough to allow me to put any kind of content on the blog.

My very first post on 5th August 2007 was about setting up the blog on 1and1 (the company I use to host the site). It wasn’t a classic post, but it was a start. That month I posted a few other cheap posts, and also moved some of the content from my failed ‘miscellaneous content website’ over to the new blog.

You should think carefully before deciding to use a self hosted blog like WordPress. Self hosted blogs do require a fair bit of maintenance. At first it was a real pain as all the plugins and the blog itself had to be manually updated on a regular basis. As WordPress evolved it got easier as features such as one-click plugin updates, and then full one-click updates were added.

Over the years I’ve written many posts about the various issues I’ve had to solve with hosting my own WordPress blog on 1and1 such as configuring custom error pages, adding spacing round iframes, and adding a related posts section to each post.

As well as keeping WordPress up to date, you’ll have to dedicate time to customising it (if you want), and backing up your data (very important if you don’t want to risk losing everything). I’d recommend you backup your posts (doing a Tools->Export, and do a MySQL backup) every month. And backup before you upgrade the blog. New minor updates come out every month or two, and major updates seem to come out every three months.

Backing up your blog is very important as not only can you lose data from:

  • Your own mistakes.
  • Mistakes made by your hosting company.
  • Malicious hacking into your site. WordPress has had a steady stream of vulnerabilities being found and patched over the years.

The blog picks up

As time went on I posted more useful information. I got plenty of appreciative comments for my post warning about the Spanish lottery scam, and for a post explaining how to get documents certified cheaply.

The number of comments went crazy when I posted about my experiences of trying to get rid of clothes moths. To date I have 74 comments for this one post, many of them would make worthy posts in themselves. This post is an example of a seasonal post. Clothes moths tend to cause problems in the Spring, Summer and Autumn so these are the times when this post get visitors. The number of people looking for information on moths goes down a lot in the winter.

Getting feedback from other people is one of the most satisfying aspects of writing a blog. I find that when I post about personal experiences I get a lot more comments than if I just provide some information.

As well as the clothes moths post, the posts on my cyst removal surgery, and my problem with knee pain and considering a lateral release got plenty of feedback.

In terms of what posts are popular I find that there are two types of posts that get lots of visitors.

  • Personal experiences – like the posts I mentioned above. People like reading about others who are going through similar things to them.
  • Useful information – posts where I’ve provided free useful information such as my 2011 Excel Calendar, and my guide to upgrading the Samsung N140 memory to 2GB get plenty of readers.

Whatever you are writing about I find that if you add quality original material to the internet you will get more readers then if you just re-hash information that already exists.

I’d predict for example that this blog post won’t get very many visitors. There are so many people blogging about blogging that this post will probably vanish in the noise out there. But I still consider it worthwhile to write it so I can look back once I reach 200 posts.

How I write each post

When I started I used to use the WordPress WYSIWYG editor. I found that it wasn’t a great experience. Typing text into a box on a web page isn’t as good as writing text in a word processor. I like having a proper spell checker, and grammar checker ready to use.

I switched to writing my posts in Microsoft Word and using a set of VBA macros that add the WordPress mark-up to the post.

I don’t have a fixed length for each post, some are very short being just a few hundred words long, and others are many thousands of words long.

The shortest posts have been done in less than half an hour, whereas the longest posts with original research, photos and charts have sometimes taken me four to five hours to complete.

Often I don’t have a plan for each post, I just start writing and finish when I think the post is done. Take this post for example; I have very little idea where I’m going after this sentence! All I have is a few notes about certain topics I want to include.

I didn’t always include photos in my posts, but more recently I’ve tried to have at least one photo or diagram in each post. I think the sight of a large block of text can be off-putting to blog readers. A few relevant (or even not so relevant) photos can help to break the text up. All my photos are taken with a Sony Cybershot W80 camera which I reviewed on this site in 2008.

To upload the photos I use the FileZilla FTP client which has useful functions such as directory bookmarking, synchronised browsing, and filters.

Getting ideas for posts

As my blog is a multi-topic one rather than being a specialised one I can think of ideas for posts all the time. The problem is that I don’t have time to write many of them up.

reviewmylife thumbnails

Often my ideas are topics that I’ve tried to find out about on the internet, had no success, and so have decided to write about them myself.

I find that if I get an idea for a post, I need to write it down right away. If I don’t then I’ll have probably forgotten a few minutes later. If I’m at my computer I record my ideas as a simple list in Word. If I’m away from my computer I put the ideas in a ToDo list on my phone.

If I have specific ideas for what content should be in those posts then I might jot down a few bullet points, but most of the time I just write the idea down in a single line.

Promoting the posts and website

I spend very little time on promoting each post or SEO compared to the amount of time spent writing new content. But I have done some simple things to make sure each post has basic SEO hygiene factors.

  • I’ve installed the All in One SEO Pack plugin, and I make sure I add a title, description, and keywords for each post.
  • I add tags and a category to each post.
  • I submit most of my new posts to Digg, reddit, Delicious, and StumbleUpon.
  • More recently I’ve installed the Tweetly Updater plugin so Twitter is notified when I make a new post.
  • The Google XLM Sitemaps plugin is installed on this blog to make it easier for search engines to index my blog.
  • I have a TweetMeMe Retweet button on my posts to allow other people to Tweet about them.
  • I have an AddThis button on my posts to allow them to be easily submitted to social bookmarking sites.

One area where I haven’t put much/any effort into the blog is with the look. At the time of writing this 100th post I’m still using the default Kubrick theme. I will probably customise it at some point, but may wait until the default theme changes in WordPress 3.0 before I do that.

The Kubrick theme may be basic, but it works well and means I don’t get incompatibility problems each time I need to upgrade the blog. You can get plenty of readers without having to use a fancy theme.

Here is a graph showing the number of visitors I get per week which goes back to when I first installed Google Analytics. The left of the graph is October 2007. The right side is the day I made this post; 27th March 2010. The number of visitors is not huge, but at least it is growing.

visitors per week

Monetising the blog

I decided early on to monetise the blog. Not to make real money, but to at least pay for the costs of the web hosting, and domain names. To do this I use the AdSense Injection plugin with a number of custom tweaks.

It inserts text adverts into the posts automatically, and randomises their position. I find it to be a very easy way of generating a small amount of money for the site. It covers my web hosting costs, but isn’t enough to give up the day job just yet!

If I’m writing a post about something that can be bought from Amazon then I might add an Amazon affiliate link as well. This worked particularly well when I reviewed the Samsung N140 netbook. The review has nearly paid for the netbook already!

Where do my visitors come from?

This site may look like a blog, but in reality I treat it more like a static website that just happens to be using WordPress as the content management system.

Blogs usually have some common theme through their posts, mine are on quite random topics.

Because of my scattered topics almost all my readers come from search engines. I have very few – almost zero – subscribers. People use Google, Yahoo, or Bing to search for something specific, and sometimes they find one of my pages in the results.

82% of my visits come from search engine queries, and 75% of those are from Google.

You might have noticed that quite a few of the list item in the ‘Promoting the posts and website’ section above were relating to social bookmarking websites. However only about 1% of my traffic comes directly from these kinds of sites. It does make me wonder if it is even worth submitting the pages to these sites at all.

Of course these social bookmarking sites may be driving visitors in other ways – by increasing the rank of my pages in the search engines. I don’t think there is any way to find out, but I’ll keep submitting for now.

The top referring social bookmarking website for me is StumbleUpon.

In terms of which country my visitors come from 41% are from the UK, 25% from the US, and India, Canada, Australia, the Netherlands, and Germany are all in the low single figures. In the last month I had visitors from 122 different countries.

Internet Explorer is the most popular browser with 48% of my visitors using it. Firefox gets 34%, Chrome 10%, Safari 5% and Opera 1%.

The future

So what does the future hold for this blog?

Quite simple – more posts! On average I’m posting about one post per week, but sometimes there will be several in a week, and then none for a few more weeks.

I hope to keep to at least this amount of posts for the next year, and work my way towards 200 posts. I have a big backlog of post topics to write about so I won’t run out of ideas anytime soon. And I hope my writing is getting better as I go on.

If you read this I’ll say ‘thanks’. And do pop back sometime soon.

AdSense Injection WordPress plugin tweaks

Thursday, July 24th, 2008

Update 7th December 2010: Use the new Ad Injection plugin for WordPress instead as it will do what these tweaks do, and more.

On this blog I use the Adsense Injection plugin to automatically add Google’s targeted AdSense adverts to my posts. The plugin is excellent and has helped to make more money for this site but there are a few tweaks that I have done.

First, I’ve made a modification so that if a individual post page is shorter than a certain number of characters then the number of adverts is limited to one.

Second, I’ve made a change so instead of looking for ‘<p’ tags to use as AdSense insertion points it looks for the full paragraph tag – ‘<p>’. The reason I did this is because I often include code in my posts in <pre> tags and the AdSense plugin code was inserting adverts in my source code snippets which looked wrong. After making this change the adverts only appear in the text of my posts.

Both sets of changes are shown in the code below. You can simply replace the ai_the_content() function in version 2.0 of the plugin with this version.

adsense-injection.php
function ai_the_content($content){
  global $doing_rss;
  if(is_feed() || $doing_rss)
    return $content;
  if(strpos($content, "<!--noadsense-->") !== false) return $content;
  if(is_home() && get_option('ai_home') == "checked=on") return $content;
  if(is_page() && get_option('ai_page') == "checked=on") return $content;
  if(is_single() && get_option('ai_post') == "checked=on") return $content;
  if(is_category() && get_option('ai_cat') == "checked=on") return $content;
  if(is_archive() && get_option('ai_archive') == "checked=on") return $content;
  global $ai_adsused, $user_level;
  if(get_option('ai_betatest') == "yes" && $user_level < 8)
    return $content;
  if(get_option('ai_notme') == "yes" && $user_level > 8)
    return $content;
  # RML: backup content
  $original_content = $content;
  $numads = get_option('ai_nads');
  if(is_single())
    $numads = get_option('ai_nadspp');
  $content_hold = "";
  if(strpos($content, "<!--adsensestart-->") !== false){
    $content_hold = substr($content, 0, strpos($content, "<!--adsensestart-->"));
    $content = substr_replace($content, "", 0, strpos($content, "<!--adsensestart-->"));
  }
  while($ai_adsused < $numads)
  {
    $poses = array();
    $lastpos = -1;
    # RML: change <p to <p> to stop ads before <pre>
    $repchar = "<p>";
    if(strpos($content, "<p>") === false)
      $repchar = "<br";
    while(strpos($content, $repchar, $lastpos+1) !== false){
      $lastpos = strpos($content, $repchar, $lastpos+1);
      $poses[] = $lastpos;
    }
    //cut the doc in half so the ads don't go past the end of the article.  It could still happen, but what the hell
    $half = sizeof($poses);
    $adsperpost = $ai_adsused+1;
    if(!is_single())
      $half = sizeof($poses)/2;
    while(sizeof($poses) > $half)
      array_pop($poses);
    $pickme = $poses[rand(0, sizeof($poses)-1)];
    $replacewith = ai_pickalign(get_option('ai_lra'));
    $replacewith .= ai_genadcode()."</div>";
    # RML: remove hardcoded length
    $content = substr_replace($content, $replacewith.$repchar, $pickme, strlen($repchar));
    $ai_adsused++;
    # RML: if content is short then limit to one advert
    if(strlen($original_content) < 2500) return $content_hold.$content;
    if(!is_single())
      break;
  }
  return $content_hold.$content;
}


Improved KML embedding of Google Maps into web pages

Sunday, December 23rd, 2007

I’ve been further improving the code that I described in my previous in my previous post – ‘Adding KML Google Maps overlays to WordPress posts‘.

I’ve made these changes:

  1. Option to specify a latitude / longitude / zoom for the map. This allows you to have one map and then show lots of different views of it
  2. The code is now implemented as a function rather than as included PHP. This means that the full map can be included in one line of PHP and the code only has to be included once in each page.

As before you can include a whole map which will be automatically centred and zoomed for you. The require_once is only needed once on each page, but no harm will come to you if it is included more than once. Only one argument is needed – the full URL to the KML file. A width / height can be included if you want.

<?php
require_once('../data/071223/mapiframe.php');
iframe("https://www.reviewmylife.co.uk/data/071223/track.kml");
?>

In the require_once you can either include an absolute path or a relative path.


View Larger Map
The new options allow you to specify the latitude, longitude and zoom values. When you specify these values you also have to specify the width / height of the map. The argument list is:

  1. Full URL of KML – note this is the full URL not a relative one
  2. Width of map – in pixels
  3. Height of map – in pixels
  4. Latitude
  5. Longitude
  6. Zoom
<?php
require_once('../data/071223/mapiframe.php');
iframe("https://www.reviewmylife.co.uk/data/071223/track.kml",
	450, 400, "51.515339", "-0.054374", 15);
?>


View Larger Map
To get the latitude / longitude / zoom values view your KML file in Google Maps. Click on ‘Link to this page’ as described in the previous post. Alter the zoom and position of the map so it shows that you want. Then copy the latitude / longitude / zoom values from the HTML box. The latitude / longitude are the values in the ‘ll’ parameter (latitude is first). The zoom is the ‘z’ parameter.

So if we are looking at the following page in Google Maps.

Getting latitude, longitude, and zoom values from Google Maps

The latitude is 51.49966, the longitude is -0.053108 and the zoom is 16.

Here are the three files you’ll need.

MapIframe.php
LoadMap.php
GoogleMapLoader.js

You can see a demonstration of these scripts at www.londonphotoproject.co.uk/blog/. Here I have one KML file for my whole walking route, but I include multiple zoomed-in views of the map so I can describe the route in small sections.

For these scripts to work they’ll need to be interpreted as PHP4 rather than PHP5. If your web host is interpreting PHP files as PHP5 by default (which more and more of them are) simply put these PHP files in a separate directory and add a .htaccess with the following contents to that same directory.

# Treat files in this directory as PHP4
AddType x-mapp-php4 .php


Adding KML Google Maps overlays to WordPress posts

Thursday, December 20th, 2007

Embedding basic KML Maps into your blog post

There is an easy way to include Google Maps KML overlays in your WordPress blog if you are willing to have all the size and style information hardcoded into each post. All you have to do is to go to http://maps.google.co.uk/ type the KML location into the search box and then click on ‘Link to this page’.

Embedding KML into your WordPress blog using Google Maps

You can then add the HTML into your blog post by copy / pasting it from the second text box.

HTML for embedding Google Maps in a WordPress blog post

Google make it easy to change simple settings such as the map size by following the ‘Customise…’ link. Below is what the actual embedded map would look like. Handily the map is automatically zoomed into whatever data is in your KML file – In this example we’re looking at a walking track across London.


View Larger Map

This is great for if you want to add the odd maps to your blog, or if you don’t believe you’ll need to alter the style later on. The problem comes if you want to separate all the style information out of the embedded map iframe.

The problem with the Google Maps HTML generator

Imagine if you had a site with dozens or even hundreds of embedded KML files. One day in the future you decide that you want to change the style and look of all the maps. Maybe you want to change the size, add some extra links under each map, or add new features from the Google Maps API to each map. Below is what the actual HTML code embedding this KML file looks like. As you can see it is pretty ugly and it wouldn’t be fun to edit dozens / hundreds of these to change the way they look.

<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.uk/maps?f=q&amp;hl=en&amp;geocode=&amp;time=&amp;date=&amp;ttype=&amp;q=http:%2F%2Fwww.reviewmylife.co.uk%2Fdata%2F071220%2Ftrack_east_london.kml&amp;ie=UTF8&amp;ll=51.497414,-0.054315&amp;spn=0.044967,0.044325&amp;om=0&amp;output=embed&amp;s=AARTsJozG9M05ndgSB8zlZU1Qavi7qH_cw"></iframe><br /><small><a href="http://maps.google.co.uk/maps?f=q&amp;hl=en&amp;geocode=&amp;time=&amp;date=&amp;ttype=&amp;q=http:%2F%2Fwww.reviewmylife.co.uk%2Fdata%2F071220%2Ftrack_east_london.kml&amp;ie=UTF8&amp;ll=51.497414,-0.054315&amp;spn=0.044967,0.044325&amp;om=0&amp;source=embed" style="color:#0000FF;text-align:left">View Larger Map</a></small>

Under normal circumstances it would be easy to separate out this code into a different file and pass in the KML file URL as a parameter. The problem is that Google have added a security parameter to the argument list (s=AARTsJozG9M05ndgSB8zlZU1Qavi7qH_cw in this case) which locks in the KML URL. You can edit the style parameters (width / height etc) but you can’t change the URL. If you do you get an error saying “Forbidden Your client does not have permission to get URL…”. Google have done this so they can keep a track of how much load individual sites are putting on their server. Unfortunately it means that if you want to use a new KML you have to use the Google Maps site to generate the HTML.

A solution and another problem for WordPress bloggers

There is a way around this, and that is to use the Google Maps API. This will allow you to programatically include as many KMLs as you want without using Google’s HTML generator. To use the API you have to sign up for a Google Maps API Key. There is one final problem – each key can only be used from one individual web directory. This can be a big problem if you are a WordPress user. Bill from the techrageo blog has already written about this so I won’t repeat what he has said. You can read his blog and look at his solution for yourself.

There are however some problems with his solution.

  1. You would need to create a new HTML file for each Google Map you are embedding.
  2. The width and height of the iframe have to be embedded in each map in each blog post or HTML page that you use it on.
  3. The JavaScript in his solution doesn’t quite do what I want.

Here is my solution which is inspired by his but solves these three issues. Please note that as with Bill’s solution this will require some programming knowledge. You will need to make modifications to my scripts to get them to work on your site.

To embed a KML file with my solution all you have to do is include a small section of PHP in your blog post. To allow me to embed PHP in my blog posts I’ve installed the Exec-PHP plugin. This is what the PHP looks like.

<?php
$mapxml="https://www.reviewmylife.co.uk/mymap.kml";
require('../data/kml/mapiframe.php');
?>

You must set the $mapxml variable which points to your KML file – it has to be the full URL, not a relative one. You then load the mapiframe.php file with the ‘require’ command. Optionally you can set a $width and a $height variable for the width/height in pixels, but this will re-introduce problem number 2. If you don’t set these values then default sizes (which you can change) will be used.

Embedding the KML with this PHP means that your blog posts now don’t contain any formatting infomation for the maps. All the formatting can be controlled from the following common scripts.

This is what your mapiframe.php looks like, it contains the common iframe information. You will probably need to fix the link to the loadmap.php file for your own web server.

<?php
/*
Include a KML on WordPress Blog
See www.reviewmylife.co.uk for details.
*/
if (!isset($mapxml))
	{
	print "ERROR: Missing mapxml";
	exit;
	}
if (!isset($width))
	{
	$width = "450";
	}
if (!isset($height))
	{
	$height = "450";
	}
$mapxml = urlencode($mapxml);
$widthparam="width=$width";
$heightparam="height=$height";
print <<<ENDHTML
<iframe width="$width" height="$height" scrolling="no"
frameborder="0" marginheight="0" marginwidth="0"
src="/data/kml/loadmap.php?mapxml=$mapxml&amp;$widthparam&amp;$heightparam">
If you see this, your browser doesn't support iframes.
Please upgrade to a more recent browser.</iframe><br /><small>
<a href="http://maps.google.co.uk/maps?f=q&amp;hl=en&amp;q=$mapxml&amp;ie=UTF8&amp;om=1&amp;source=embed"
style="color:#0000FF;text-align:left">View Larger Map</a></small>
ENDHTML
?>

Here is the code for loadmap.php. You’ll need to replace the Google Maps API key with your own one.

<?php
/*
Include a KML on WordPress Blog
See www.reviewmylife.co.uk for details.
Remember to replace the Google API key with your
own one or this script won't work!
*/
if (!isset($mapxml))
	{
	print "ERROR: Missing mapxml";
	exit;
	}
if (!isset($width))
	{
	$width = "450";
	}
if (!isset($height))
	{
	$height = "450";
	}
print <<<ENDHTML
<html>
<head>
  <title>Google Map Loader - $mapxml</title>
  <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA6Y9TsXMv7cdqyP8VLw2boRSTFKCAindh81v9qdSRu-QtalZoMBQj6TDiTZizmDy7aoJTqU6iO3pDOQ" type="text/javascript"></script>
  <script src="googlemaploader.js"></script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="map" style="width:$width; height:$height"></div>
<span id="mapxml" name="$mapxml"></span>
<script type="text/javascript">
 function initialize() {
  if (GBrowserIsCompatible()){
   LoadGoogleMap();
   }
  }
</script>
</body>
</html>
ENDHTML
?>

This is the googlemaploader.js file which loads the KML using the Google Maps API. It correctly sets the viewport in the map view and adds a few controls to the map.

// Script to load and position a KML/XML Google Map
// See www.reviewmylife.co.uk for details.
var kml;
function LoadGoogleMap(){
  // Find mapinfo span and get name attribute
  var mapxml = document.getElementById('mapxml').getAttribute('name');
  kml = new GGeoXml(mapxml, PositionMapCallback);
}
function PositionMapCallback(){
  var map = new GMap2(document.getElementById("map"));
  map.addControl(new GSmallMapControl());
  map.addControl(new GMapTypeControl());
  kml.gotoDefaultViewport(map);
  map.addOverlay(kml);
}

This is the final result. Yes it looks very similar to the one generated by the Google Maps HTML generator. But if I ever need to change all my embedded maps it will be really easy for me.


View Larger Map
Here are some download links for the three files you need.

MapIframe.php
LoadMap.php
GoogleMapLoader.js

You’ll need to change the Google API key in loadmap.php. You’ll also need to fix the inter-file references so all the scripts reference each other correctly. All three scripts should be placed in the directory that you created the Google API key for.

Update: Make sure you check out my Improved KML embedding of Google Maps into web pages post for some updates to these scripts.