Advanced & interactive media blocks

Bento Grid, Before/After Slider, and Ad Embed blocks for mixed layouts, comparisons, and ad placements on ArtInStack pages.

Reference for Page Editor → Advanced blocks that combine Media with layout or third-party embeds.

Core architecture & fields

Block	Media role	Primary traits
Bento Grid	Per-cell images from Media	Template, gap, anchor span, aspect ratio, stat/quote cells
Before/After Slider	Top + bottom images from Media	Aspect ratio, draggable compare handle
Ad Embed	None (iframe placement)	Published ad placement from Settings → Integrations

Modular bento-style grid: one large anchor cell plus supporting cells for stats, highlights, testimonials, and secondary images.

Attributes include:

Template — hero-left, hero-right, hero-top, balanced.
Gap — tight through spacious spacing between cells.
Anchor span — 2×2, 2×1, 1×2, or full-width anchor.
Aspect ratio — grid-level ratio preset.
Per-cell image pickers (Media) for image cells; text cells for stats, quotes, labels.

Best for: homepage “signature” layouts mixing portfolio stills with social proof.

Interactive comparison control: drag handle reveals “after” image over “before.”

Attributes include:

Best for: retouching, restoration, renovation, color-grade reveals.

Secure wrapper for a published ad placement iframe (not raw arbitrary HTML).

Attributes include:

Ad placement — choose from placements configured under dashboard ad embed settings (zone: page block).

Bento Grid cell images are decorative unless you add meaningful alt text on each pick.
Before/After requires two images with similar framing for a convincing wipe.
Ad Embed only renders placements in published status; draft placements show the editor placeholder.

Bento anchor cell shows a Media image after save.
Before/After handle moves in preview and on the live site.
Ad Embed shows the correct placement or a clear “select placement” hint in the editor.

Advanced & interactive media blocks

Bento Grid, Before/After Slider, and Ad Embed blocks for mixed layouts, comparisons, and ad placements on ArtInStack pages.

Reference for Page Editor → Advanced blocks that combine Media with layout or third-party embeds.

Block	Media role	Primary traits
Bento Grid	Per-cell images from Media	Template, gap, anchor span, aspect ratio, stat/quote cells
Before/After Slider	Top + bottom images from Media	Aspect ratio, draggable compare handle
Ad Embed	None (iframe placement)	Published ad placement from Settings → Integrations

Modular bento-style grid: one large anchor cell plus supporting cells for stats, highlights, testimonials, and secondary images.

Attributes include:

Template — hero-left, hero-right, hero-top, balanced.
Gap — tight through spacious spacing between cells.
Anchor span — 2×2, 2×1, 1×2, or full-width anchor.
Aspect ratio — grid-level ratio preset.
Per-cell image pickers (Media) for image cells; text cells for stats, quotes, labels.

Best for: homepage “signature” layouts mixing portfolio stills with social proof.

Interactive comparison control: drag handle reveals “after” image over “before.”

Attributes include:

Best for: retouching, restoration, renovation, color-grade reveals.

Secure wrapper for a published ad placement iframe (not raw arbitrary HTML).

Attributes include:

Ad placement — choose from placements configured under dashboard ad embed settings (zone: page block).

Bento Grid cell images are decorative unless you add meaningful alt text on each pick.
Before/After requires two images with similar framing for a convincing wipe.
Ad Embed only renders placements in published status; draft placements show the editor placeholder.

Bento anchor cell shows a Media image after save.
Before/After handle moves in preview and on the live site.
Ad Embed shows the correct placement or a clear “select placement” hint in the editor.