# Storefront theme editor: GoCommerce sections and templates > GoCommerce’s theme editor, checked against the code: a home page built from sections, theme settings, templates, header, footer and contact page. - Canonical: https://kitcommerce.store/features/storefront/ - Last updated: 2026-10-30 --- Features · Storefront ## Set the shop’s look in the panel, and the storefront draws it GoCommerce keeps each store’s home page, page templates, header, footer and theme settings, edited in its panel with the live storefront beside the editor. Svelte Commerce draws them through @misiki/gocommerce-connector. Each tile names the connector release that brought it. Where Svelte Commerce draws something only on its gocomm branch, not yet merged into main, the tile or its group says so. The last end-to-end test of the pair ran on 28 October 2026 with version 0.14.0. - **0** deployments to publish a change - **1** renderer: the editor frames the real storefront - **0.16.0** the connector release that carries all of it ### Pages the shop arranges ext/layouts, installed with -layouts. Its Theme editor plugin is on for every store from the start; switched off, the storefront draws its built-in pages. - **A home page built from sections** Announcement bar, hero, product grid, picture beside words, text, benefits strip, slideshow, collection list, video, newsletter sign-up, questions and answers, and columns: any of them, any number of times, in any order. A product grid shows a collection, products the shop picks or the newest products. Connector 0.6.0 brought the page, and 0.8.0 the slideshow and the five types after it. `ext/layouts/registry.go · Sections` - **Saved as you go, with the storefront beside it** Every edit saves itself, with undo, redo and Reset back to what is published. On a computer the editor frames the store’s own storefront, draws each edit there before it is saved and opens the section clicked in it. Each publish is a revision, and rolling back publishes an earlier one again. `admin/src/lib/components/PageEditor.svelte · ext/layouts/layouts.go` - **Product and collection templates** One product page and one collection page per store, drawn for every product and every collection. The shop moves the core (the gallery, price and buy box, or the grid) and arranges sections around it, such as reviews, related products and suggestions. Connector 0.9.0. `ext/layouts/registry.go · Pages` - **Publish at a time** Any page’s saved draft can be set to publish at a time up to a year ahead, exactly as it was when the time was set. Publishing by hand in the meantime leaves the schedule alone, so fixing a typo today does not call off a page set for Friday. `ext/layouts/schedule.go` - **A starting home page with pictures** Until a shop publishes its own, the storefront shows the starting page: a hero on a colour block, four tiles, the newest products, a picture beside words and the benefits strip, with the pictures built into the engine and yellow buttons with near-black words. Svelte Commerce draws its bold look on the gocomm branch. `ext/layouts/http.go · Starter` - **An icon for each benefit** Each item on the benefits strip can carry an icon from a fixed set, such as delivery, returns, secure payment or cash on delivery, drawn in the storefront’s own line style. Carried since connector 0.6.0; Svelte Commerce draws the icons on its gocomm branch. `ext/layouts/registry.go · BenefitIcons` ### Theme settings Saved, previewed and published with the home page, and applied to every page the storefront draws. An unset one keeps the storefront’s own look. All of them reach Svelte Commerce from connector 0.8.0; its main branch draws the colours, fonts, corners and picture shape, and its gocomm branch the text, card, list and product page settings. - **Colours, fonts and corners** Background, text, buttons, text on buttons and quiet backgrounds as #rrggbb, heading and body fonts from a fixed list of Google fonts, and corners from none to large. The editor warns, and still saves, when a pair of colours reads below 4.5:1. `ext/layouts/registry.go · ThemeSettings` - **Picture shape and fit** Product pictures in lists square, portrait (3:4), tall (2:3) or landscape (4:3), either cropped to fill the frame or shown whole. `ext/layouts/registry.go · product_image_ratio` - **Text size, weight and spacing** Text at 14, 16 or 18px, headings from medium to extra bold, compact, comfortable or spacious room around sections, cards and lists, and a colour for savings and offers. `ext/layouts/registry.go · type_scale` - **Product cards** What each card shows: a badge on the picture, the brand line, one or two title lines, the star rating when there are reviews, % off when there is a compare-at price, the wishlist button, quick add and a second picture on hover. `ext/layouts/registry.go · card_badge` - **Product lists** One or two products across on a phone and three to five on a computer, sub-category pictures, quick filter chips, filters beside the products or in a drawer, and a sort and filter bar on phones. `ext/layouts/registry.go · list_columns_mobile` - **The product page** A buy button that stays on screen on phones, pictures one at a time or in a grid, highlights as a grid, a delivery check by PIN code, “only N left” from a number the shop picks, and a link to its size guide. `ext/layouts/registry.go · pdp_sticky_buy` - **Match to logo** One button reads the store’s logo in the browser and offers palettes from its colours: the accent, black or white text that reads on it at 4.5:1, and a pale tint. It calls no AI model, and a palette is an ordinary edit until the shop publishes. `admin/src/lib/logo-palette.js` ### Header, footer and the shop’s pages The header and footer are pages of ext/layouts, published like the home page. Their menus come from the navigation module (-menus) and the standard pages from the CMS module (-cms). Svelte Commerce draws this group on its gocomm branch. - **The header** The announcement strip, on or off, with its words, its link and whether it shows on every page or the home page only; the header menu, or no menu at all. The logo, search, account and basket stay where the storefront puts them. Connector 0.11.0. `ext/layouts/registry.go · header` - **The footer** The footer menu drawn as columns, a few words about the shop, the newsletter sign-up on or off, up to eight social links and the copyright line. Menus are read live, so a change made in Content › Menus needs no publish. Connector 0.11.0. `ext/layouts/registry.go · footer` - **The store’s logo, dark logo and icon** Set under Settings › Store from the media library: a logo, one for dark backgrounds, and a square icon for the browser tab and home screen. One storefront serving many stores shows each its own. Connector 0.15.0, not yet run end to end. `core/store_profile.go · logo_url` - **Standard pages and a footer that links them** A new store gets About us, Contact us, privacy, terms, shipping and refund pages as drafts to finish, and a footer linking all six. Until the shop publishes them, shoppers see only Contact us, which is the storefront’s own form. An existing store adds the six to its footer with one button on the Pages screen. `ext/cms/standard.go · ext/navigation/navigation.go` - **The contact page** — Partial A store chooses to show its address, private until it does, and sets a map location and its opening hours, under Settings › Store › Contact page. Svelte Commerce draws them beside the WhatsApp chat number and loads the map only when a shopper taps it. Connector 0.16.0, not yet run end to end. Missing: a second opening range in a day, such as after a lunch break. `core/store_profile.go · show_address` ### Finding and showing products Svelte Commerce’s main branch draws these with the connector release named, except the badge, which it draws on its gocomm branch. - **Typo-tolerant search** With -meilisearch installed and a store’s Meilisearch plugin switched on, a shopper’s words are searched in the store’s own index, so a misspelt word still finds the product. The database answers when the index cannot, and still supplies the filters beside the hits. Connector 0.14.0. `ext/search-meilisearch/meilisearch.go` - **Filters with real counts** — Partial The listing counts its own filters over every matching product, not one page: tags, brand, product type, category, category attributes and the price range, each group counted with every other choice applied but its own. Connector 0.10.0. Missing: filters on variant options such as size. `core/catalog_facets.go` - **Pictures at the size shown** — Partial The engine resizes a store’s pictures to the width the storefront asks for and keeps each size, so a small card downloads a small picture. Connector 0.15.0 asks for them, not yet run end to end. Missing: pictures in home page sections and banners, which load at full size. `core/images.go` - **A badge on each product** — Partial One line of up to 24 characters, typed in the product editor and shown on the product’s picture wherever the theme’s card badge is set to it, as it is for new stores. Connector 0.8.0. Missing: the product CSV does not carry it. `core/product_extras.go · MetaBadge` ### Not in GoCommerce yet Named here so nobody has to find out at launch. Each is absent from the code; the last is absent by design. - **Other themes** — One theme, the storefront’s default. No theme families and no theme store. - **A layout per product** — One product template draws every product. - **Arranging other pages** — Category listings, content pages, the basket and checkout keep the storefront’s own layout. - **Your own fonts** — Headings and text use fonts from a fixed list of Google fonts; a shop cannot upload one. - **Moving the logo, search or basket** — The header’s words, links and menu are the shop’s; where the logo, search, account and basket sit is the storefront’s. - **Your own HTML, CSS or scripts** — Every setting is a plain value, so nothing a shop types reaches the storefront as markup, style or script. FAQ ### Questions about storefront and themes **Do I need a developer to change how my shop looks?** No, once the storefront is running. The home page, the product and collection templates, the header, the footer and the theme settings are edited and published in GoCommerce’s panel, with no deployment. Svelte Commerce draws what is published. **Which storefront draws these settings?** Svelte Commerce, through @misiki/gocommerce-connector. GoCommerce serves the published pages and settings on public routes under /x/layouts, so another storefront could read them, but it would have to draw them itself. Svelte Commerce draws the newer settings on its gocomm branch so far. **Can I see a change before shoppers do?** Yes. On a computer the editor shows your storefront beside the settings and draws each edit there before it is saved, and a preview link shows the draft for 30 minutes. Shoppers see nothing until you publish, or until a time you scheduled. **Can a theme change my prices or stock?** No. A page names collections and products, never their prices or stock, so a shopper always sees the catalogue’s own figures. Settings are plain values, so nothing typed in the editor reaches the storefront as code. **Can I undo a published change?** Yes. Every publish is kept as a revision, and rolling back publishes an earlier one again. Reset throws away edits that are not published yet. ### Read the code behind every tile Each file named on this page is in the GoCommerce repository, MIT licensed. Run it and check. [Backend + admin quick start](https://kitcommerce.store/#one-command) · [GoCommerce on GitHub](https://github.com/itswadesh/gocommerce) · [All features](https://kitcommerce.store/features/)