Skip to main content

Customize 403 page using HTML

Coming Soon

This feature is under development and will be coming soon!

Introduction

When users try to access a dashboard or dataset they don't have permission to view, they normally see a generic "403 Forbidden" error page. This leaves users confused about what went wrong and what they should do next.

With Holistics' custom 403 page feature, you can create a personalized error page that:

  • Explains what happened in clear terms
  • Tells users exactly what to do next
  • Provides helpful contact information or links

How to Set It Up

  1. Go to Organization Settings
  2. Select Custom 403 Page
  3. Add your HTML code in the text box
  4. Save your changes

That's it! Your custom 403 page will now appear whenever users encounter access restrictions.

What You Can and Cannot Use

✅ What's Allowed

HTML Elements

  • All standard HTML5 elements and attributes
  • Inline CSS styling (using style="")
  • Internal CSS (using <style> blocks)
  • Navigation links (with special requirements - see below)

❌ What's Not Allowed

JavaScript

  • No <script> tags
  • No JavaScript event handlers (onclick, onload, etc.)
  • No JavaScript-dependent features

Forms

  • No <form>, <input>, <textarea>, <select>, or <button> elements
  • No form submissions or interactive controls

External Resources

  • No external CSS files or libraries
  • No imported stylesheets from other sources
  • Everything must be self-contained in your HTML

Dynamic Content Variables

You can use these variables in your HTML, and they'll automatically show the correct information for each user:

User Information

  • {{ USER_NAME }} - The user's display name
  • {{ USER_EMAIL }} - The user's email address

Page Information

  • {{ CURRENT_PATH }} - The page path that caused the 403 error
  • {{ CURRENT_URL }} - The complete URL the user tried to access
  • {{ CURRENT_HOST }} - Your website's domain name

Organization Information

  • {{ TENANT_NAME }} - Your organization's name

Example Usage

<div style="font-family: Arial, sans-serif; padding: 20px; text-align: center;">
<h1>Access Restricted</h1>
<p>Hi {{ USER_NAME }}, you don't have permission to access this page.</p>
<p>You tried to visit: {{ CURRENT_PATH }}</p>
<p>If you need access, please contact your administrator.</p>
</div>

You can include helpful links in your custom 403 page, but they must follow this format:

Required Format

All links must include target="_top" to work properly.

Examples

<!-- Good: Links with target="_top" -->
<a href="/dashboard" target="_top">Go to Dashboard</a>
<a href="/help" target="_top">Get Help</a>
<a href="/contact" target="_top">Contact Support</a>
<a href="https://example.com" target="_top">External Link</a>

<!-- Bad: Links without target="_top" won't work -->
<a href="/dashboard">Go to Dashboard</a>

Let us know what you think about this document :)