# How to create and edit windows

> Windows  also known as modals overlays or popups  are a great way to add extra  layers  of information to your Genially content   A window is an interacti

Source: https://help.genially.com/en_us/how-to-create-and-edit-windows-SkEpA0QUn

Last updated: 2026-05-12T11:52:43.878Z

Windows — also known as modals, overlays, or pop-ups — are a great way to add extra **layers** of information to your Genially content. 

A window is an interactive box that opens when users click on a  [trigger element](https://help.genially.com/en_us/how-to-trigger-interactions-on-hover-and-click-ry46CpKcg) (like a button or icon). 

  

Use windows to:

*   Provide extra content on demand
*   Break down information into bite-size chunks
*   Embed rich media like videos
*   Provide learners with additional activities

and more! 

  

Windows can include most of the same types of content and features as a full Genially page or slide. That means images, interactions, animations, audio, video, [interactive questions](https://help.genially.com/en_us/interactive-questions-on-genially-H1_tCj1en) and more. You can even embed another Genially creation inside a window!

  

## How to create a window

The window will open when the user clicks on an **element**. This can be a visible element (like an image, button, icon, or text box) or an invisible [interactive area.](https://help.genially.com/en_us/interactive-areas-add-interactivity-to-any-part-of-your-creation-Hy3O9DBhj)

Before designing the content of the window, decide which element you want to trigger the window to open. 

1.  Open the Genially editor.
2.  Select an element on the canvas. This is the element that will trigger the window to open when clicked.
3.  Click on the interactivity icon.  
    ![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/c5793cd30a1726b1b8fda9089d21262a.png)
4.  In the Interactivity sidebar, select **Open window.**
5.  Select the window you want to use. 

  

### Blank Window

Got a clear idea of how you want the window to look? Start with a **Blank Window** and customize every detail. 

  

### Reuse a window from the same creation

If you’re using a Genially template that includes windows, or you’ve already added windows to the design, you can use the same window again. Save time and make sure your windows are consistent.

You’ll find these windows in **From this creation:**

![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/7c53f7aab13765f9cc87a98b723a5a40.png)

  

### Prebuilt layouts

In **More windows** you’ll find a selection of pre-built windows. Easy to edit and customize, these templates help you place content within the frame.

![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/28d6ac2c3ff20c64917855b30cb8529a.png)

  

6\. When you’ve found a window design you like, select **Use window.**

7\. The window opens in edit mode. If you’re using a prebuilt layout, replace the placeholder content with your own text and images. 

8\. When you’re finished, select **Done editing**. You can return to edit the window content at any time.

  

## How to edit the contents of the window

1.  Select the interactive element. The interactivity button displays which interactions you’ve applied to that element.
2.  Click on **Window** to edit the window.  
    ![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/b1e797beddbaa5cc608bc7f28e0d4455.png)
3.  Edit the content and click **Done editing** when you’ve finished.

  

## How to remove a window

#### **Option 1:** From Edit Window

1.  Select the interactive element that triggers the window. 
2.  Click on **Window** to edit the window.
3.  Select **Delete**. This will remove the window from the element.

![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/d53969bf839e15b9bd6d01e90beacd55.png)

  

#### Option 2: From the Interactivity sidebar

1.  Select the interactive element that triggers the window.
2.   Click on the Interactivity (hand) icon to open the Interactivity sidebar.
3.   Move your cursor over Open Window and select the trash icon.

![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/e4b45782e9094bb2df119b20c7c4ef00.png)

  

Note that deleting the trigger element from the canvas will also delete any interactions you’ve added to the element, including windows.

  

## How to combine windows with other interactions 

Want to play sound effects when the window opens? No problem. You can trigger multiple actions from the same element. 

To add another interaction to an element with a window:

1.  Select the interactive element. 
2.  Click on the **Interactivity** (hand) icon.  
    ![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/cccb37958acfcdff067e7a6958c43fce.png)
3.  Select another action from the list of compatible options.

![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/bbf19d9e467a4cc5ae284ec30c20ec5c.png)

  

## See how many clicks the window has received

Use [Activity](https://help.genially.com/en_us/how-to-get-a-metrics-overview-on-your-geniallys-r1WhswHno) to get live engagement data on your content, including windows. Note that this is a Premium feature.

To see how your audience is engaging with specific elements, like windows, make sure to name the interactive elements in [Designer mode](https://help.genially.com/en_us/designer-mode-in-genially-HkxvowBho).

  

### How to activate Designer mode

1\. Go to the **genially options menu** (☰) in the top left corner of the editor.

2\. Go to **Show > Designer** mode and turn the switch on. 

3\. In **Layers**, rename elements on the page. 

Descriptive names help you identify elements when analyzing your data. If you want to see how many people click on a button to open a window, label the button accordingly:   ![](https://cdn.prod2.kustomerhostedcontent.com/media/63302dcd394e719f98c84c4c/22f1bf8f9418650e1e6c758677bece48.png)

  

To get engagement data on interactive elements inside the window, make sure to rename elements **inside the window.**

  

## How to rename interactive elements inside a window:

1.  Select the interactive element.
2.  Click on **Window** to edit the window.
3.  Open Designer mode while the window is open in edit mode. 
4.  In **Layers**, rename interactive elements in the window. 

Learn more about [Activity data.](https://help.genially.com/en_us/how-to-get-a-metrics-overview-on-your-geniallys-r1WhswHno)

  

## Frequently asked questions

#### How can I save a window as a template to use it again?

When you create a window (from scratch, or using a prebuilt layout) it’s saved **automatically**. When you add another window to the same genially, all existing windows appear in the tab **From this creation.** 

  

#### Can I add a window to an element inside a window?

No. Stacking windows on top of each other causes usability and navigation issues, so this option is not available. If you want to label content inside the window, use a [tooltip](https://help.genially.com/en_us/how-to-set-up-tooltip-interactivity-in-genially-HJcYcPBhj). If you’ve got a larger amount of content, we recommend creating using a separate slide or window. 

  

#### Can I trigger a window to open on hover?

No. For accessibility reasons, windows are not compatible with a hover trigger. If you want to reveal auxiliary information on hover, try using a [tooltip](https://help.genially.com/en_us/how-to-set-up-tooltip-interactivity-in-genially-HJcYcPBhj) or [reveal](https://help.genially.com/en_us/how-to-set-up-reveal-interactivity-in-genially-B1LqcwHhi) on hover. 

[Learn more about triggers.](https://help.genially.com/en_us/how-to-trigger-interactions-on-hover-and-click-ry46CpKcg)
