Over the past month, the traffic on my site has more than doubled.
And it’s almost entirely due to this page which I wrote about using jQuery UI Slider for a vertical scrollbar. This one page now gets 30% of all the traffic. Even the traffic patterns are completely different, most hits to this page coming in the working week and from India and the US.
Amazing…
Entered a photography competition at the Ilkley Flower Show on Saturday – first time ever. Rather successful. The image below won first prize in the category “Winter Scene” – rather surprisingly as I thought although a good photo it wasn’t quite a scene as such.
And this one won third prize in “Something Red”.
However, my daughter trumped me by winning first prize in “Something Red” and the Calder Cup for best photograph or painting in the show, with this one, taken with a Panasonic compact:
Came across this little song this morning. Very funny and very true……if a bit geeky.
I reworked my homepage this weekend and wanted to display the latest WordPress blog post on it. No problem there. However, the initial response times for my blog are sometimes quite slow, and this then meant that the whole of my homepage was slow to display, because the page was waiting for the blog to respond before displaying anything.
So what I wanted to do was display the home page immediately, and then load the blog post when it’s available. The solution was to use AJAX, which turned out to be very straightforward. More information on AJAX here, but essentially it allows a page to communicate with a server without refreshing the whole page.
First things first – here’s the php code to retrieve the latest post from WordPress as follows (I originally had this on the homepage itself):
<?php require($_SERVER['DOCUMENT_ROOT']."/blog/wp-blog-header.php");
query_posts('showposts=1');
while (have_posts()): the_post();?>
<h2><a href="<?php the_permalink(); ?>" title="Blog">
Latest blog: <?php the_title(); ?></a></h2>
<?php the_excerpt(); ?>
<?php endwhile;?>
I saved this code separately into a file called latest_post.php (stored in my “includes” folder).
In my homepage file I added some “placeholder” code where I want the blog post to appear. This will be displayed until the data comes back from WordPress:
<div id="latest_post"> <h2>Latest blog: loading...</h2> </div>
Note the id of latest_post assigned to the div. Then I added the following javascript code to the <head> section of the homepage:
<script type="text/javascript">
window.onload = new Function("loadXMLDoc('/includes/latest_post.php');");
function loadXMLDoc(url)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",url,false);
xmlhttp.send(null);
document.getElementById('latest_post').innerHTML=xmlhttp.responseText;
}
</script>
The function loadXMLDoc retrieves the php file I’ve created above (latest_post.php) and then the last line replaces the text within the element with id “latest_post” with whatever is retrieved. This is standard ajax code which can be used for any purpose. Only the last line is specific to my page.
The code window.onload... calls this function when the page is loaded.
So, when the page is requested the php and html that’s on the page display the page with the placeholder text, but without the blog post, so the page loads nice and quickly. Once the page loads, the javascript is fired which calls the AJAX function to retrieve the blog post, and this loads on the page when it’s available.
This was the first time I’ve used AJAX, and it seemed quite a neat little solution, so I thought I’d post it here. This is the basic solution which could be further enhanced with some error handling.
Find myself in an interesting situation at the moment – enforced usage of IE6 at work. Good reasons for this of course, one application used in this organisation will only work with IE6. Quite a common situation.
What’s interesting is what doesn’t work in IE6 – including two websites for web design agencies I was looking at last week. One of these actually said that their site didn’t work in IE6 and told me to upgrade my browser (I can’t), and the other one just broke (badly) in IE6. Another different site I viewed on the same day used transparent pngs, which aren’t natively supported by IE6. Update: Found another two web design agencies whose pages break in IE6 this week – and these were New Media Age Top 100 agencies as well.
Although I use IE6 at home, I use it exclusively for testing websites I’ve built to make sure they’re OK, so don’t normally come across so many issues.
Personally, at the moment, much as I’d like to ignore IE6, I don’t think it’s acceptable to do so. Excluding people using IE6 from using your website is equivalent to saying, in UK terms, that it’s unavailable in Scotland and Northern Ireland. Or, in US terms, unavailable to most of the people in California.