Unlike other channels in Activator, banner authoring takes place on a multi-iframe canvas that renders every configured viewport at once, side-by-side, in the same scrollable space. This page covers how the canvas behaves and how editing is scoped to a single viewport at a time.
Why the canvas works this way
Ad campaigns target several viewport sizes — 320×250, 300×600, 728×90, 160×600 and so on. The same content rarely fits all sizes equally well: a hero image cropped for a wide leaderboard won't read on a tall skyscraper, and copy that fits a 728×90 won't fit a 300×50.
Rather than asking authors to build a single responsive document and trust media-query styling to do the right thing across every banner size, Activator gives each viewport its own HTML source and its own iframe in the canvas. Each viewport can be edited individually, layouts, media, copy, and styling, while the others stay visible for context.
Focus model
The canvas behaves on a single-focus, all-visible model:
-
All configured viewports are rendered in the canvas.
-
Only one viewport is in focus and editable at a time. The others are visible but not editable.
-
Switching focus to another viewport changes which iframe is editable; the rest stay rendered.
-
Layouts in the layouts panel are filtered by the currently focused viewport. Only layouts that the Design System has marked as compatible with that viewport are shown.
This avoids the complexity of true cross-viewport responsive styling, while still letting authors compare every size visually as they work.
Performance notes
-
Each viewport is a live iframe running the banner code, not a generated image. Updates appear instantly when content changes.
-
Scene thumbnails (in the Scene Manager) are also rendered as small live iframes. There is no thumbnail-generation delay.
-
For banners with many viewports, the canvas may use measurable browser memory. If the editor feels slow, try closing other heavy tabs.
Related
-
Banners — overview of the Banners channel.
-
Scene Manager — manage scenes in the focused viewport.
-
Create a Banner — the creation flow that produces the canvas state described above.