Error pages, how to customize them? –

Error pages are used to inform your website visitors about site problems. Each problem type corresponds to a set code. A visitor accessing a nonexistent URL will see a Error 404while an unauthorized user trying to access a restricted file will see a error 401.

The Apache web server automatically provides basic error pages, which you can customize. You can also call them from the file you have created more custom for any HTTP status code starting with 4 or 5 (400/500).

Hosting Mautic QuickStart -50% with support in Spanish
24 hours and free training

Send up to 1,000,000 emails/year. Mautic support in Spanish 24 hours, 365 days

Error pages are typically HTML pages that include links to images and can use Cascading Style Sheets (CSS) to customize the view in the browser.

As a general rule, the .html files of the error pages are located in the main folder of the installation that these files serve, although it is possible to centralize all the error pages in a specific folder and call these pages with absolute urls.

Examples of common error page calls:

• ErrorDocument 500 /internalerror.html
• ErrorDocument 401 /authrequired.html
• ErrorDocument 403 /forbidden.html
• ErrorDocument 404 /notfound.html

It is not recommended to use special characters or spaces in the composition of the names of these files.

The .htaccess file, responsible for calling these error files, must be located in the root folder of the Hosting.

The instantiation format to custom error files, in the file .htaccess it is:

ErrorDocument 404 /404page.html

If you handle different custom error messages, you can consider creating a folder where you can store the different files and instantiate them from the file .htaccess incorporating the relative path:

ErrorDocument 404 /errors/404.php

You can create a custom error page with HTML code, and then configure the error page call from .htaccess to help reduce the use of server resources needed to serve requests for pages that don’t exist.

If you make continuous queries to your database, dynamically, to check if a page exists or not, you will end up consuming a large amount of hosting resources, and the user experience will be worse with a slower loading of the site for visitors. .

Some errors that you can customize through the corresponding page:

• 400 – Wrong Request
• 401 – Authorization required
• 403 – Prohibited
• 404 – Not found
• 500 – Internal Server Error

All the errors that can be managed in a personalized way from WePanel:

• 400 (bad Request)
• 401 (authorization required)
• 402 (payment required)
• 403 (forbidden)
• 404 (not found)
• 405 (method not allowed)
• 406 (not acceptable)
• 407 (proxy authentication required)
• 408 (request timed out)
• 409 (conflict)
• 410 (lost)
• 411 (required length)
• 412 (failed precondition)
• 413 (request entity too large)
• 414 (Request URI too large)
• 415 (incompatible media type)
• 416 (unrealizable request interval)
• 417 (failed expectation)
• 422 (non-processable entity)
• 423 (locked)
• 424 (failed dependency)
• 500 (Internal Server Error)
• 501 (not implemented)
• 502 (bad gateway)
• 503 (service not available)
• 504 (gateway timeout)
• 505 (HTTP version is not supported)
• 506 (variant also negotiates)
• 507 (insufficient storage)
• 510 (not extended)

It is not necessary to create custom pages for all existing errors, but only for common ones such as 404 errorsfor instance.

What should an error page file contain?

A file that displays an error notice to the visitor must contain the file type declaration, a header a body and can also include declarations of CSS styles to format the texts and images that are displayed on the screen. A common example can be:

The page, if the error occurs in the browser, would be something like the following:

Edit error pages in WePanel

If you work in a hosting panel based on WePanel, you can manage the different error pages from the section Advanced, error pages.

There are two important tabs available:

• Edit common error codes
• Show all HTTP error status codes

from the tab Edit common error codes it is possible to see the usual error pages already created.

To edit, for example, the 404 error page, click on the corresponding element and access the HTML code edition from where you can customize it or adapt it to your needs.

Labels available for customization:

• referral url:
• Visitor’s IP address:
• requested url:
• server name:
• Visitor’s browser:
• Redirect status code:

Notice that the page you are editing is .shtml and not .html.

Surely you have found yourself in your Hosting Panel, in the error logs notices of pages that do not exist and that refer to pages that are not .html but .shtml

File does not exist: /home/public_html/404.shtml

From your WePanel, Advanced, error pagesyou can manage them as I have explained above.

In the following video David Noguera You can see in more detail how to use the WePanel tool to customize these pages.

WordPress error pages

In WordPress you can customize them manually, for my taste a bit elaborate, or you can do it using plugins as usual! 😀

one of my favorites is 404page for its versatility and ease of use. Take a look at it and if you like it, adopt it in your websites made with WordPress.

Recommended reading:

Error pages in PrestaShop

By default PrestaShop includes the following pre-formatted error management pages:

In addition, the CMS includes custom pages embedded within the theme in use, which is also possible to customize, which you can find in routes such as:

• Error 404: /public_html/themes/default-bootstrap/404.tpl

In case of 404 errors, we would see the following error page embedded within the Store theme:

Recommended reading:

Error pages in Joomla

In Joomla the errors are shown embedded in the template in use and managed from the same file called error.php which will display custom messages for each type of common error that occurs (400/500).

You can read the official Joomla.org documentation for the .

In the following video John Marreos You can see in more detail how to improve the 404 error page in Joomla.

Other no less important considerations

Don’t forget to exclude those custom error handling pages from being indexed by search engines. If you have centralized all the pages in a folder, for example /public_html/errors/ you can add in the file robots.txt the following line:

Disallow: /errors/

Another option would be to include the following code within each error page, be it custom .html or .shmtl (managed from your WePanel), between the tags Y to prevent the indexing of these pages:

With this we avoid the indexing and tracking of the internal links that these pages may contain. However, but like everything in life, it is about the day that your bots have and how Panda has dawned.

Now you understand a little better how to find and modify or customize the different bug management pages in your usual dynamic content manager. It’s time for you to put it into practice.

Faced with HTTP 404 response errors, the content of your page and the positioning will be greatly affected, and possibly the page that returns the error will not be crawled or indexed. Google, Bing, Yahoo, etc. don’t like 404s, don’t forget that!

Help us improve our content by sharing your opinion

Member of the technical support team.
Coordinator of contents in the Blog and in Youtube.
Technical support in CyberProtector. Teacher at University