404 page template

The 404 template is a crucial component of your online store that helps manage user experience when visitors encounter broken or missing pages. It’s designed to:

Maintain professional brand presence even when errors occur
Guide visitors back to working pages
Reduce bounce rates from broken links
Enhance user experience during navigation errors
Support SEO best practices for error handling

Full page 404 template

How to Access 404 Template

Access the 404 template from the top center bar in your Admin Dashboard. Once selected, you can customize its appearance and functionality through the available settings.

How To Configure 404 Template

To begin customizing, navigate to the 404 page settings in your theme editor.

General settings

Setting	Description
Color scheme	Applying a chosen color scheme to 404 template from a suggested list of color schemes automatically updates all associated colors for a cohesive look across your website.
Custom content	In this field, you can write a custom message that will be displayed when a user tries to access a page that doesn't exist or has been moved. This content is meant to guide users back to relevant areas of the site and help them navigate to the correct information. You can provide links to the homepage, product pages, or other helpful sections like FAQs or search, ensuring a smooth user experience even when encountering an error.
Text size	Choose the font size for text: Small Medium Large
Button style	Choose the button’s appearance: Solid: A fully filled button. Outline: A button with a border and no fill. Inline: A minimal button style aligned with the text.
Image	This field allows you to upload or select an image to be displayed on your page.
Image width	Set the width of the image for desktop and tablet views. This controls how wide the image will appear across larger screen sizes, ensuring it fits well within the layout.
Image width mobile	Set the width of the image for mobile devices. This ensures that the image is appropriately sized for smaller screens, providing an optimal viewing experience on smartphones.
Cover footer background	Enable this option to merge the 404 page with the footer, giving the 404 error page the same background as the footer. This creates a seamless transition between the 404 content and the footer.

Section padding

Setting	Description
Top padding	The 'Top padding' setting allows you to adjust the amount of space at the top of the section using a slider.
Bottom padding	The 'Bottom padding' setting functions similarly to the “Section top padding” setting, but controls the space at the bottom of the section.
Top padding mobile	The 'Top padding mobile' setting allows you to adjust the amount of space at the top of the section specifically for mobile devices, using a slider.
Bottom padding mobile	The 'Bottom padding mobile' setting works similarly to the'Top padding mobile' setting but controls the space at the bottom of the section for mobile devices.