Is that any easy way to modify the 404 error page for volto / Plone 6?

mactrash · May 20, 2025, 10:06pm

I mean the page show

This page does not seem to exist…

We apologize for the inconvenience, but the page you were trying to access is not at this address. You can use the links below to help you find what you are looking for.

If you are certain you have the correct web address but are encountering an error, please contact the Site Administration.

Thank you.

erral · May 21, 2025, 6:43am

Volto has a NotFound component registered in the routes.js file:

github.com/plone/volto

packages/volto/src/routes.js

18.x.x


      
          {
            path: '*',
            component: NotFound,
          },

Have you tried overriding/shadowing it?

github.com/plone/volto

packages/volto/src/components/theme/NotFound/NotFound.jsx

18.x.x

import { useEffect } from 'react';
import BodyClass from '@plone/volto/helpers/BodyClass/BodyClass';
import { FormattedMessage } from 'react-intl';
import { Link } from 'react-router-dom';
import { Container } from 'semantic-ui-react';
import {
  toBackendLang,
  withServerErrorCode,
} from '@plone/volto/helpers/Utils/Utils';
import { useDispatch, useSelector } from 'react-redux';
import { getNavigation } from '@plone/volto/actions/navigation/navigation';
import config from '@plone/volto/registry';

/**
 * Not found function.
 * @function NotFound
 * @returns {string} Markup of the not found page.
 */
const NotFound = () => {
  const dispatch = useDispatch();

This file has been truncated. show original

polyester · July 24, 2025, 10:07am

It's indeed easy to shadow it, but it is not obvious how to make it 'pick up' a theme. For instance when using Volto-Light-Theme, the NotFound.jsx will display the standard Plone logo, and ignore the extra header/footer/css/logo as defined by VLT.