How to Improve 404 Pages and Zero-Result Search Pages on Shopify
グロースノウハウ

How to Improve 404 Pages and Zero-Result Search Pages on Shopify

404 pages and zero-result search pages are often overlooked, and when building a Shopify store, it's common to see stores still using the default theme settings for these pages.

In this article, we'll explain why improving your 404 page and zero-result pages matters, and how to do it on Shopify.

Download the Store Design Guide for High-Converting Stores (Free)

StoreHero leverages its proprietary growth platform to support business growth through fine-tuned operations and large-scale execution of initiatives that would be impossible with manual management alone.
If you're struggling to increase sales on Shopify, feel free to reach out. =>Download our free service introduction materials here

Why You Should Improve 404 Pages and Zero-Result Pages

Why do 404 pages and zero-result search pages need to be improved?

In reality, 404 errors and zero-result searches occur far more often than you might think, and they can quietly eat into your revenue.

404 Pages

If you check Google Search Console, you may find a surprisingly large number of 404 errors occurring.


Most 404 errors are not critical issues. However, if the landing page for external traffic is a 404, it can become a fatal cause of lost sales.

Imagine another website recommends your product and links to it, and a visitor clicks through — only to find the product has been discontinued or the URL has changed due to operational reasons, resulting in a 404. In nearly 100% of cases, that visitor will immediately bounce.

Visitors who arrive via a recommendation have high purchase intent, so losing them is an enormous waste.

Zero-Result Search Pages

As analysis in Google Analytics shows, customers who use on-site search generally have higher conversion rates.

※ To investigate zero-result search keywords in Google Analytics, you'll need to configure Google Tag Manager. If there's enough interest, we'll cover that in a separate article.


Showing a cold, unhelpful zero-result page to these highly motivated shoppers is a significant missed opportunity.

Examples of 404 Page and Zero-Result Page Improvements

So how should you improve your 404 page and zero-result pages?

Below are some representative improvement approaches. Consider which ones best fit your store.

Collection List

A safe and straightforward approach is to display a list of collections when a 404 or zero-result page appears. By showing a broad range of product categories, you can prevent visitors from leaving the site.

Women's apparel brand MISSGUIDED displays a collection list on their 404 page to encourage further browsing.


On Shopify, this is easy to implement by reusing existing collection list sections or snippets from your theme.

Popular Products / Recommended Products

Another common approach is to display popular or recommended products. If a collection list isn't enough to prevent bounces, try switching to popular products.

A good approach is to create a dedicated collection for popular or recommended products, then display that collection on your 404 and zero-result pages.

Men's apparel brand BONOBOS features product recommendations on their zero-result page — likely their top-selling items.


Ideally, you'd use Google Analytics or Hotjar to track which products are being clicked, and periodically refresh the product list (see: 5 Ways to Improve Your Shopify Product Pages with Hotjar).

On-Site Search

Another option is to display an on-site search bar. Including links to commonly searched keywords can make it easier for visitors to find what they're looking for.

You can also combine on-site search with a collection list or product recommendations.

D2C cosmetics brand Glossier pairs popular product recommendations with trending search keyword suggestions on their zero-result page to keep visitors engaged.


Fun and Creative Design

Some stores use their 404 and zero-result pages as an opportunity to express their brand identity. There are even pages that manage to make visitors smile despite landing on a dead end.

For example, LEGO's 404 page is well known for being a delightfully fun experience. The creative is updated from time to time, giving fans a reason to check back.


Similarly, Koala Mattress's 404 page features an adorably sleeping koala that brings a smile to your face.


While a 404 page typically frustrates visitors, LEGO and Koala Mattress have turned theirs into pages that fans actually feel lucky to stumble upon.

How to Implement on Shopify

Here's how to actually implement improvements to your 404 page and zero-result search page on Shopify.

Some of these can be done even without coding skills, so feel free to use this as a reference for your improvements.

404 Page

The 404 page is implemented through a file called 404.liquid.

By default, most themes display a very bare-bones 404 page, so go ahead and add a collection list, recommended products, or other content to your 404.liquid file.


For example, to display the collection list section (list-collections-template.liquid) on your 404 page, simply insert {% section 'list-collections-template' %} at the desired location in the file.

If you want more advanced functionality or design, you'll need to involve someone with coding skills — but even this basic implementation is far better than nothing.

Zero-Result Search Page

The zero-result search page is improved by editing the search.liquid file located in the Templates folder.


Code your search.liquid file as shown below. When zero results are returned, it's a good idea to insert a collection list or recommended products — just like on your 404 page.

{% if search.results == empty %}

Content to display when zero results are returned

{% else %}

Content to display when one or more results are returned

{% endif %}


This is how you can implement improvements to both your 404 page and zero-result search page.

Driving Growth with StoreHero

StoreHero supports merchants who want to increase sales on Shopify by executing growth initiatives with consistency and thoroughness.

From store setup through to advertising, store optimization, CRM, and inventory management, we deliver a unified set of initiatives powered by our growth platform, StoreHero — enabling the kind of fine-tuned operations and large-scale execution that simply isn't possible through manual management alone.

We're currently offering free store diagnostics. If you have challenges with building a growth-oriented store or executing growth initiatives, please reach out. Learn more about our free store diagnostic here

Summary

We've covered how to improve 404 pages and zero-result search pages on Shopify.

It might seem like a niche concern, but if you've been running your store for a while, 404 errors and zero-result searches happen more often than you'd expect. If left as-is, you risk losing shoppers who are highly motivated to buy — so it's definitely worth fixing.

Beyond just 404 and zero-result pages, continuously refining your store after launch is what drives sustained sales growth. Start by improving whatever feels most frustrating or unintuitive to your customers.

StoreHero can support you from the ground up, starting with the design of a high-converting store. Don't hesitate to reach out. =>View StoreHero's service introduction materials