> ## Documentation Index
> Fetch the complete documentation index at: https://andcze.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Templates

> Ten ready-made open-source (MIT) shop sites — pick one, customise it and publish.

A template is a complete shop site project: home page, product list, product page, cart and the hand-off to checkout. All templates are **open source under the MIT license** ([`itemshop-templates` repository](https://github.com/itemshop/itemshop-templates)) — change them, copy them and use them outside ItemShop.

Templates differ only visually. Cart maths, package bonuses, discounts, the two required checkout consents, Turnstile, the redirect to the gateway and order-status polling are shared and behave the same in every template. Products, prices, payment methods and live widgets come from the [Storefront API](https://andcze.mintlify.site/en/developers/storefront-api.md) — you do not hard-code them.

## Choosing a template

**1. Open the template gallery**

When you create the site (wizard or **Workspace**) you see a gallery with a preview, description and version of every template.

**2. Click Use template**

ItemShop creates the site project from the template files (revision #1) and builds a preview with your products.

**3. Customise and publish**

Change the name, logo, colours and texts in `src/site.config.ts` — in the file editor, by asking the [AI editor](https://andcze.mintlify.site/en/site/ai-editor.md) or [your own agent](https://andcze.mintlify.site/en/site/agents.md). Then **Publish**.

> [!WARNING]
>
> Picking another template for an existing site creates a new revision with the new template's files. The previous version stays in the revision history and you can go back to it.

## Gallery

### Bento

![Bento](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/bento.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=45d831079b21cc6190a6d17d61ff1e50)

The default ItemShop store: bold tiles, light and dark themes, live monthly goal, recent purchases and top supporters.

**Best for:** General-purpose, the default. `bento`

### Storefront

![Storefront](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/storefront.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=2e151fb2f28e421d2c93249f0fc1e7c6)

A general-purpose store for digital products (licenses, Discord bots, FiveM/Rust/Roblox resources, courses, subscriptions): one-screen checkout, and everything you buy is a pass — product cards, checkout and confirmation drawn as tickets with a serial number. Search, filters, product pages, light and dark themes. Game-server widgets optional.

**Best for:** Not only Minecraft: digital products. `storefront`

### Portal

![Portal](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/portal.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=7abc480bea749eba6d4d839b8d7a32e5)

A classic server website with a store: centred logo header, hero with an echoed server name, player counter and character render, mode picker, news, FAQ. Per-mode store with a category sidebar and a separate payment page. Light and dark themes.

**Best for:** Classic server website with a store, multiple modes. `portal`

### Arena

![Arena](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/arena.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=1ccc409948e3f752f6590cbfe49924b5)

A dark PvP and guilds store: a blurred pixel castle hero with a character render, “Copy IP”, a recent-purchases strip with player heads, mode tiles with pixel items, rank cards with pixel logos, a “Sale” ribbon and a dedicated payment page.

**Best for:** PvP and guilds, dark. `arena`

### Vault

![Vault](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/vault.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=494289b4702b63457326bb216b59f23d)

A dark, premium wallet top-up store: golden bokeh, a hero render on a ring of light and a “How much do you want to top up?” card with amount tiles, bonuses and payment in the same card.

**Best for:** Wallet top-ups, premium look. `vault`

### Blocks

![Blocks](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/blocks.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=63131e72cc0685fa3badf0cf6839a42e)

A multi-mode server network: a full-screen pixel landscape at dusk, a title with emoji, link pills and a big grid of mode tiles with pixel blocks. Inside a mode: categories, products with pixel rank logos, recent purchases, monthly goal and top buyers; checkout in a large window with payment tiles.

**Best for:** Server network with many modes. `blocks`

### Horizon

![Horizon](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/horizon.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=c885a64b142ebfda4847b36de9dd6e94)

A bright, friendly MC server store: floating header with an online counter, brand-coloured hero card with a render on a status strip, stone “Copy IP”, mode cards with pixel icons, a top-supporters podium and generated rank logos.

**Best for:** Bright, friendly MC server store. `horizon`

### Wallet

![Wallet](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/wallet.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=b20b8c395cc1acf6b9f9f2864f45fc12)

A light, fintech-style wallet top-up store (e.g. vPLN): a top-up card with an amount slider and bonus thresholds next to four payment steps, a live top-up ticker, a wallet card in the hero, ready-made packs and a pixel-block supporter podium.

**Best for:** Fintech-style wallet top-ups. `wallet`

### Arcade

![Arcade](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/arcade.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=25cff761e848461cb24be05701503984)

A bright, pixel-retro store with a cart: a compact arcade title screen with a HUD, products right below it, cartridge cards on little screens, mode boards, a high-score table and one payment for up to 20 lines.

**Best for:** Retro with a cart (many items in one payment). `arcade`

### Market

![Market](https://mintcdn.com/andcze/4Ez5zb9gOyIcqHY0/images/templates/market.png?fit=max\&auto=format\&n=4Ez5zb9gOyIcqHY0\&q=85\&s=343970979c52d2434c65829d3d1fd844)

A bold, event-style store with a cart: poster hero with an event countdown, the server address as a ticket, modes with live players, colourful cards with price tags, a cart drawer and one payment for many products.

**Best for:** Event-style store with a cart. `market`

The **Arcade** and **Market** templates have a cart: you buy several products (up to 20 lines) in one payment. The other templates sell one item at a time.

## From the terminal

```bash theme={null}
npx itemshop init my-shop --template horizon
```

The template list (`id`, name, description, preview, repository, version) is also available through the API: `GET /templates`.

## What is in a template

```text theme={null}
itemshop.site.json      manifest (framework, build)
index.html
src/
  site.config.ts        name, logo, colours, links, hero — what you change most
  main.tsx
  App.tsx
  pages/ components/
  styles.css
package.json
```

`src/site.config.ts` is the only file that defines how the shop looks. Text fields accept one string or a per-language map (a missing language falls back to English, then Polish):

```ts src/site.config.ts theme={null}
export const siteConfig = defineSiteConfig<BentoConfig>({
  name: "",                       // empty = the name from the panel
  logo: { text: "N", image: null },
  colors: { brand: "#d0423a", brandHover: "#b13530", accent: "#f5b942" },
  theme: { default: "light", toggle: true },
  hero: {
    title: { pl: "Sezon 7 już trwa!", en: "Season 7 is live!" },
    // …
  },
});
```

Fields shared by every template (`name`, `logo`, `colors`, `theme`, `serverAddress`, `nav`, `footer`, `languages`, `checkout`) are identical, so AI and agents know where to look. Template-specific sections (hero, monthly goal, top supporters) differ.

## Your own template

A template is a plain repository with `itemshop.site.json`. The rules for submitting a template to the gallery are in `CONTRIBUTING.md` of the `itemshop-templates` repository.

> **[AI editor](https://andcze.mintlify.site/en/site/ai-editor.md)**
>
> Change the template by chatting.

> **[CLI](https://andcze.mintlify.site/en/site/cli.md)**
>
> `npx itemshop init --template bento`


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.