How can we create custom error pages in AEM?

• For creating the custom error pages in our project we can use the acs commons utility to handle error pages.
• For this, you need to upload the ACS commons package in the crx.
• After that, you need to overlay the sling folder present in the libs folder as shown below. We only need to overlay the required files.
  
  

• You need to update default.jsp and 404.jsp with the text shown below.
  
  Add this in 404.jsp.

<%@page session=”false”%><%

%><%@include file=”/apps/acs-commons/components/utilities/errorpagehandler/404.jsp” %>

Add this in default.jsp

<%@page session=”false”%><%

%><%@include file=”/apps/acs-commons/components/utilities/errorpagehandler/default.jsp” %>

• Create the tab with the path browser field in it in the page component present in your project.
  First, you need to add a path browser field in page properties. To add those you can edit the dialog of the page component as shown below.
  
  

Note:- The name of the path browser field should be ./errorPages.

At my end, I have created that field inside a different tab i.e. Error Handling

• Then create the error pages under the specific hierarchy as shown in the image. You have to create the error pages with their name only. Ex:- if you want to show 404 then its corresponding page will be 404.
  Note:- Name of the page should be the error value but its title can be different.
  

• Then configure the path to the error page in the pathfield as shown below.
  

• Then the error pages with corresponding errors will appear when the user will hit any page that does not exist.