# overlay\_open

Source: https://zotonic.com/docs/1616/overlay_open

URI: https://zotonic.com/id/1616

Language: en



Renders a template on the server and opens a full screen overlay with the HTML output of the template.

Example:

```django
{% button text="show story" action={overlay_open template="_story.tpl" id=1234} %}
```

This opens an overlay over the current content. The template `_story.tpl` will be rendered with the argument `id` (and possibly any other arguments). The rendered html will then be shown inside the overlay.

The overlay template is a `div` with the class `modal-overlay`. Extra classes can be added using the `class` argument:

```django
{% wire action={overlay_open template="_splash.tpl" class="splash"} %}
```

The overlay action has the following arguments:

| Argument | Description                                                                      | Example                   |
| -------- | -------------------------------------------------------------------------------- | ------------------------- |
| template | Template to render in the overlay                                                | `template="_overlay.tpl"` |
| class    | Extra CSS class(es) to add to the overlay diff.                                  | `class="myclass other"`   |
| level    | Nesting of the overlay. Non negative integer, higher numbered levels are displayed above lower levels. Special level `"top"` to force display on top, above all dialogs and other overlays. | `level="top"`             |

All (extra) arguments are passed to the rendered template.

License: 

Attribution: 

Related resources: https://zotonic.com/api/agent/related/1616?language=en


## API access

- [API help](<https://zotonic.com/api-help>)
- [OpenAPI specification](<https://zotonic.com/openapi.json>)
- [This resource as JSON](<https://zotonic.com/api/agent/resource/1616?language=en>)
