Articles on: The editor

Using scenes

A scene is a section of a page in the editor. Every page is built from one or more scenes, stacked vertically, and each scene has its own size, type and safe zone. You manage the scenes of a page in the Scenes panel, which opens with the Scenes button in the left rail of the editor.



Adding a scene


To add a scene to the page you're editing:


  1. In the editor, click Scenes in the left rail. The Scenes panel opens and lists every scene in the page.
  2. Click New scene.


Managing scenes in the Scenes panel


Each scene has its own row in the Scenes panel, which opens with the Scenes button in the left rail of the editor. From a scene's row you can:


  • Open: click the scene's thumbnail to show that scene on the canvas. The Scenes panel closes.
  • Rename: click the scene's name field and type a new name.
  • Duplicate: click the Duplicate scene button.
  • Reorder: drag the row to a new position in the list.
  • Delete: click the Delete scene button, then click Delete to confirm. A page always keeps at least one scene, so the last one can't be deleted.
  • Restart animations: click the Restart animations button to turn it on for that scene. The button is highlighted while it's on. The scene's animations then play again from the start each time a viewer returns to the scene. It's off by default; click the button again to turn it off.


Most of these actions are also on the canvas. Above each scene is a label with the scene's name and type. Click the name to rename the scene, or click the arrow in front of the name to open a menu with Duplicate, Move up, Move down, Delete and Edit scene settings.


Opening a scene's settings


Each scene has its own settings, separate from the other scenes in the page. The settings that open are those of the active scene, the scene you last clicked on the canvas. To open them:


  1. Click the scene on the canvas to make it the active scene.
  2. Click Scenes in the left rail.
  3. Under Active scene, click Edit type & size.


The General tab of the right panel opens with that scene's settings. You can also open it from the canvas: above the active scene, click the arrow in front of the scene's name, then click Edit scene settings. The main per-scene settings are:


  • Scene type: Fullscreen or Longpage.
  • Scene size: the width and height of the scene.
  • Safe zone: the size and color of the scene's safe zone. Read more in Responsive safe zone (bleed).
  • Canvas grid and Guidelines: layout aids for placing elements in the editor.
  • Autoplay scene: moves viewers to the next scene automatically after the time you set in Next scene after. It isn't available for a sticky scene, or when the page has only one regular scene (for example one scene, or a sticky first scene plus one other).


Choosing the scene behaviour


Scene behaviour sets how viewers move from one scene to the next on a published page. It applies to all scenes in the page. On mobile, scenes always show as a regular scrollpage, whatever you choose here.


  1. Click Scenes in the left rail.
  2. Under Scene behaviour, click the current option and choose one of the three behaviours below.
  3. If you chose Transition effect, pick an animation in the Effect dropdown.


The three behaviours are:


  • Standard scrollpage: all scenes are combined into one regular page that viewers scroll through. With two or more scenes, you can turn on Snap to scene, which locks the view to the next scene while scrolling.
  • Transition effect: viewers go vertically from scene to scene with an animated transition, such as Scroll, Scale down, Cross fade or Cube. With two or more scenes, you can turn on Activate mouse scroll and Stop at last scene.
  • Direct transition: viewers jump straight to a scene without any animation. This suits buttons that switch instantly between scenes, such as tabs or a menu. Mouse scroll is always off. With two or more scenes, you can turn on Stop at last scene.


With any of the three behaviours, a page with two or more scenes also has the option First scene sticky on top.


Stop at last scene makes the final scene the end of the page: moving on from the last scene does nothing. Without it, scenes loop: moving on from the last scene takes viewers back to the first, and going back from the first scene takes them to the last.


Navigating scenes with the mouse scroll


Activate mouse scroll lets viewers on desktop move to the next or previous scene with the scroll wheel. The checkbox is in the Scenes panel under Scene behaviour, and it only appears when:


  • Scene behaviour is set to Transition effect,
  • the page has two or more scenes, and
  • the Effect is not None (direct).


When mouse scroll is off, viewers move between scenes through links on elements, or automatically if a scene uses Autoplay scene.


Linking an element to a scene


You can link an element to another scene in the same page, so viewers go there when they click it:


  1. Select the element on the canvas.
  2. In the right panel, open the Links tab (link icon).
  3. Under On click, choose Go to scene.
  4. Choose Previous, Next or the scene to go to.


The list shows every other scene in the page. When you pick a named scene (not Previous or Next), Show hover state while scene is active is on by default: while the linked scene is on screen, the element shows its hover effects. Untick it to show them only on hover. This works on desktop only.


Making the first scene sticky


A sticky scene stays on top of all other scenes in the page, which is useful for a menu or for next and previous buttons that should stay visible. Only the first scene in the page can be sticky.


  1. Click Scenes in the left rail.
  2. Drag the scene you want to keep on top to the first position in the list.
  3. Under Scene behaviour, tick First scene sticky on top.
  4. (Optional) Give the sticky scene a transparent background, so the scenes underneath show through.


The checkbox only appears when the page has two or more scenes. A Go to scene link can't take viewers to the sticky scene: the published page ignores that link.


Scenes on mobile


On mobile, the scenes of a page always show as a regular scrollpage, one scene below the other. Scene behaviour, transition effects and mouse scroll only apply on desktop.


Frequently asked questions


Why don't my scene transitions show on mobile?


On mobile, scenes always show as a regular scrollpage, one scene below the other. The Scene behaviour you choose in the Scenes panel, including any transition effect, only applies on desktop.


Why can't I find the Activate mouse scroll option?


The Activate mouse scroll checkbox in the Scenes panel only appears when Scene behaviour is set to Transition effect, the page has two or more scenes, and the Effect is not None (direct). With Standard scrollpage the page already scrolls, and with Direct transition mouse scroll is always off.


Can I make a scene other than the first one sticky?


No. Only the first scene in the page can be sticky. To keep another scene on top, drag it to the first position in the Scenes panel, then tick First scene sticky on top under Scene behaviour.


Why can't I delete a scene?


A page always keeps at least one scene, so you can't delete the last one. If you click Delete scene in the Scenes panel when only one scene is left, a short warning appears: "The active scene can not be deleted." If you delete it from the scene's menu on the canvas, the scene just stays after you confirm. To replace the last scene, add a new scene first.



No. On the published page, a Go to scene link to the sticky scene does nothing, even though the scene appears in the link's list in the editor.

Updated on: 29/10/2026