How to Improve Your 404 Page Template in WordPress (2 Ways) – Website Tips

Curated by WorkingFromHome

This article is an excerpt from the original article found in the Read More link – please follow for full article.

Do you want to improve your 404 page template in WordPress?

Improving the default WordPress 404 page can help create a better user experience, reduce bounce rate, and increase pageviews.

In this article, we’ll show you how to customize your 404 page template in WordPress, step by step.

Why Improve Your 404 Page Template in WordPress?

Most visitors who land on the default WordPress 404 page will leave your WordPress website quickly.

This will increase your bounce rate, create a poor user experience, and can even negatively impact your search engine rankings.

By improving your WordPress 404 page, you can send visitors to popular posts, increase pageviews and reduce bounce rate, and turn one time visitors into long-term readers and customers.

When a visitor stays on your site longer, they’re more likely to make a purchase, read more posts, join your email list, and more.

Plus, it can improve your WordPress SEO, so you’ll get more search engine traffic.

Note: it’s important to create a custom 404 page, but you should also track what 404 URLs visitors use to visit your website and then set up proper redirects to improve SEO rankings.

For more details, see our guide on how to easily track 404 pages and redirect them in WordPress.

With that said, let’s take a look at how you can improve your 404 page template in WordPress.

Method 1. Create a Custom 404 Page in WordPress With No Code

The best and most beginner friendly way of improving your 404 page template is using the SeedProd page builder plugin.

SeedProd is the best landing page builder for WordPress. It lets you create, edit, and customize your WordPress pages without writing any code.

With this plugin, you can easily create a custom 404 page using the included 404 page templates.

First thing you need to do is install the SeedProd plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Note: there is a free version of SeedProd available, but we’ll be using the Pro version since it has the 404 page templates we need.

Upon activation, you need to navigate to SeedProd » Settings and enter your license key. You can find this information on your account page on the SeedProd website.

After that, go to SeedProd » Pages and click ‘Set up a 404 Page’ button in the ‘404 Page’ meta box.

This will bring you to a page where you can select your 404 page template.

There are dozens of professionally designed 404 page templates you can choose to help you get started quickly.

To select a template, hover over it and click the ‘Checkmark’ icon. For this tutorial, we’ll be using the ‘Oh No 404 Page’ template, but you can use any template you like.

After selecting a template, you’ll be taken to the drag and drop builder, where you can start customizing your 404 page.

You’ll find blocks and sections you can add to your 404 page on the left side of the screen. The right side of the page is the live preview. Every element on the page can be edited and customized.

First thing, we’re going to add text and tell users what to do next. Instead of simply landing on a 404 page and leaving, you can direct your visitors towards valuable content and the next actions to take.

To do this, drag the ‘Text’ block over to your page, and click it to change the text.

Next, we will change the home page button link and instead link to one of the most valuable pieces of content.

This can be a post on your WordPress blog that’s the most popular or one that brings you the most revenue.

First, drag over the ‘Headline’ block and add your new headline.

Then, drag over another ‘Text’ block and enter some text that describes your article.

After that, click on the button to bring up the button editor screen.

Here you can customize the text, color, size, and more.

Add Your Most Popular Posts to Your WordPress 404 Page

Next, you can add your most popular articles. Since these articles are proven to be popular, there’s a good chance your visitors will find something they like.

The easiest way to do this is by using the MonsterInsights plugin. It’s the best analytics solution for WordPress used by over 3 million websites.

With this plugin, you can simply add popular posts anywhere on your WordPress website.

For more details, see our guide on how to display popular posts by views in WordPress.

Once the plugin is activated and set up, all you have to do is add a single shortcode to your page.

To do this, simply drag the ‘Shortcode’ block over to your page.

Then, enter the following shortcode to display your most popular posts.

[monsterinsights_popular_posts_widget theme="beta"]

The theme=“beta” portion refers to how your popular posts will display. If you want to see how the different themes look, then go to Insights » Popular Posts and click on ‘Popular Posts Widget’.

In the ‘Choose Theme’ section, you can view each of the themes and their names.

You can also add a headline above your popular posts following the same steps as above.

Add a Contact Form to Your WordPress 404 Page

After that, you can add a contact form directly to your 404 page. This lets your visitors reach out to you if they couldn’t find what they were looking for in the links above.

The best way to add a contact form to your site is using the WPForms plugin. It’s the best contact form plugin for WordPress used by over 4 million websites.

For more details, see our step by step guide on how to create a contact form in WordPress.

Once the plugin is activated and set up, you can simply drag the ‘Contact Form’ block over to your page.

Then, all you have to do is select your contact form from the drop down list.

You need to create your contact form first before you can add it to your 404 page.

You can also add a ‘Headline’ or ‘Text’ block above your contact form.

Follow the same steps as above to add those blocks.

Once you’re done making changes, make sure you click ‘Save’ in the upper right corner of the page.

If you want to publish your page live, then select the drop down arrow next to ‘Save’ and click ‘Publish’.

