Categories

Featured templates

JS Animated. How to integrate custom 404 error page

Lana Greene December 12, 2014
Rating: 5.0/5. From 1 vote.
Please wait...

This tutorial shows how to create a custom 404 page for your HTML website

JS Animated. How to integrate custom 404 error page
  1. Create the Custom 404 page:

    Create a file called 404.html (or whatever you want to call it) with any message you want your visitors to see when they hit any missing page. A small sitemap and / or search box is a nice idea, along with letting them know the page they requested is not available. You might also be interested in checking out some tips for a useful 404 error page.

    In our case 404.html page has been already created:

    How_To_Create_a_Custom_404_Page-1

    Note that 404 page is included in the HTML5 and Bootstrap Template packages.

  2. Create the .htaccess:

    Open your .htaccess file if you already have one. If not, then open notepad or your favorite text editor (a WYSIWYG editor won’t work here) and add this line:

    ErrorDocument 404 /404.html

    You can name your error file whatever you’d like and use any extension you are most comfortable with, however, DO NOT use an absolute (full URL including the domain name) here:

    How_To_Create_a_Custom_404_Page-2
  3. Upload:

    Make sure your FTP program is set to upload in ASCII mode, upload the 404.php, then the .htaccess:

    How_To_Create_a_Custom_404_Page-3
  4. Make sure your browser cache is cleared and type in a file that doesn’t exist on your server. Something like http://www.example.com/oops. You will see your new 404 page:

    How_To_Create_a_Custom_404_Page-4
  5. Notes About a Custom Error Page

    What you have on your error page is your personal choice. Some people prefer just a link to the main page, others go for a more friendly approach and let the visitor know that the page isn’t available and create a nicely designed page with links to other areas or even a search to let them find what they wanted.

Feel free to check the detailed video tutorial below:

JS Animated. How to integrate custom 404 error page
This entry was posted in JS Animated tutorials and tagged 404, custom, error, HTML, page. Bookmark the permalink.

Submit a ticket

If you are still unable to find a sufficient tutorial regarding your issue please use the following link to submit a request to our technical support team. We'll provide you with our help and assistance within next 24 hours: Submit a ticket