Thursday, 8 May 2008

Force files to download, not stream

I recently encountered a problem during a build of a site, where I was linking to MP3 files that the user could download.

The trouble with linking to media files, such as music, videos etc, is that the vast majority of browsers will try and stream the media by default, and this is something I had to try and overcome.

In the end, I found a simple piece of PHP script which enabled this process perfectly.

I have checked in IE6, IE7, Firefox and Safari, and all works well in each.

Here's how!

For this example, lets assume we are linking to an MP3 file, as I was during the build.

Originally my link looked like:

<a href="test.mp3">Download this MP3</a>

Firstly, instead of linking directly to the media file in question, link to a PHP page. We will come to the contents of this page in a second. So, your link instead will look like..

<a href="test.php">Download this MP3</a>

Now, lets get to the PHP page. Obviously you will need to firstly create the page, entitled test.php, or whatever you fancy.

It is important when placing this code in your php page, that this is the only code in the entire page, and that there are no spaces above or below the code.

So, within this page, paste the following:

<?php header('Content-disposition: attachment; filename=test.mp3'); header('Content-type: audio/mp3'); readfile('test.mp3'); ?>

You can see where you need to change the two references to the MP3 filename in the script. There is also another variable, audio/mp3. If you are linking to a different audio filetype, for example a .wma file, change this to audio/wma. Similarly this will need changing if linking to a video file.

And there you have it. Upload all the files to the server, and you are done.

Labels:

Wednesday, 13 February 2008

Bespoke 404 Error Pages

We have no doubt all seen bespoke or custom error pages on websites before. But what point do they serve, and how do you implement them?

Well, there are two good reasons for having them in my opinion. I'm sure there are blog posts out there covering a whole multitude of reasons, but I have just two.

The first, less important example in my opinion, is user error. If a user manually navigates to a missing page on the server by typing the URL incorrectly, it is always more pleasant to be greeted by a bespoke error page than a boggo 404. This page can then have links to the homepage, the sitemap, or any pages that you think might be of particular interest within your site.

The second reason is for the interim period between deleting files off your server and the search engines catching up.

You should all be adding pages that are no longer on the server to the robots.txt file as you go along, and you can also request for example Google to remove the URL within the Webmasters tools. But as we all know, this isn't instantanious.

Ask yourself the question - if you clicked on a search result from a search engine and was presented with your broswer default 404 message, would you bother visiting the sites homepage to find out more by altering the URL yourself? Doubtful. More than likely the back button would quickly be pressed, and you would move on to the next result.

However, have the user greeted by a page from your site with a polite message to say this page is no longer available, and offer some alternatives, and there is a likelehood you will still hang on to that visitor.

This is all great. But how do you implement it?

Well, it is surprisingly simple. You need two things, the error page, and a simple text editor such as notepad.

Once you have created your error page, save it with a filename of, for example, error.shtml or 404.html, whichever file extension suits depending on your project.

Then, in your text editor, paste in the following information:

ErrorDocument 400 http://www.mydomain.co.uk/400.html ErrorDocument 403 http://www.mydomain.co.uk/403.html ErrorDocument 404 http://www.mydomain.co.uk/404.html ErrorDocument 500 http://www.mydomain.co.uk/500.html

Replace "mydomain" with your domain name, and specify which filename you require the browser to redirect to depending on which error is thrown.

Go to File > Save, and ensure that the filetype is set to "all files". Name your file simply .htaccess and save the file.

Upload this to your root directory, and try it out!

As ever, if you have any questions or comments, post them up and I shall reply as soon as I can.

Labels: ,