How to easily make a custom 404 error page with Divi

When you think you’re done customizing your website to the max, even if you use Divi, you’re still going to be missing something that almost no one thinks about: the 404 error page.

What is the 404 error page?

The 404 page is an error page that all WordPress themes display when a user arrives at a link that does not exist on your website, either because the link he clicked was wrong or because he typed it with some error.

By default, most WordPress themes show a generic 404 error page, which simply informs that the user has reached a page that does not exist, without further help, but especially without anything to encourage the user to continue browsing.

And in the case of our beloved Divi theme the situation is no different:

default 404 error page

This type of 404 error page without customization is a lost opportunity for a new user to find interesting and valuable content on our website, despite the initial error, and it is something that we should fix.

In fact, if you type in some random URL on your favorite websites you will see that in many cases they take advantage of these “errors” to offer a search engine, interesting links and other content to users who, by mistake, arrive at the 404 page.

So what I propose you today is to create a good 404 error page, which brings value to the user who reaches it unintentionally.

How to create a custom 404 error page with the Divi theme builder

If you have the theme or Divi builder updated then you already have everything you need, because you have the tool called “Divi Theme Builder“.

The first thing is to access the theme builder and create a new template.

theme builder add new template

As soon as you click on the button to add the new template, the first thing you have to select is where it will be used. At the bottom, in the “Other” section you have to select the “404 page” option.

theme builder template settings

As said, check the “404 page” option and click on “Create template“. A new template will be created, in which you can customize the header, footer, and of course the custom body content.

theme builder add custom parts to template

From this point on, simply click on the elements you want to customize and set them to your liking, as you would with any other page on Divi.

What should I include in a custom 404 error page?

With all the options available in Divi to customize your 404 error page template, there are several elements you can include that will bring value to the user who mistakenly lands on that page.

Make it attractive

There is nothing more boring than an error page, so make it attractive, even nice, don’t make the user think that the error is their fault.

Free your imagination here, but a nice image will always help…

404 image

Include a search tool

Nothing easier with Divi, just add the search module and you are already offering the user a way to find what he was looking for.

divi search module

Include a list or navigation of entries and/or pages

You also have navigation modules and even a slider of entries and pages, which you can display, thus taking the user immediately to specific interesting content, which you can even choose yourself.

divi post slider module

Include a form

While you’re at it, why not offer a contact form or – even better – a subscription form for your newsletter?

divi contact form module

Include a link to the home page of the website

And always offer a link to go to the home page of the website, from where the user can visit the main sections of your site.

divi call to action module

When you have finished designing the custom 404 error page to your liking save the changes in the Divi builder and close the template editor, then save the changes on the theme builder too.

That’s it, you’ve configured your custom 404 error template!

How useful was this post?

Click on a smiley to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

As you found this post useful...

Follow us on social media!

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top