Column

The Column block serves as the modular foundation of the Multicolumn section in Sneax. Rather than being a rigid, predefined template with fixed fields, Sneax utilizes Shopify’s advanced Nested Block Architecture ({% content_for 'blocks' %}).

This means each Column acts as a flexible container, allowing sneaker boutiques and footwear brands to build custom column layouts from scratch—combining editorial sneaker photography, drop headlines, technical material breakdowns, and animated call-to-action buttons in any order.

---

1. The Power of Nested Architecture #

Standard themes often force you into a fixed box (e.g., Image $\rightarrow$ Title $\rightarrow$ Text). In Sneax, the Column block accepts any Universal Theme Block (@theme) or App Block (@app).

This flexibility allows you to craft diverse promotional elements across your store:

• Brand Value Columns: Showcase 100% Authenticity Verification, Express Worldwide Shipping, and Easy Size Exchanges.
• Silhouettes & Tech Spotlights: Break down a sneaker into three columns detailing the Upper Material, Cushioning Technology, and Outsole Grip.
• Category Portals: Feature an editorial photo, a category title (“Basketball Kicks”), and a direct button (“Explore Collection”).

---

2. Default Preset vs. Customization #

When you add a new Column block to your Multicolumn section, Sneax automatically pre-populates it with a balanced layout preset so you never start with an empty box:

1. Image Block (image): Visual hero or icon container.
2. Title Block (title): Main headline (Default: Heading).
3. Text Block (text): Supporting paragraph description.

You can freely keep, delete, duplicate, or reorder these child blocks to suit your store’s needs.

---

3. Supported Child Blocks Inside a Column #

To add new elements inside a Column, click (+) Add block directly indented underneath that specific Column in the Theme Editor sidebar:

Child Block	Functionality & Best Use in Sneax Footwear Stores
Image (image)	High-resolution photography of sneaker profiles, close-up stitching, or trust icons.
Title (title)	Bold column heading (e.g., “Verified Authentic”, “Air Cushioning”, “Waterproof Suede”).
Subtitle (subtitle)	Upper kicker or category pill (e.g., “Guaranteed” or “Tech Specs”).
Text (text)	Body copy with opacity controls for material specs, return policies, or drop instructions.
Button / Link (link)	Interactive CTA with hover animations and 9 selectable icons (Cart, Arrow, etc.).
Countdown (countdown)	Live ticking drop timer for scheduled footwear releases.
App Blocks (@app)	Third-party review stars, badge widgets, or carbon-neutral shipping seals.

---

4. How to Build & Manage Columns in the Theme Editor #

Adding & Customizing Child Blocks #

1. In your Shopify Theme Editor, navigate to a page with a Multicolumn section (or click Add section > Multicolumn).
2. In the left-hand sidebar, expand the Multicolumn section to see its Column blocks.
3. Click on any child block (e.g., Title or Image) nested inside the Column to open its individual settings panel in the right-hand sidebar.
4. Click (+) Add block indented directly under the Column to introduce additional elements (such as an animated Button).

Reordering Content Within a Column #

• In the sidebar, hover over any child block within the Column.
• Click and hold the six-dot handle (⋮⋮) and drag the block up or down.
• Example: Drag the Title above the Image to create a modern magazine headline layout.

---

5. Alignment & Layout Inheritance #

Because the Column block is a structural container:

• Text Alignment: Content alignment (Left, Center, or Right) is governed by the Text align setting in the parent Multicolumn section, ensuring consistent horizontal alignment across all columns in the row.
• Color Scheme: Automatically inherits the background and text contrast colors of the parent Multicolumn section.
• Responsive Stacking: On desktop, columns align side-by-side according to the section’s Desktop columns slider (2 to 6). On mobile, columns smoothly transition into a vertical stack or touch-swipeable carousel based on your Mobile slideshow toggle.

---

Sneaker Store Best Practices #

1. Create High-Impact Value Props:
   • Use three columns to resolve top sneakerhead purchase anxieties:
     • Column 1: Image: Checkmark Icon $\rightarrow$ Title: 100% Authentic $\rightarrow$ Text: Inspected by in-house authenticators.
     • Column 2: Image: Box Icon $\rightarrow$ Title: Double-Boxed Shipping $\rightarrow$ Text: Shipped in reinforced packaging to protect original shoe boxes.
     • Column 3: Image: Refresh Icon $\rightarrow$ Title: Hassle-Free Size Swaps $\rightarrow$ Text: Return or exchange your unworn kicks within 14 days.
2. Pair with an Animated Button:
   • When using columns to showcase footwear collections (e.g., Running, Basketball, Skate), add a Button (Link) block with the arrow icon at the bottom of each column to invite immediate discovery.
3. Maintain Visual Symmetry:
   • If using images in your columns, ensure all uploaded photos share identical aspect ratios (e.g., 1:1 Square or 4:5 Portrait) so the columns align uniformly across desktop displays.