Supported media presentation blocks

Directory of page editor blocks that display photos and videos from your ArtInStack Media library and Portfolio collections.

Open the Blocks panel in the right sidebar (plus icon) to add blocks by category. Every block below can pull from Media and/or Portfolio—choose the presentation first, then wire assets in Attr after you select the block on the canvas. Layout, text, and navigation blocks are listed in Editor blocks and layout reference.

Capability overview

Presentation blocks turn uploads into stories: a single editorial still, a proofing grid, a geographic impact map, or a full-viewport hero reel. You compose in PagesEdit; visitors see the published layout on your live site.

Visitor experienceConfigured inWhat happens on click
Portfolio lightbox (overlay)Image Portfolio block + Portfolio SettingsLightbox & StyleThumbnail opens a full-screen or framed overlay; prev/next stay inside the current gallery page when pagination is on (see Portfolio lightbox settings).
Inline on-page galleriesImage Gallery, Video Gallery, featured layouts, Slider, inline VideoImages and videos stay on the page—grid, carousel, or main+thumbs navigation. No portfolio lightbox settings apply.

Interface architecture

[Media library + Portfolio collections]
        |
        v
[Pages → Edit → drag block onto canvas]
        |
        v
[Attributes panel: source, layout, aspect ratio, columns, …]
        |
        v
[Save → Preview → Publish]

Block directory

Every layout configuration in the platform is organized by its corresponding panel section within the page canvas editor.

Standard Media

Dashboard path: PagesEdit → Page Editor → Media

Full reference: Standard media blocks

  • Image — Renders a single responsive still with custom aspect-ratio boundaries and alt text.
  • Video — Deploys a native HTML5 player from Media or an external URL, with poster and aspect presets.
  • Video Lightbox — Shows a thumbnail on the page; click opens a focused, full-screen playback experience.
  • Video Background — Loops video beneath typography and overlays you drop in the section (muted autoplay by default for browser compatibility).

Portfolio Delivery

Dashboard path: PagesEdit → Page Editor → Portfolio

Full reference: Portfolio delivery blocks · Workflow: Add media to pages

  • Image Gallery — Multi-row/column grids of hand-picked stills from Media (not tied to one collection).
  • Image Portfolio — Curated display from one Portfolio collection—grid, masonry, or carousel with aspect-ratio control.
  • Portfolio Listing — Directory index of multiple collections—grid, list, or tabbed routing to sub-galleries.
  • Video Portfolio — Video wall for cinema reels and motion selects from your library.
  • Impact Map — Map canvas anchoring geo-tagged portfolio media to coordinates (optional campaign CTA).

Hero Canvas

Dashboard path: PagesEdit → Page Editor → Hero

Full reference: Hero canvas blocks

  • Hero Image — Full-width header centered on one high-impact still, with layout and overlay options.
  • Hero Video — High-bandwidth video hero with poster, viewport sizing, and landing-page layouts.
  • Hero Portfolio — Promotes a master Portfolio collection to the top of the page.
  • Glassmorphism Hero — Backdrop blur and glass panel over background image or video.
  • Hero Slider — Full-viewport carousel cycling multiple hero slides with optional CTAs.

Advanced & Interactive

Dashboard path: PagesEdit → Page Editor → Advanced

Full reference: Advanced & interactive blocks

  • Bento Grid — Structural grid balancing mixed media sizes, stats, quotes, and text side by side.
  • Before/After Slider — Interactive split handle comparing original and post-processed stills.
  • Ad Embed — Sandboxed container for a published ad placement from your dashboard settings.

Display & Feedback

Dashboard path: PagesEdit → Page Editor → Sliders or Video

Full reference: Display & feedback blocks

  • Slider — Touch-friendly horizontal carousel for in-column image sequencing (not full-page hero).
  • Video Gallery — Multi-column grid engineered for continuous video assets.
  • Video Testimonial — Client quote and name beside a video validation container.

Common core use cases

  • Landing page: Hero Slider or Hero Video + Image Portfolio grid below the fold.
  • Case study: Before/After Slider + Image Gallery of selects.
  • Conservation / travel: Impact Map + fundraising CTA on the same page.
  • Client proofing narrative: Image Portfolio (carousel) embedded in a Portfolio privacy workflow—see Galleries and Portfolio.

Next steps & validation

  1. New to the editor? Start with Introduction to the page editor and Page editor sidebar and toolbar.
  2. Read Add media to pages for the end-to-end workflow.
  3. Open the category page for the block you plan to use (links in the directory above).
  4. Place one block on a draft page, connect Media or Portfolio, and preview mobile + desktop before publish.