Rokad
All documentation
kingsbell docs

Getting started with Kingsbell

Understand Kingsbell, its release status, Shopify requirements, and the safest path from installation to a production storefront.

View repository
kingsbell documentation
Page 1 of 9

Kingsbell is a configurable editorial-commerce theme for Shopify, developed by Rokad. It combines a complete Online Store 2.0 storefront with image-led layouts, structured editorial publishing, advanced merchant controls, and an optional theme-facing private-member experience.

The current repository package version is 0.11.0. Kingsbell remains a pre-1.0.0 release that is being hardened for its first Shopify Theme Store submission. Repository-level checks and Shopify-native package generation are implemented, but production approval still requires development-store, browser, accessibility, performance, and real commerce-flow validation.

What Kingsbell includes

Kingsbell provides:

  • standard Shopify storefront templates for products, collections, cart, search, pages, blogs, articles, contact, password, and error states;
  • Ajax cart, predictive search, native filtering and sorting, product recommendations, pickup availability, and dynamic checkout support;
  • editorial, archive, commission, and private layout families;
  • structured journal templates for essays, interviews, visual stories, and research-oriented articles;
  • reusable theme blocks and structured-content sections;
  • global controls for colour, typography, spacing, buttons, forms, motion, and product cards;
  • member-facing presentation gates and account-aware sections;
  • Theme Check, static auditing, packaging, Lighthouse workflow scaffolding, and manual release procedures.

Requirements

For local development you need:

  • Node.js 20 or newer;
  • Shopify CLI with theme support;
  • access to a Shopify development store;
  • permission to install, preview, and edit themes in that store.

Install Shopify CLI:

bash
npm install --global @shopify/cli @shopify/theme

Confirm the installation:

bash
shopify version
node --version

Use this sequence when adopting Kingsbell:

  1. Clone or download the Kingsbell repository.
  2. Run the repository checks before editing the theme.
  3. Connect Shopify CLI to a dedicated development store.
  4. Preview the unmodified theme and verify the baseline templates.
  5. Configure brand, colours, typography, layout, and product-card defaults.
  6. Build navigation, footer, homepage, product, collection, and editorial templates in the theme editor.
  7. Add representative catalog, customer, B2B, article, and order data.
  8. Complete the development-store QA matrix.
  9. Generate a package only after the selected configuration passes review.
  10. Keep a tested rollback package before publishing or replacing a live theme.

First local commands

From the theme repository:

bash
npm run check
npm run dev -- --store your-store.myshopify.com
npm run package

npm run check runs Shopify Theme Check. npm run dev starts Shopify's remote development preview. npm run package creates a Shopify-installable theme archive from supported theme directories.

The release workflow also contains a deterministic repository audit that validates schemas, JSON templates, accessibility hazards, unsafe links, route usage, and asset budgets.

Theme directories

Storefront code is restricted to Shopify-supported theme directories:

text
assets/
blocks/
config/
layout/
locales/
sections/
snippets/
templates/

Repository-only files, design references, QA documents, scripts, and companion specifications are excluded from Shopify push and package boundaries.

Choose a starting template

Kingsbell includes a standard storefront and four visual directions:

DirectionBest suited to
StandardConventional commerce with restrained editorial styling.
EditorialCampaign-led stores, launches, and product storytelling.
ArchiveCatalogues, collections, editions, and chronology-led presentation.
CommissionBespoke, made-to-order, consultation, and service-led commerce.
PrivateInvitation-led or member-facing presentation with separate enforcement requirements.

Start with the standard templates when validating commerce behavior. Introduce alternate templates after products, variants, filters, cart, search, and checkout entry points are confirmed.

Important security boundary

Kingsbell can conditionally hide restricted storefront branches from unauthorised visitors. Liquid presentation controls do not secure product publication, search indexes, Storefront API data, cart APIs, permanent files, or checkout.

Private commerce must be enforced with Shopify-native catalog and publication controls, B2B company assignments, Shopify Functions where applicable, and/or a companion application that performs server-side authorization.

Production readiness

Do not treat successful theme packaging as production approval. Before publishing, complete:

  • development-store testing with representative data;
  • keyboard and screen-reader review;
  • responsive and cross-browser review;
  • real product, variant, cart, discount, market, account, and checkout flows;
  • Lighthouse performance and accessibility testing;
  • theme-editor save and section-reordering tests;
  • private-member authorization tests where those templates are used;
  • rollback verification.

Continue with the installation and development guide before changing theme code.