Ubuntu 13.10 - Apache2 - Custom 404 - not with .htaccess

Question

So I've spent a fair bit of trying and reading including the http://httpd.apache.org/docs/2.2/custom-error.html

and I sadly can't get it all to align.

What I'm trying to do (with Ubuntu 13.10 & Apache2) is the following: Use virtualhosts. Have the default site and all virtual hosts return a custom 404 page.

This 404 / html page has an image it loads as the background, so in the Apache root directory (/var/www) I have: 404.html [images]\404-background.jpg

I've tried so many iterations (and continue to while hoping for help) that I'm not going to list them all here. I'd like to do this within the config files and not .htaccess files.

Can someone point me in the right direction please? I apologize for the similar questions but they seem to refer to previous versions of Ubuntu / Apache (for example the new default .conf extension)

I have edited /etc/apache2/conf-enabled/localized-error-pages.conf with

ErrorDocument 404 /404.html

The 404 works on the default but not in the virtualhost. I'm likely missing an directive in the VH config file.

The issue stems from the VH referencing its own DocumentRoot. In the HTML of the 404.html page I have:

<div id="background">
    <img src="images/404-background.jpg" class="stretch" alt="404 - Page not found." >
</div>

If I try an Alias approach I can get the 404.html page to load but the image reference doesn't work (because it is looking at the VH as the base)

Example VH.conf that won't reference the image:

Alias "/error" "/var/www/"
ErrorDocument 404 /error/404.html

I've tried approaching this from

/etc/apache2/conf-available/localized-error-pages.conf 

which is probably what it will take but haven't yet sorted it.

Many thanks.

Answer 1

OK - the following worked (although I wish it took a little less effort):

Copy the 404.html file to

/usr/share/apache2/error

If it is a simple page, you nearly done. Because I used CSS and Images it required a bit more work.

In your /etc/apache2/conf-available/localized-error-pages.conf add your new file for example:

Alias /error/ "/usr/share/apache2/error/"
ErrorDocument 404 /error/404.html

Now if you are using CSS and Images you have to create Aliases in each virtual host.

For example in SomeVirtualHost.conf

Alias /images/ "/var/www/images/"
Alias /css/ "/var/www/css/"

Beware of any conflicts that may arise from duplicate folder naming. After considering that I added a folder /404resources/ and moved the 2 dependent folders. This required an update to the 404.html page as well

Answer 2

In your VirtualHost directives for the site, you could add the ErrorDocument 404 /404.html in each of them. But you would need the 404.html document to be put in each of the VirtualHosts document root. e.x. If I have a VirtualHost for the filepath /var/www/test then you would put the 404 HTML document in the root of that directory.