First steps

From zero to the new storefront live, in ten minutes. This guide follows the shortest path (all in the dashboard) and shows where the tool and the AI come in, so you can pick later.

What you need

• A store on Hystore whose plan includes the Code theme module. Check it in Settings > Modules: it must be on.
• A role with the permissions of the Code theme group (the store owner has all of them). See Permissions.
• To connect an AI straight to the store: the Connect your AI option inside the module, in the plan.

1. Pick a theme to start

1. Open the dashboard at app.hystore.com.br.
2. Go to Customization > Code theme.
3. Pick one of the four ready themes: Base, Aurora, Celeste or Prisma. It becomes your draft, with every page, light and dark, and your store's colours.

2. Make your first change

1. Click Open the editor. Files are on the left and the preview on the right.
2. Open locales/en.json. It keeps the theme's texts in English.
3. Change a text, for example the title at the top of the home page, and press Ctrl+S. The preview reloads with the new text.

A text in the theme looks like this:

<h1>{{ 'home.hero_title' | t }}</h1>

And the value lives in the language file:

{
  "home": {
    "hero_title": "The best survival server in the world"
  }
}

3. Change colours and sections without code

1. Go back to Code theme and open Customize theme.
2. In Theme settings, change the colours, texts and images the theme offers.
3. In Sections of the page, pick a page and move sections up and down, hide them or add new ones.
4. Click Save. Everything goes to the draft.

4. See the preview on the store's address

The editor's preview is the store itself, with the draft. To send it to someone, use the preview link: it opens the draft on the store's real address for 24 hours, with a band saying it is a preview. The live store stays the same.

5. Publish

1. In Code theme, look at the list of changes and the errors (a theme with an error does not publish).
2. Click Publish now. This creates version 1 of your theme.

6. Turn the theme on in the store

1. In Code theme > In the store, click Use the theme in the store.
2. Open your store: the storefront is now your theme.

While the code theme is live, the drag-and-drop builder is turned off. To go back, pick a ready layout again: the theme leaves the store without being deleted.

Next steps

• Ask an AI to make the changes: connect Claude, Cursor or another app in Connect your AI. You describe what you want and approve the publish.
• Edit on your computer: the hystore tool downloads the theme, follows every save in the preview and works with git.
• Learn the format: the theme guide explains files, sections, data and filters, and the ready examples give you code to copy.