You can also change the logo and navigation menu by clicking on them and making changes with the panel on the left, then following the same editing process as above.

Feel free to continue customizing your page, adding new blocks, and testing different layouts to see what your visitors prefer.

If you’re a WooCommerce store owner, then you can customize your 404 page by displaying popular products to help get more sales.

To make your new 404 page active, navigate back to SeedProd » Pages and then switch the ‘404 Page’ toggle to ‘Active’.

Now, your visitors will see your high converting 404 page, instead of the default option.

Pro tip: you can track the performance of your WordPress 404 page to see how it’s converting and which changes are the most useful. For more details, see our beginner’s guide on how to install Google Analytics in WordPress.

Method 2. Create a Custom 404 Page in WordPress By Adding Code

This method is not as beginner friendly because you will have to add code and modify WordPress theme files.

If you haven’t done this before, then please see our beginner’s guide to pasting snippets from the web into WordPress.

First, you need to create a new file in your WordPress theme folder and name it 404.php. If your theme already has a 404.php file, then you’ll need to edit that file instead.

To edit this file, you need to connect to your WordPress hosting account with an FTP client, or their file manager tool.

After you’re connected to your website, you can see your 404.php file in your WordPress theme’s folder.

Note: before you customize your WordPress theme, we recommend backing up your WordPress site. For more details, see our guide on how to backup and restore your WordPress site.

Display Most Popular Posts on 404 Page

First thing you need to do is install and activate the free WordPress Popular Posts plugin. It’s one of the best popular posts plugins for WordPress.

For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, you need to add this template tag into your 404.php file where you want to display the popular posts.

    

Display Most Commented Posts on 404 Page

To add the most commented posts to your WordPress 404 page we’ll be using the same plugin you activated above.

Simply add the following template tag where you want to display your most commented posts.

    

You can also check out our guide on how to display most commented posts in WordPress.

Display Recent Posts on 404 Page

There are multiple ways to display recent posts in WordPress.

The easiest way is to add this template tag in your 404 template to display your recent posts.

   'postbypost', 'limit' => 10, 'format' => 'custom', 'before' => '', 'after' => '
' ) ); ?>

Display Random Posts on 404 Page

If you want to display a random list of posts in WordPress, then you can simply add this code in your 404 template where you want

For the Full Article
Please Continue Reading Here: How to Improve Your 404 Page Template in WordPress (2 Ways)

Commentary:
Some useful tips and urls can be seen on this full article.
source – WPBeginner.com

You May Also Like…

How to Add Expires Headers in WordPress (2 Methods) – Website Tips

How to Add Expires Headers in WordPress (2 Methods) – Website Tips

Do you want to learn how to add expires headers in WordPress? Expires headers are rules that let web browsers know whether to load a web page resource like images from the visitor’s browser cache or from your server. These can help improve the performance of your site. In this article, we’ll show you two ways to add expires headers in WordPress. How Are Expires Headers Used in WordPress? The first time someone visits a web page on your WordPress site, all of the files are loaded one by one. All of these requests between the browser and your WordPress hosting server increase the web page loading time. Browser caching stores some or all of those files on the visitor’s computer. That means that the next time they visit the page, the files can be loaded from their own computer, boosting your WordPress performance. Now you might be wondering, how…

Working From Home TV …

Tips to enhance your own website…

How to Add Expires Headers in WordPress (2 Methods) – Website Tips

How to Add Expires Headers in WordPress (2 Methods) – Website Tips

Do you want to learn how to add expires headers in WordPress? Expires headers are rules that let web browsers know whether to load a web page resource like images from the visitor’s browser cache or from your server. These can help improve the performance of your site. In this article, we’ll show you two ways to add expires headers in WordPress. How Are Expires Headers Used in WordPress? The first time someone visits a web page on your WordPress site, all of the files are loaded one by one. All of these requests between the browser and your WordPress hosting server increase the web page loading time. Browser caching stores some or all of those files on the visitor’s computer. That means that the next time they visit the page, the files can be loaded from their own computer, boosting your WordPress performance. Now you might be wondering, how…

How to Edit HTML in WordPress Code Editor (Beginner’s Guide) – Website Tips

How to Edit HTML in WordPress Code Editor (Beginner’s Guide) – Website Tips

Are you looking for an easy way to edit HTML on your WordPress website? HyperText Markup Language or HTML is a code that tells a web browser how to display the content on your web pages. Editing HTML comes in handy for advanced customization and troubleshooting issues. In this article, we’ll show you how to edit HTML in the WordPress code editor using different methods. Why Should You Edit HTML in WordPress? WordPress offers thousands of themes and plugins to change the appearance of your website and customize different elements without touching a single line of code. However, plugins and themes have their limitations and might not offer the exact features you’re looking for. As a result, you might be unable to style your website the way you want it to look. This is where editing HTML is really useful. You can easily perform advanced customization using HTML code. It…

0 Comments

Submit a Comment

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