Overview
As an online shopper, sometimes we end up on webpage that doesn't have any available products within it. This could happen when someone clicks on an outdated link, or simply due to fluctuating inventory levels.
The last thing you want is for that shopper to hit an error page, think you don't have what they're looking for, and decide to shop elsewhere. With Treez Ecommerce, when a shopper clicks on a category, product type, brand, or strain that doesn't have any in-stock products associated with it, they will be shown the Out of Stock page.
By default, the Out of Stock page displays an out of stock message, along with links to go back to the previous page the shopper was looking at and to go to the site homepage.
But the best part? The Out of Stock page is fully customizable! This means that you can add in additional shopping elements, like product carousels, that put alternative products in front of the customer without them having to even click. You can even set up individual Out of Stock pages for each category.
How to Customize the Default Out of Stock Page
Navigate to your Treez Ecommerce CMS, Prismic, and login.
Find and open the Default Product Listings Page (aka Default Category Page) editor.
Click into the Page Not Found tab.
Note the fields in the editor will all be blank. This indicates you are still using the default design.
To override the default and customize this page, fill out all the empty fields. You can also upload a replacement image if desired.
Optional: Customize the page further by adding additional slices, such as product carousels.
When you're finished customizing the page, click Save and then Publish in the upper right corner.
Voila! You've published your customized Out of Stock page! Navigate to a made up category page (e.g. [your URL]/collection/fake) to see how it looks like.
Here is an example of a customized Out of Stock page with a product carousel for Recommended Products, which could be configured using custom product groups:
Customizing the Out of Stock Page for Specific Categories
Follow the instructions above, and adjust step #2 to edit your desired category page instead of the default product listing page.
Tip: Filter your page list in Prismic by Type: Category to see all available category pages.