Editor blocks and layout reference
Reference for Basic, Layout, Navigation, Blog, and commerce-related page editor blocks on ArtInStack—excluding media/portfolio/hero blocks covered in Media presentation blocks.
This page lists non-media blocks and layout primitives. Blocks that primarily display Media, Portfolio, heroes, or sliders live in the Supported media presentation blocks section with deeper per-category guides.
Core architecture & fields
Drag blocks from the Blocks panel (right sidebar → Blocks icon) into a column. Most pages follow:
Section → Row → Column(s) → Block(s)
Layout
| Block | Use for |
|---|---|
| Section | Full-width vertical band; section spacing |
| 1 Column | Single full-width column |
| 2 Columns | Split content 50/50 (adjust in Traits) |
| 3 Columns | Features, pricing tiers, team cards |
| 4 Columns | Dense icon or stat rows |
| Sidebar layout | Main column + sidebar column |
Row traits commonly include max width, gap, and padding—see Page editor sidebar and toolbar.
Basic
| Block | Use for |
|---|---|
| Rich text | Headings, paragraphs, links, lists in one block |
| Text / Heading | Legacy/simple text (prefer Rich text on new pages) |
| Link | Standalone text link |
| Button | CTA button with URL |
| Quote | Pull quote styling |
| Text section | Pre-wrapped text band |
| Divider | Horizontal rule between sections |
Navigation
| Block | Use for |
|---|---|
| Navbar | In-page navigation bar (legacy/simple) |
| Footer simple | In-page footer band (legacy/simple) |
Site-wide header and footer chrome uses the header/footer template editor (dedicated blocks and presets—not these page blocks): Header, footer, and navigation.
Hero (structural note)
Hero blocks are media-forward. Use Hero canvas blocks for Image/Video/Slider heroes.
Blog
| Block | Use for |
|---|---|
| Blog listing | Grid, list, featured, or sidebar layouts of posts — layout in Traits |
Index page setup: Manage your blog index page.
Advanced (non-media)
| Block | Use for |
|---|---|
| Bento grid | Mixed tiles (text + images) |
| Before/After slider | Two-image comparison — Advanced interactive |
| Ad embed | Ad placement slot |
Products & forms
| Block | Use for |
|---|---|
| Products grid | Storefront product cards |
| Contact form | Visitor messages to your inbox |
| CTA centered | Call-to-action band |
| Feature card / Features grid | Productized service highlights |
| Testimonials | Social proof quotes |
Commerce context: Commerce overview.
Media blocks (see other section)
| Category | Directory article |
|---|---|
| Image, Video, Lightbox | Standard media blocks |
| Gallery, Portfolio, Impact map | Portfolio delivery blocks |
| Hero image/video/slider | Hero canvas blocks |
Next steps & validation
- Add a Section → 2 Columns → Rich text + Button on a draft page.
- Save and preview Mobile width.
- Pick one media block from Supported media presentation blocks for your next section.