6 Professional Looking Custom 404 Error Pages

Right now here I'm rear with another amazing tutorial that is a professional 404 error page. After reading the title with the post, You've regarded about our current topic. So let us begin the tutorial. In the past with old Blogger interface we're unable to create a custom error page but now it is possible because now that option is additionally available in Search preferences settings.When someone landed in a broken link or not found page, then it shows a message which has been extremely different from original blogs. Well, These are old things which can be now modern. People that don't know about 404 Error page can see the below passage to know it.

What is 404 Error Page:

It is a web page that's being used by means of all websites to show the error while someone enters into a broken or not found link. Quite simply, when you enter in an incorrect link then that web page appears.It is used to stay the visitor on our blog and tell him that you enters with a broken link.

How to Add:

The adding process is quite simple. You have to just follow below steps:

• Go to Setting->Search Preferences 
• Copy below code and Paste it in Custom Page Not Found section as below screenshot.

Error Page Style 1

[code]
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>

<h3 style="font-size:17px;">Sorry,You are trying to reach an
invalid page...!<br><a href="/">Click here</a> to go
to Homepage <br> Have a nice Day...</h3><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbWPC0LshCHyUZGz98tvQC0VDHNxE53_f3VJ1Punt2zjqkMlNJTsgZyvZFMXuEyJVkSmiF_oOs8L7OMlp8Q21TyEZkJl3wwDvT7YugWIBq1xAkVraticjZ4b5uFcsXeuNMMpmPY-i9iDw/s1600/404+error+page+1.jpg"/>[/code]

Error Page Style 2

[code]
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>

<h3 style="font-size:17px;">Sorry,You are trying to reach an
invalid page...!<br><a href="/">Click here</a> to go
to Homepage <br> Have a nice Day...</h3><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzxEPNGNJ0bwtpqrvRpnaRRK1apuIvuW7YB6EfFVWmzXKJ6qIyQaMB2nlG5I8e-ivUzmDO3mgSfPu1ie25_91co5W4yT2DlABbUhALEl6tHeOb9Sn4jncmbpBEoywxAov97sIfSZBY63Y/s1600/404+error+page+2.jpg"/>[/code]

Error Page Style 3

[code]
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>

<h3 style="font-size:17px;">Sorry,You are trying to reach an
invalid page...!<br><a href="/">Click here</a> to go
to Homepage <br> Have a nice Day...</h3><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzh9mfdqbjKFhgc50phgfqfNPGL-rRuuHcEcDEI3i99cv1W0hplbDb6tHm6sF0G_qtf8_BJu7Lnpob1McZbpVUj_BsP5I13gqK_AMfu5XeA5d9CrPH6GqkmveMElBHdhdOhc2fGlA4mUo/s1600/404+error+page+4.jpg"/>[/code]

Error Page Style 4

 

[code]
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>

<h3 style="font-size:17px;">Sorry,You are trying to reach an
invalid page...!<br><a href="/">Click here</a> to go
to Homepage <br> Have a nice Day...</h3><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCmm-cF0vtSeX-JCs53Fo-LyrVATi0Ce74vu7GZAbLMknorZFTW8pGjNKwvOxaCHIqPzvRGOyvbFyHg2OYERtIhKAjRNgP4gyT-LZY9tMg36JrvLJ14FXDvX7AsA9IrIRQmEb7Jq1LmWw/s320/404+error+page+6.jpg"/>[/code]

Error Page Style 5

[code]
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>

<h3 style="font-size:17px;">Sorry,You are trying to reach an
invalid page...!<br><a href="/">Click here</a> to go
to Homepage <br> Have a nice Day...</h3><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiESnGscP1QmScDYneSRdJ9-v10u-5qsMDsfcNLBf2VKR6xyoeZ8aF0KOzRGLgVeBSHLUlIr-d0S11UVXj67UcUVcvhpS-xrlqfwxqWWhX2aQYyVa5qumfSz-wu4uwfyDu9Jay99B3Bh5o/s1600/404+error+page+7.jpg"/>[/code]

Error Page Style 6

[code]
<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>

<h3 style="font-size:17px;">Sorry,You are trying to reach an
invalid page...!<br><a href="/">Click here</a> to go
to Homepage <br> Have a nice Day...</h3><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeh2kQ5hO4LI_Fd0ELxamJqdVPyOsTiKp68GGnE1lrkJG1u60-0pGFFoUCkxodleX83r0ky6jiNdFcOj493tsXv1OfKKAcp4wJiKX4u2QUer5WiN7RX6HzwaXHWv8wEzwxEvhZieRUv9k/s1600/404+error+page+3.jpg"/>[/code]

•  Now Replace / (highlighted by orange colour) with your homepage url.
• Then Click Save..That all..

Final Words:

I hope you like these professional looking 404 error pages and added it to your blog. Now It's your turn to share this post with your friends and write your views in comment box below till then Peace, Blessings and Happy Blogging.