Skip to content

Manual Setup

alireza-selldone edited this page Nov 10, 2026 · 1 revision

Manual Setup

Set the Layout up on your shop yourself. Follow these steps in order, or let an agent do it: Install with AI.

1. Get your own copy

Fork selldone-custom-layouts/official-senso on GitHub, then clone your fork with its submodules (the shared Selldone code in modules/*):

git clone --recurse-submodules https://github.com/<you>/<your-repo>.git
cd <your-repo>
git remote add upstream https://github.com/selldone/storefront.git
git remote set-url --push upstream DISABLED
  • origin is your repository.
  • upstream is Selldone's official storefront, used to fetch updates only.
  • Never commit inside modules/*. A fix there is kept as a patch in patches/.

2. Install

npm run setup            # Selldone's modules
npm install --force

Node.js 20 or newer. On Windows use Git Bash for the shell scripts.

3. Point development at your shop

Edit .env. These are public values, read only in development. In production Selldone gives the Layout the shop that runs it.

VITE_APP_SAMPLE_SHOP_NAME=<your shop handle>
VITE_APP_SAMPLE_SHOP_CUSTOM_HOME=shop
VITE_APP_SAMPLE_DEFAULT_CURRENCY=USD
VITE_APP_SAMPLE_DEFAULT_COUNTRY=US
VITE_APP_SAMPLE_DEFAULT_LANGUAGE=en
VITE_APP_DEV_SERVER_PORT=9133

VITE_KALIO_ACCOUNT=desk (in .env and .env.development.local) shows the buyer account Senso uses: a side rail of sections ("desk"). Releases set it themselves.

4. Run it

npm run serve

Open http://localhost:9133. Check the home, a category, a product page, the cart and the account against your shop.

  • If a section is missing or looks empty, see Shop Requirements. Senso hides a section that has nothing to show.
  • If a category sits under "More" in the header, its name matches no family. See Customize.

5. Make it yours

  • Name: BRAND.name in components/kalio/kalio-brand.ts. Set it to null to show your shop's own title.
  • Families: FAMILIES in components/senso/senso-families.ts.
  • Photos: put them in assets/senso/photos/ with the names in components/senso/senso-photos.ts. Remove the sample category photos assets/senso/wide-*.webp if they do not fit your categories.
  • Colours: components/senso/senso-theme.settings.ts. See Theme and colours.

Customize explains each one.

6. Give the Layout your identity

In manifest.json:

{
  "package": "mybrand-electronics",
  "name": "Mybrand Electronics",
  "version": "1.0.0",
  "storefront": true,
  "backoffice": false,
  "description": "One sentence about your storefront."
}
  • package: lowercase, unique to you, and permanent after the first upload.
  • name: at least 8 characters.
  • version: new for every upload, never reused.

7. Release and go live

  1. Build and Upload: bash scripts/release.sh 1.0.0 desk.
  2. Go Live: attach the version to your shop, make the domains inherit it, and set Home to the shop page.

8. Keep up with Selldone

git fetch upstream main --tags --prune
git merge --no-ff upstream/main

Resolve conflicts by keeping Senso's templates and Selldone's logic. Then re-apply the patches if the submodules changed:

git -C modules/components apply ../../patches/modules-components.kalio.patch
git -C modules/translate apply ../../patches/modules-translate.kalio.patch

A patch that no longer applies must be redone by hand, not skipped.

Clone this wiki locally