Design Custom Store Pages With a Drag-and-Drop Builder
An ecommerce page builder lets you lay out a store page visually — drop a heading here, an image there, a product grid below it — instead of editing theme code. On ShopsWired, the builder uses a rows → columns → blocks model: your homepage and every custom content page are built from it, including live product grids that automatically show each shopper the right price. No code, no app to install, no separate subscription.
What "rows, columns, blocks" actually means
Most page builders invent their own vocabulary for the same three ideas. Here they are, concretely:
- Rows are the horizontal bands of the page. A row controls its own width (contained or full-bleed), padding, the gap between its columns, and its background. This is where the visual rhythm of a page comes from — a dark full-width row for a hero, a contained row with generous padding for a story section.
- Columns split a row side by side. Two columns for image-left/text-right. Three or four for a feature strip. One for a full-width statement.
- Blocks are the content itself, dragged into a column. Available block types include heading, text, rich text, raw HTML, image (optionally linked), button, and a live product grid — plus any blocks your installed plugins contribute.
That's the whole mental model. Once you've built one row, you've learned the builder. The practical upside of the nesting is that layout decisions stay at the row level, so changing a section's width or background doesn't mean touching every block inside it.
The live product grid is the part that matters
Static blocks are table stakes — every builder can place an image. The block worth understanding is the live product grid, because it isn't a screenshot of your catalog. It queries real products at render time, which means:
- Prices and availability are current, not whatever they were when you saved the page.
- B2B and customer-specific pricing is honored. If you've defined named price levels like Wholesale or Dealer and attached one to a customer, the grid on your homepage shows that customer their price — the same pricing they'd see on a product page or in search results. A page you built by dragging blocks around behaves like a first-class storefront surface, not a decorative banner.
- The page describes itself correctly to search engines. A builder page containing a product grid emits JSON-LD identifying itself as a collection, listing those products with prices and availability, plus its breadcrumb trail.
That last point is the quiet reason to build landing pages in the builder rather than pasting a block of HTML: the structured data, canonical URL, and sitemap entry come along for free. Every page you build has an SEO tab where you set the title and description search engines show, toggle noindex, nofollow, and decide whether the page appears in your sitemap.
If you sell at different prices to different accounts, the grid behavior compounds with everything else in the native feature set — price levels fall back predictably when a product has no level-specific price (require a quote, keep the standard price, borrow another level's price, or take a percent or amount off), and the rule waterfall can price product groups differently by tag or attribute.
Your homepage is a builder page
There's no separate "homepage editor" with different rules. The homepage is built entirely in the layout builder, from the same rows and blocks as everything else. Practically, that means you can restructure your most important page in an afternoon without opening a theme file or waiting on a developer.
Two adjacent pieces are worth knowing about:
The announcement bar
An optional header layout renders an announcement or promo bar above your navigation. It's built in the same builder, so it isn't limited to one line of text with a link — you can compose it. Use it for free-shipping thresholds, a sale window, or a shipping-delay notice, and remove it when the campaign ends.
CMS content pages at /page/{slug}
Custom pages — About, Contact, policies, size guides, a wholesale application — are served at /page/{slug} and auto-linked into navigation. If you're building a family of pages that share a layout (one landing page per product category, say), the Clone action in a page's ⋮ menu opens a new page pre-filled from the original. Give the copy its own path before saving, swap the copy and the grid, and you're done. Build the layout once; copy it as many times as you need.
Navigation is editable alongside it: build and reorder header, footer, and account menus, including nested dropdown items, so a new page doesn't become an orphan nobody can find.
Where a visual builder stops — and what to do then
Honest version: drag-and-drop builders are excellent at composition and bad at invention. If you want a layout the block set doesn't express — a custom comparison table, a configurator, a bespoke interactive section — dragging blocks won't get you there. ShopsWired gives you three escape hatches, in increasing order of effort:
- Raw HTML block. Still inside the builder. Good for an embed, a custom table, or markup you already have. It sits in a column like any other block, so the surrounding layout still comes from rows.
- Custom code injection. Insert your own CSS, HTML, or JS at Head Start, Head End, Body Start, or Body End, plus a thank-you-page-only slot for conversion pixels. These render dynamically, so they can reference live page and order data without editing the theme. This is the right place for analytics and global style tweaks — not for page content.
- Theme files. A built-in code and file editor lets you customize any theme file, adjust theme settings, and manage versions, clones, and updates. You can also install a different ready-made theme (Aura, Onyx, Harvest, Pop, Shift, Timber, and others), each with its own look and homepage layout — or install one from the Marketplace, previewing it live on desktop and mobile first.
- Plugin-provided blocks. A plugin can contribute its own block type, which then appears in the builder's block list like a native one. If your team can write a bit of code, the payoff is a block your non-technical staff can place by dragging. See the developer docs if that's the route you want.
The sequencing advice: start in the builder, and only drop a level when the builder genuinely can't express what you need. Most stores never need level three.
A practical first build
If you're setting up a storefront this week, this order wastes the least time:
- Brand look first. Upload your logo (it's reused automatically as favicon and touch icon) and set your eight brand colors — primary, hover, background, surface, main and muted text, error, success. They apply across the whole storefront, so every page you then build already looks like you. Clear them any time to fall back to theme defaults.
- Upload media before you lay out. Nothing breaks flow like hunting for a hero image mid-build. Note that public files are cached close to your shoppers for a long time, so if you later replace an image under the same filename, clear its cached copies — or just upload under a new name when a swap has to be visible immediately.
- Build the homepage as three or four rows, not fifteen. Hero, a live product grid, one proof or story row, one call to action. Add more only when you have something to say.
- Then the content pages. Build the first one properly, then Clone it for the rest.
- Check both widths. Rows behave differently when columns stack on mobile. Look at every row on a phone before you publish.
What it costs
The builder isn't an add-on — it's part of the platform on every plan, as are themes, the file manager, nav menus, and the SEO fields on each page. Plans are per shop: Pro at $99/mo, Business at $249/mo, Enterprise at $499/mo, and Dedicated for custom needs, with pay-as-you-go compute on top and a custom domain, SSL, and edge caching included per shop.
The piece that tends to matter more than the monthly line: 0% platform transaction fees on every plan. You pay your payment processor's standard rate and nothing to us on top of each sale. On a platform that charges a per-sale percentage, your design work and your revenue growth both get taxed; here they don't.
Right now Pro is $1/month for the first three months, which is enough runway to build a real homepage, a handful of content pages, and a working catalog before you're paying list price. There's no free trial — the $1 promo is the way in. Full details on the pricing page.
The short answer
If what you want is to design store pages visually — compose a homepage from rows and blocks, drop in a product grid that respects each customer's pricing, spin up content pages at /page/{slug}, run an announcement bar, and keep the structured data and SEO fields correct without writing markup — that's what the builder does, and it's included. When you outgrow it, the raw HTML block, code injection, theme editor, and plugin blocks are there in that order. Most of the work happens by dragging.