In today's article we'll explore everything that goes into building the best 404 page, and help your lost visitors explore your website.
This often-overlooked page doesn't have to be a boring, unprofessional dead-end. 404 pages are an unavoidable part of running a successful website, so it's worth getting them right.
It's a long one, so grab a coffee, dim the lights, and let's jump right in!
More...
The Basics – What are 404 pages and why do they matter?
What is a 404 Page?
We've all experienced it.
Maybe you followed an old link or mistyped a web address.
Maybe a blog article or product page was deleted.
Whatever the reason, you find yourself on a missing page – or, as it's known in the industry, a 404 page.
This is a universal page that has 3 main purposes:
It lets visitors know the page they were looking for is missing or moved.
It gives website owners feedback as to missing pages or broken links via tools like Google Search Console.
It tells search engines that a page doesn't exist.
Why are they called 404 pages?
So why the random number for such a simple concept?
The answer is technical, but not complicated. Normally, I'd spare you the details, but this is essential learning for anyone running a website.
Ready to get technical for a moment? Here we go...
Every time someone visits a web page, the server comes back with a code that indicates the result:
New URL structures
Archived content
Script errors
That wasn't too bad, was it?
404 is a catch-all that includes every reason an expected web page isn't there.
Everyone working in website design and marketing understands the term 404, so despite its geeky origins, it's not going away any time soon.
What causes a 404 error?
Simply put, you'll see a 404 page whenever you try to view a web page that isn't there. Even if it should be there.
It means either the page was moved or deleted, or the address is wrong.
But that just tells us what is happening, it doesn't pinpoint the reason why.
Here are the most common causes of 404 errors:
Mistyped URLs
Yes, some of us still type URLs into the browser address bar!
If you were to mistype our URL like this…
https://staging.thrivethemes.com/themebiulder/
… not only would you miss out on the best WordPress theme builder ever, but you would also find a 404 page.
Content moved to another URL
Sometimes it's necessary to change a page URL after it's published.
Forget to redirect the old URL and you'll get a 404 error.
Always think carefully before changing published URLs. Make sure you understand the technical implications – you don't want to negatively affect SEO performance or marketing funnels.
If in doubt, ask an SEO specialist first.
Broken inbound links from other websites
We can't control how other people link to us.
After publishing content on their blog post or social media, many people don't check their links. If the link contains a typo, it will usually result in a 404 page on your website.
Most visitors will just assume the page is missing without checking the address bar.
Broken internal links
This one's 100% on you.
If you're linking from anywhere on your website, always check they work before – and after – hitting publish!
We recommend regularly checking for broken links with tools like Screaming Frog Spider and Xenu Link Sleuth - both absurdly named but very powerful.
Changing permalink structure
WordPress lets you define how your URLs are constructed in the permalink settings.
Some people choose to include the date or category, others prefer just the snappy post title.
- website.com/category/post-title
- website.com/12/03/post-title
- website.com/post-title
Always be careful when changing permalink settings in WordPress. It can instantly break internal and external links if not done correctly.
WordPress is clever enough to automatically redirect some permalink changes, but not always. Always check!
Deeper technical difficulties
Sometimes websites seem to spontaneously break behind the scenes, causing 404 errors across multiple pages.
Identifying the problem can be difficult, but a recent update is usually to blame, such as WordPress plugins or website hosting.
Another chilling possibility is a hacked website.
In either situation, roll back to a previous backup or speak with your hosting provider.
What makes a good 404 page?
Dos and Don'ts - Top Tips for Creating Effective 404 Pages
Enough setting the scene!
It's time to share our actionable advice on how to build the best 404 pages for your website.
There are four main focus areas to improve your 404 page:
1. Design
Branding, layout styles & fun-factor
2. Language
Clear and supportive communication
3. Navigation
Helpful guidance and navigation choices
4. Technical
Does it work correctly?
Is anything misconfigured?
Later, we'll use the first three focus areas as a scoring system to offer feedback on real websites.
For now, let's explore each area to find opportunities to improve your 404 pages.
Design
Most web servers, CMSs (like WordPress), and browsers offer a default 404 page.
It's not pretty – just something to fall back on if you haven't designed your own.
It's unprofessional to rely on the default 404 page. It's written in stark, technical language, and doesn't include your branding or navigation.
You can do better. Much better.
Make sure your 404 page includes your brand logo, colors and typography.
You don't want visitors to feel doubly lost with a confusing page that looks nothing like your website.
Even better, frame your friendly 404 page inside your usual template design. Include your beautifully designed navigation and footer.
Hootsuite's 404 page is so quirky it's confusing.
There's a tradition that 404 pages can be fun, creative, and a little bit cheeky. They're often viewed as an easter egg, hidden away from the majority of visitors.
You don't have to go down this route, but it can be a useful tool to help lost visitors feel more comfortable.
But remember that a little quirkiness goes a long way. Don't add more confusion by hiding the actual purpose of your 404 page in wacky playfulness.
Language
Social Blade's 404 page uses technical terms like "server" and "error 404".
Immediately, without fancy words, tell your visitors what just happened, and what they can do next.
Your 404 page isn't an opportunity to share your knowledge of HTTP server codes.
In fact, not everyone knows or cares what a 404 error page is.
Use friendly, plain language to help your visitor understand the situation and make a choice.
It's never your visitor's fault.
Even if they mistyped a URL, don't imply they are to blame for failing to get the content they hoped for. Shaming potential customers is just bad business sense.
As the saying goes, it may not be your fault, but it's always your responsibility.
Acer's 404 does nothing to support or guide the visitor.
No-one expects to see a 404 page. They expect to find the content they were promised, usually through a hyperlink.
How can you best support your visitor in the initial confusion of a 404 page?
Consider the difference in these approaches:
404 - There's no page here.
or
Oh no! This page seems to be missing.
Maybe the page was moved or you followed a bad link.
Choose an option below, or contact us for help
The first offers no guidance or support. The second uses simple, friendly language and demonstrates empathy.
Navigation
BuzzSumo offers a lazy button to the homepage.
Imagine asking for help at a supermarket, only to be told to go back to the main doors and start again.
Or trying to find the right train platform, but all the maps point to the main station entrance.
Does this sound like a supportive strategy for lost website visitors?
A good 404 page should offer alternative navigation options. Every business and audience is different, but here are some suggestions:
- Visit the Help or FAQ section
- Search for content with an embedded search form
- Explore the site map
- Contact someone for assistance
This is the flip-side of the above point – offer choices, but not too many.
As a rule of thumb, limit your suggestions to 3 or 4 navigation options.
Be clear and confident, and your visitors will feel guided rather than abandoned or left to fend for themselves.
Too many choices is overwhelming. It unfairly shifts the responsibility of choosing the best option to the visitor.
Technical
It's possible to configure your website to return a fake 404 page, in the mistaken belief this somehow helps SEO or usability.
These soft 404 pages are actually real pages posing as imposters.
Soft 404 pages artificially inflate your page count, and can cause all sorts of problems with SEO. Many e-commerce websites make this mistake, failing to remove empty product or category pages as items go permanently out of stock.
Here's the same advice directly from Google…
Returning a [soft 404], rather than 404 (not found)... is a bad practice.
A [soft 404] tells search engines that there’s a real page at that URL. As a result, the page may be listed in search results, and search engines will continue trying to crawl that non-existent URL instead of spending time crawling your real pages.
It's tempting to redirect missing pages to other destinations. After all, isn't it better for visitors and search engines to actually find content?
The answer isn't so clear cut.
If you're purposefully retiring old content, then redirecting the page may be the right move:
- Redirecting old products to new, closely-related products
- Merging two short articles into a single, comprehensive article
- Restructuring your blog tags and categories
These examples apply redirects carefully and with purpose!
You should avoid simply redirecting all 404 pages to your homepage (or any other page). This defeats the whole purpose of 404 pages and can cause potential SEO problems.
404 Examples from Around the Web
The best way to understand our recommendations is to see them in action – or not! – as we explore a selection of 404 pages from around the web.
This won't be a list of creative or cool designs. You can find thousands of blog posts online that do exactly that! Instead, we'll provide constructive feedback on what works, and where we see missed opportunities.
We'll award each 404 page with a score of 1-5 in the focus areas discussed earlier.
(The scoring could be based on a highly accurate weighted matrix – or just the author's opinion plus some fancy hands holding numbers. We'll let you decide.)
Let's get started...
Mailchimp
Quirky and supportive, but not very helpful.
Source: https://mailchimp.com
Mailchimp has always leaned on quirky design, and this shows on their 404 page.
Their design features consistent branding, a clear CTA button, and a great choice of typography to make the headline unmissable. The design isn't what I'd call fun, but the animal sticking its head in the hole is quite charming.
When it comes to language, Mailchimp's cutesy writing is perhaps more confusing than helpful. It might be part of Mailchimp's brand voice, but it sacrifices clarity for excessive personality.
"We lost this page"... What does that actually mean for the visitor?
"We searched high and low"... The second line is simply a white lie. There's no advanced searching taking place here.
I'd like to see them suggest possible reasons why the page is missing, and suggest checking for typos in the URL.
Where Mailchimp's navigation really falls down is by promising "a better place to go" and offering only a homepage link. No FAQ, no help section, no featured search field.
Overall, a distinctly average 404 experience.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Evernote
Gorgeously designed, but a navigational dead-end.
Source: https://evernote.com
Someone has put real creative effort into designing Evernote's 404 page. It's a little work of art meant for just a few people to enjoy.
The colors and typography are beautifully on-brand, and it features a clear CTA button.
So why doesn't it deserve a 5 in design? While this is certainly gorgeous, our highest mark is reserved for more than just a stunning background image. Maybe that's unfair on Evernote – let us know in the comments!
The language used is adequate, but I would like to see possible reasons offered: the page may have been moved or deleted, or the visitor might have followed a broken link. Right now, it feels as if the website is broken in general.
This 404 page commits the usual navigation sin of herding visitors to the homepage. It's a lazy solution.
The well-designed footer does come to the rescue here, but the lack of guidance or embedded search form leaves visitors looking at a pretty picture with no real direction.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Zapier
All the right elements, but a split personality.
Source: https://zapier.com
Zapier (rhymes with happier, not rapier) have clearly put some thought into their 404 experience. It's nicely designed and offers great support.
The usual design elements are all accounted for: a headline, text block, button CTA and a cheeky image. It even goes the extra mile with a search form, more cute characters, and a floating help widget.
So why doesn't it score higher?
Despite all the elements being present, it's really 2 distinctly different pages.
Frustrated visitors have to scroll past the huge image to find any real support. The search form is also well hidden; white on white, with light grey text. Everything could be quickly improved by including all elements over the background image.
The tale of two 404 pages continues, with a stark contrast between the language used.
The headline "404", the Obi-Wan Kenobi-like claim "this is not the page you're looking for", and the 'Back to Safety' button are not written with the visitor's needs in mind.
Below this, the tone becomes instantly supportive and helps to guide the lost visitor.
But it's the navigation options that earn our first 5!
In addition to the main navigation and footer, Zapier offers the trifecta of a help section, a direct contact, and a search form.
Overall, this would be a fantastic 404 page if they fixed the split personality.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Spotify
Heavily stylized at the expense of clear communication. Also, hidden links!
Source: https://www.spotify.com
Spotify's 404 page has potential – it comes so close, but misses some important opportunities. It's an easy fix to 4's across the board.
The first design element that jumps out is the image of the record.
It takes up two-thirds of the page and doesn't communicate anything useful. However, it's interesting and related to Spotify's service, even if I can't quite find the connection to a missing page.
The page typography and layout is just fine, with great use of whitespace to avoid overwhelming the visitor.
Let's talk about language and communication.
"404s and heartbreaks" ... I feel like I'm missing a pun here. Some musical knowledge that would make me say "Ah, that makes sense. It's quite clever actually!". Until then, it doesn't make a lick of sense.
However, the rest of the language comes to the rescue. It's friendly, supportive and offers guidance. Good job, Spotify.
Navigation-wise, there are actually 3 options offered:
A 'Go Back' link (using Javascript to emulate the browser back button).
A hidden FAQ link
A hidden Community link
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Help Scout
Clear, helpful and fun.
Source: https://www.helpscout.com
Time for some glowing praise, Help Scout almost scores 5 across the board!
Let's find out how...
Help Scout's designers chose a theme and ran with it, staying aligned with the message and adding some charming fun. Overall, the combined layout, fonts, colors, imagery, headline and link styling create a cohesive 404 experience.
The language is fun, supportive and finds the right balance between personality and helpfulness. However, I'm docking a mark for the claim they "looked all over" (they didn't!) and they could suggest checking the URL for typos.
Finally, they earn a well-deserved 5 for navigation.
Help Scout offers 3 clear and confident options, including links to the blog and help section. I love how the links all start with action verbs: Learn, Search and Read.
They could go the extra mile with an embedded search form, but they still get full marks for offering selected choices without being overwhelming.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Freshdesk
Every opportunity missed. A lesson in what NOT to do.
Source: https://freshdesk.com
Sometimes we need an example of what to avoid. Freshdesk gives us exactly that.
Let's take it one area at a time. First up, design.
In Freshdesk's defence, there is a design – pleasing colors, brand consistency and clean typography. The overall look is charming and friendly.
However... What does an elephant and a boy have to do with a missing page?
It feels like the heading is forcing the theme (a lost jungle land) which leads us to language.
"You've found the secret land of four-oh-four!"
This is an example of quirkiness overtaking clarity. It's completely nonsensical and glib – dismissing the user's confusion and frustration. The visitor expected content, and there is simply nothing to help or orient them.
It's objectively worse than the default 404 page. Ouch!
And finally, navigation.
What should the visitor do next? There is no guidance whatsoever. The only options are to browse the main navigation or footer. There's not even a lazy link to the homepage.
A little more copy, a few links, and a visitor-centric tone would instantly improve this 404 page.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Wistia
Charming and supportive, but is this 404 page someone's pet project?
Source: https://wistia.com
I'm a cat person, but even I love Wistia's destructive doggo and friendly tone!
The design is on point with a clean layout, consistent branding and typography, and a clear CTA button. But the star of the show is Lenny, the charming mutt munching on a VHS tape.
It's vibrant, reassuring and interesting. Great work, Wistia.
The page gets better as we explore its use of language. It's simple and friendly without being patronizing, it immediately outlines the situation, and it offers suggestions on what might have caused the error.
Again, great work, Wistia.
So why did we award just 2 for navigation?
The sole option of learning more about a random dog is absurd. As much as Lenny has charmed me with his cheeky photo, watching his video channel isn't a useful solution for a 404 page.
Sorry Lenny!
Thankfully, the main navigation and footer are available to scrape by another mark.
A link to the homepage, blog and FAQ would immediately bump this up to 4.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Netflix
An example of where limited options fits the business model.
Source: https://www.netflix.com
It's time to flip the script a bit – not all websites need to offer multiple navigation options. Netflix doesn't, and it's absolutely the correct choice. Let's find out why...
But first, give yourself a pat on the back, Netflix. This is one stylish 404 page!
The design is a screenshot of the new Lost in Space show, and a bold headline in the same theme. Aside from the CTA button and a few lines of text, you're invited to drink in the stunning sci-fi landscape.
Unfortunately, Netflix's choice of language could be better. The light-hearted communication – "Sorry, we can't find that page" – is a bit dismissive of the user's situation and the error code – NSES-404 – is meaningless to visitors.
Surprisingly, offering a Homepage navigation link is probably the right call for Netflix.
Netflix isn't a complicated website.
Non-members can find all the information on the homepage. For logged-in members, the homepage transforms into their account dashboard and movie catalog.
We would award a 5 if they offered some shows related to the missing content, and an FAQ link.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Canva
Cutesy gamification, but ultimately a dead-end.
Source: https://www.canva.com
Time for an interesting example. Canva offers a sliding puzzle to transform a negative 404 experience into an unexpected splash of fun.
The design is well-branded with clean typography and oodles of whitespace. Of course, the star of the show is the cute interactive puzzle. For some reason, Canva chose to remove their main navigation, leaving the page feeling a bit sterile.
Unfortunately, it looks like Canva spent more time on the puzzle than the language, which offers no clear explanation beyond "Not found (404) ... the page you are looking for does not exist."
Has the visitor done something wrong? Is the website down? The language would benefit from being more helpful and friendly.
Again, it feels like the charm is at the expense of helpful navigation options. The visitor can only choose between going to the homepage or matching their wits against the puzzle. The lack of guidance and missing main navigation, brings their score to 2.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Now as a highly professional writer, I felt compelled to complete the puzzle. Purely for research purposes, you understand.
Here's the underwhelming reward...
Can I please get my 5 minutes back, Canva?
Dribbble
An interactive, fun way of getting people to the product pages.
Source: https://dribbble.com
A creative and unique 404 page from Dribbble!
By dragging the color slider, the selection of images changes to match. This colorful widget isn't just for show, it serves an important purpose that we'll explore later.
Other elements of the design are well laid out, with effective whitespace and typography. Rather than over-design the page, Dribbble let their unique widget speak for itself.
The language is friendly, but not particularly helpful for lost visitors.
"Whoops, that page is gone" doesn't explain the situation or possible causes. I understand their light-hearted approach, but they could do better.
Let's explore the navigation options offered by Dribbble.
Each of these colorful images links to a designer's portfolio, where you can hire them for graphics work. It's a really clever way to showcase dribble's main service.
Add to that the 'Contact Us' link and the embedded search field for a solid 4. The only things missing are an FAQ or Help section, and some guidance on which to choose.
Design
Branding, layout styles & fun-factor
Language
Clear and supportive communication
Navigation
Helpful guidance and navigation choices
Fact or Fiction? Busting 404 Page Myths
This is turning into a 404 page mega guide!
But grab yourself a coffee, we're not done yet.
Now you know what makes a good 404 page, and what mistakes to avoid. You're nearly at the point where we share our own secret tools for designing the best 404 pages quickly and professionally.
But first, let's explore some truths and common misconceptions about 404 pages.
(It's like MythBusters with less budget and explosions.)
404 pages show up in the search results
Fact or Fiction? Fiction
Google crawls 404 pages, but never shows them in the search results.
If your 404 pages are showing in the search results, there's a big chance they're soft 404 pages, masquerading as real ones.
We understand that [404 pages] shouldn’t be indexed. But we know about those pages. And every now and then when, we have nothing better to do on this website, we’ll go off and double-check on those URLs.
So it’s not something you need to block from crawling.
It’s not something you need to worry about.
- John Mueller, Google -
404 pages are unprofessional and should never be found
Fact or Fiction? It Depends
404 pages are a natural part of an evolving website. You can never fully eliminate them if your website is growing in terms of content and inbound links.
They serve an important purpose, both for visitors and search engines, and they should be allowed to serve that purpose.
However, you should try to minimize them if possible.
Constantly encountering missing pages can only be a negative experience for visitors. They are unlikely to soldier through your website if it happens many times in one session.
Redirecting 404 pages to other pages can concentrate SEO authority
Fact or Fiction? Fact
… with caveats!
Most people know that inbound links play a significant role in SEO.
When another website links to yours, Google views it as a vote of confidence. The more inbound links from credible sources, the better chance your web page has of showing in the search results.
So what about all those links currently pointing to missing pages on your website?
Should you redirect them to conserve or concentrate this SEO authority?
This is a valid strategy, provided it's done mindfully.
Never redirect all 404s to a single page as an automated rule. That's a terrible experience for both visitors and search engines.
However, it's certainly helpful to redirect old blog categories and tags to new ones, or old blog posts that are no longer relevant to your business.
If you're not sure, make the decision on a case-by-case basis.
Too many 404 errors will negatively impact SEO performance
Fact or Fiction? Fiction
The fact that some URLs on your site no longer exist… does not affect how your site’s other URLs… perform in our search results.
If some URLs on your site 404, this fact alone does not hurt you or count against you in Google’s search results.
But also Maybe
Cryptic, I know.
404 pages alone will not negatively impact your SEO, but they may be an indication of a deeper technical problem that might.
For example, a critical WordPress plugin may have automatically updated, or your hosting provider may have changed something overnight.
The freedom to create your own effective 404 page.
It shouldn't come as a surprise that we offer powerful tools to make customizing your 404 page design easier, faster, and even fun.
We created Thrive Theme Builder because we were frustrated with how difficult and time-consuming it was to customize even the simplest parts of a typical WordPress website. Out of the box, Thrive Theme Builder comes with the companion theme Shapeshift which includes a pre-designed 404 page template.
Thrive Theme Builder's pre-designed template library
When building your 404 page, you can choose to either start with Shapeshift's pre-designed template, or you can start from scratch with a blank page.
I started with Shapeshift's 404 and spent just 5 minutes adding navigation options.
Here's the result...
Editing the 404 page was easy.
Thrive Theme Builder comes with a visual page editor that allows you to simply drag-and-drop design elements.
I added a column element, and into each I dropped a text element, button and search element.
Already my 404 page beats many of our earlier examples!
It's still looking a little serious. Let's match my brand colors and switch out the image for something a little more fluffy...
In a little over 8 minutes, I've created a professional 404 page that helps lost visitors discover new content and stay on my website.
I used Thrive Theme Builder's global theme colors to guarantee branding consistency across my whole website. You can see the placeholder 'Call To Action' button in the main navigation has changed color with the heading and buttons.
Thrive Theme Builder single-license & multi-license purchase options now available!
Can you turn a 404 error into a conversion opportunity?
Before we wrap up, let's explore an advanced 404 page strategy that most people never consider.
Is it possible to convert 404 page visitors to leads, subscribers or customers?
The answer is yes!
You can easily add a mailing list opt-in form or call-to-action section, but consider the mindset of anyone who lands on a missing page. They're unlikely to share their details without a compelling offer to sweeten the deal.
Here are some effective lead magnet ideas:
- ebooks
- printables
- audio interviews
- free videos
- mini email courses
Remember that 404 page visitors are lost, confused and frustrated. They didn't get the content they expected, so they don't have much patience for long-winded offers. Consider replacing other navigation options and clearly state the benefits.
This is easy to achieve with Thrive Theme Builder...
In the above example, I've added a link to an opt-in page – you might choose to embed an opt-in form directly into the 404 page with an eye-catching call-to-action box. Feel free to experiment and test!
Ready to improve your 404 page?
Missing pages are a normal part of any growing, successful website. You can minimize them, but visitors will always stumble across a 404 in creative ways.
With this in mind, why not design the best 404 page experience possible?
Let us know your ideas in the comments below!
Good timing – I’m literally just working on revamping my 4040 page with TTB.
When I saw the size of this blog post, I said HOLY SMOKES! You’re not planning to let anybody even try to outrank you for that search term!
They’re welcome to try 🙂 Hope you found it useful, Jonas.
The idea that 404 pages should NEVER be found seems patently absurd. Even if a web designer could ensure that everything ON the site worked perfectly 100% of the time, that doesn’t make all potential visitors or inbound-linkers incapable of mistyping.
Does a “true” 404 page have its own, static URL? I’m wondering because I’m thinking it might not be the best place to have a site-wide popup appear.
Great question!
Yes, they are static URLs, even though they display the same 404 page content.
For example:
site.com/abc123
site.com/xyz123
These will both show the same 404 page content, but they are distinctly different and static URLs.
This means it’s absolutely possible to target individual 404 pages with software like Thrive Leads. It’s possible to show a ribbon or popup on only the first one.
I’ve just tested this and it works.
It’s up to you to decide whether to include a single sidewide offer across all 404 pages (much easier!), or different offers for closely related mispelled URLs (more time, but potentially higher conversion).
Great blog post with a ton of value and detail. I recently purchased the ThriveThemes membership and redoing my entire site using all the tools. I just used the example of making 404 page an opportunity for lead generation. I used the exact model and including a cute picture of one of our dogs and added the lead gen form. Really easy. Thanks for sharing.
You’re very welcome, Mark. It’s great you were able to put this into action so quickly!
Great Article. But doesn’t say how to create/edit 404 page for our website. Where do we get started to replace the default page with a better-looking page? A step by step instruction for this would be great
This depends on how your website is built.
Thrive Theme Builder – Very easy. Choose a starting template and make your changes in the visual editor.
Professional WordPress themes – It depends on your theme. Many offer a special setting to edit your 404 page. This is usually limited to editing the content within your main branded template.
Other WordPress themes – Now we’re getting into coding. Go into WordPress > Appearance > Theme Editor, and look for 404.php in the list of theme files. If you’re not confident with HTML, you’re probably better hiring a designer at this stage.
Non-WordPress sites – There are so many possibilities, it’s impossible to list them here. I recommend asking your designer or web host, who can best advise you.
Hi David, what you find easy I’m sure many will not, or they wouldn’t be asking here. “Thrive Theme Builder – Very easy. Choose a starting template and make your changes in the visual editor.” is unhelpful to me. A, I cannot find a page called 404 (or similar) but one pops up if I deliberately mistype a URL. B, I am a little wary of “Choosing a start template” not understanding if that is necessary if I already have a site built and whether that might alter all the existing pages. So please direct me to full instructions of how to add or build a 404 with Thrive Theme Builder where I already have a Theme. Thank you, Steven
Do you mean you have a different theme and your site is not running on Thrive Theme Builder? In which case you would need to find how to edit the 404 page template for your active theme…
If you are using Thrive Theme Builder (and Shapeshift), you can learn more about the 404 theme template here: https://staging.thrivethemes.com/tkb_item/404-page-templates-in-thrive-theme-builder/
If you are using one of our legacy themes, you have limited options available in the theme options »404 template.
If you are using a 3rd party theme, I suggest looking up their documentation.
Excellent and inspiring article. I have a question: can I edit my 404 page like this in a Thrive theme like MINUS, or is it only if I use the Shapeshift theme and TTB?
In the legacy themes you have some basic editing capabilities available through the theme options https://cl.ly/a1e8d8da2ac3 you’ll be able to add some text and an image.
Thanks Hanne. I think I’ll switch to Shapeshifter anyways. It’s so nice, at least when starting from scratch, I built a new website with it and it’s lovely to work with. But it might be a little more tricky to switch to Shapeshifter for a website full of content and online courses. I will follow the tutorial for this.
But it doesn’t work!
I went there. Look https://sugarsbeach.com/ffffffffffff
See how it still has the default 404?
Underneath is what I added.
How do I get rid of default?
I assumed once I added new content, and saved, the old wouldn’t be there anymore. But that’s not the case.
I enjoy reading your blog. It’s full of useful tips and tricks and this time is 404 pages, something I never put much thought in to. No more redirect all to homepage anymore for me.
p.s.
thrive themes mastered page building, then frontend theme building. why stop there, add an admin theme builder to fully customised WP.
Anyway keep up the awesome work. ????
Thanks Bonnie, we have more awesomeness coming (but wp admin personnalisation is not one of them)
Thanks David, for sharing this amazing and valuable post. Love to share your Post
Is it possible to design your 404 page with Thrive Architect?
Of course! 😀
If you’re using a legacy Thrive Theme, there’s a 404 template page you can customize…
If you’re using a different (non-Thrive) theme, but you have Architect, just start with a blank Thrive landing page and follow along with the recommendations in this article…
I have the Thrive Membership and (before Theme Builder was released) I still opted for the 2nd option above, as I wanted to use Architect elements on my 404 page, such as search & a custom “post list” of recommended articles…
Hope this helps! 🙂
I’ve never met a 404 template, where can I find it? And where can I find the 404 page to optimize? I don’t understand this.
It depends completely on the theme you are using… All Thrive themes (before Theme Builder) included a 404 theme template…
Many non-Thrive themes also include one as well…
As Hanne suggested, you’ll need to refer to your theme’s documentation for specifics.
Can somebody help me with this?
Have you contacted Thrive Support?
Hi Karen,
Thanks for chiming in! Unfotunately, most themes do not make it easy to add 404 pages as this is not a static page. So unless people are using a legacy Thrive Theme or of course the new Thrive Theme Builder, they wouldn’t be capable of changing the 404 with Thrive Architect 🙂
Yes, you know I’m such a Thrive fan…and for good reason!
I apologize for my rather curt answer! :-{
I’m usually not so abrupt and I try to be helpful! I’ve posted some possible tips below to @Gabi…
Hi Gabriella,
As you can see Karen is very used to the Thrive Themes tools and the easy of editing everything 😉
Unfortunately it’s not that easy if you are not using our tools.
Most themes do not allow you to edit your 404 page.
I would suggest asking your theme provider how to do this (as I’m assuming you are not using Thrive Theme Builder from your questions.)
Yes, Hanne that’s exactly right! And, that’s why I have a Thrive Membership! 😉
@Gabi… I’m sorry if I misunderstood where you are starting from… Perhaps this will help:
Most themes — except free ones — have some type of support or documentation; you can probably find it by searching… I’ve found it useful to use both your theme name and your problem (“custom 404 page” in this case), and someone may have posted a solution.
Even some free themes have a way to contact the theme author directly…not many, but it may be possible…
Good luck!
I’m used to Thrive tools, but not Thrive Theme builder. Hence my question.
“Never redirect all 404s to a single page as an automated rule. That’s a terrible experience for both visitors and search engines.”
I don’t see how it’s a “terrible experience” for visitors !
A free plugin can make a 301 redirection to a specified page and send you email notification on 404 errors, so you can fix the issue quickly.
I use this one for the past few months : [link removed]
No more 404 errors for my visitors.
Hope that helps.
Hi Sebastien.
I respect being challenged on this point, but I’d encourage you to believe Google directly when they say…
“So the the 301 redirect from all pages to the home page, that would be something that we see as a soft 404s.”
John Mueller, Google 2016
https://www.seroundtable.com/301-pages-home-soft-404-22811.html
“It’s not a great practice (confuses users), and we mostly treat them as 404s anyway (they’re soft-404s)”
John Mueller, Google 2019
https://twitter.com/JohnMu/status/1082565162597605377?ref_src=twsrc%5Etfw
(I’ve removed the link you shared to the plugin, because it was confirmed as inserting cloaked links by the author and is now abandoned.)