3 Easy Steps for Sitecore Multisite Custom 500 Error Pages

Ever want custom 500 error pages but struggle as you have a multisite solution? Here are 3 steps for creating Sitecore multisite custom 500 error pages.

Step 1: Create Custom 500 HTML Pages and Place in wwwroot

Step 1 is to create the custom 500 html error pages you want and to place them, and any corresponding CSS/font files, in a directory in your wwwroot called “errors”. The naming of the files is critical for our third step as we need to have part of the domain name we are matching against in the filename.

Step 2: Listen for Errors and Return Custom Friendly Errors

In Step 2, you want to listen for the custom errors based on the “RemoteOnly” option for custom error messages in the web.config . In my case, I have CloudFlare watching for 502, 504 and 52x errors, so I am only capturing and redirecting the 500, 501, 503, and 505 errors to “error.html”… and because we will be listening for error.html in Step 3, you don’t need to actually create an error.html file in your wwwroot.

    <!--  CUSTOM ERROR MESSAGES
          Set customError mode values to control the display of user-friendly
          error messages to users instead of error details (including a stack trace):

          "On" Always display custom (friendly) messages
          "Off" Always display detailed ASP.NET error information.
          "RemoteOnly" Display custom (friendly) messages only to users not running
          on the local Web server. This setting is recommended for security purposes, so
          that you do not display application detail information to remote clients.
    -->
    <!--<customErrors mode="RemoteOnly" />-->
    <customErrors mode="RemoteOnly">
    <error redirect="/error.html" statusCode="500" />
    <error redirect="/error.html" statusCode="501" />
    <error redirect="/error.html" statusCode="503" />
    <error redirect="/error.html" statusCode="505" />
    </customErrors>

Step 3: Redirect to Your Custom 500 Error Page

Now that we have our custom 500 error pages created, and logic to check for the desired 500 error type, Step 3 is to use the following Rewrite rule to return users to the desired error page per brand site when a 500 error is triggered and redirects to error.html.

Note that we are looking for a URL that contains the domain name of brandsiteone, brandsitetwo, etc. and our actual 500.html pages match the name being passed in (ex. brandsiteone500.html) so we don’t have to create multiple rewrite rules per brand.

	<!-- Redirect to custom error page on 500, 501, 503, and 505 responses -->
        <rule name="CustomApplicationErrorPage" patternSyntax="ECMAScript">
            <match url="(error.html)" />
            <action type="Rewrite" url="/errors/{C:0}500.html" appendQueryString="false" />
            <conditions logicalGrouping="MatchAny">
                <add input="{HTTP_HOST}" pattern="(brandsiteone)" />
                <add input="{HTTP_HOST}" pattern="(brandsitetwo)" />
                <add input="{HTTP_HOST}" pattern="(brandsitethree)" />
            </conditions>
        </rule>

Thanks to @balloway for the clever handling per this Sitecore Stack Exchange post: configuration – Handling 500 errors in sitecore multi site multi language environment – Sitecore Stack Exchange

With this in place, you should now be able to serve up custom 500 error pages per brand, like this one for Brand Site One. Enjoy! If you need Custom 404 Error pages follow this post: Sitecore 10 Multisite Content Managed Custom 404 Error Pages