fbpx

How To Design Custom 404 Page For Your Website Using Elementor

Suppose the Event Page on your website is not available for access. Given the situation, you use a custom 404 Page to let your users know that the Event Page is down.

How To Design Custom 404 Page For Your Website Using Elementor 1

Why not use the Standard Server Reply?

You might be wondering what would happen if you do not create a 404 Page for your website. Well, the answer to your question is, nothing much. If for any unavoidable reason any page on your Website goes down, the server will send an automatic reply. Your visitors will see that reply on their screens. So what is wrong with the Standard Server Reply? Well, the problem is it is standard.

Create a Custom 404 Page

By using Elementor you can avoid having to go through four troublesome steps of creating a 404 Page. You no longer need to go to the Customizer, change theme settings, get a 404 plugin for WordPress and lastly, edit the codes. You can create funny and attractive 404 Pages with Elementor within an hour.

Open your WordPress Dashboard and navigate to Elementor>My Templates.

How To Design Custom 404 Page For Your Website Using Elementor 2

From the new window select Single Pages tab and click on the green Add New Single button.

How To Design Custom 404 Page For Your Website Using Elementor 3

First, from the new popup, select 404 Page from the Select Post Type drop-down. Second, give a name to the Template. Lastly hit the Green Create Template button. 

How To Design Custom 404 Page For Your Website Using Elementor 4

404 Templates

You will be taken to the Blocks tab from where you have to select a 404 Pages template.

How To Design Custom 404 Page For Your Website Using Elementor 5

Browse through the templates library. When you find a template of your choice, click on the little green Insert text at the bottom of the template card.

How To Design Custom 404 Page For Your Website Using Elementor 6

Now the template comes with all the common elements that you will want in a 404 Page. But that does not mean you cannot edit or customize it.

How To Design Custom 404 Page For Your Website Using Elementor 7

Pick any element from the Side Panel and drop it inside the editor interface. Use the search bar to directly type in the element you require or use the scroll bar to navigate through the Elements panel. You can even take inspiration from these funny 404 Page templates. 

How To Design Custom 404 Page For Your Website Using Elementor 8

Once you are happy with your 404 page hit the Publish Button sitting at the bottom of the Footer Panel. This will bring up the Conditions Pop-up.

How To Design Custom 404 Page For Your Website Using Elementor 9

Set a Condition for your 404 Page and hit the Publish button. And that should be it. You have successfully created a 404 Page for your website.

Wrapping Up!

How easy was it? No need to answer the question. Do let us know if you find it hard to follow the instructions. Mention the specific section you need further clarification and we will get back to you.

Picture of Afshana Diya

Afshana Diya

Afshana Diya is CMO at WPDeveloper. She is helping the company to create a dynamic team and sustainable business from the scratch. When she is offline from the digital world, she must be traveling to find natural beauty in remote places.

Share This Story

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  • 00Days
  • 00Hours
  • 00Mins
  • 00Secs

Wait... before you go!

Checkout now to Save