---
title: "Adding an Overlay"
slug: "add-an-overlay-to-templates"
description: "Covers Add an Overlay for on-page templates, including how to enable it, customize its color and opacity, and add its own Close on Click action setup."
tags: ["close on click", "overlay design", "template settings", "web template"]
updated: 2026-08-06T06:31:12Z
published: 2026-08-06T06:31:12Z
canonical: "academy.insiderone.com/add-an-overlay-to-templates"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://academy.insiderone.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Add an Overlay

You can add an overlay to your on-page templates while [designing](https://academy.insiderone.com/docs/design-a-web-template) to make them more visually prominent and draw user attention.

> [!NOTE]
> Overlays are only supported for on-page templates.

![](https://cdn.document360.io/c6df4583-da94-4cb2-bb8a-be0cbdd11109/Images/Documentation/ol.gif)

Here’s what you can do with overlays:

- Enable or disable the overlay using the **Add/Remove** button in the sidebar settings (when available).
- Customize the overlay’s **color and opacity** to match your design.
- Add a **Close on Click** action so that clicking the overlay also closes the template.

This feature enhances visibility while providing users with an intuitive way to dismiss the message.