> For the complete documentation index, see [llms.txt](https://docs.ecwid.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.ecwid.com/site-themes/develop-site-themes/sections/section-collections.md).

# Section collections

Section collections group custom sections into reusable, distributable packages. They bundle multiple sections with metadata (name, description, cover image) so they can be offered as a set in the Instant Site Editor.

### Creating a Collection <a href="#creating-a-collection" id="creating-a-collection"></a>

Use the CLI to scaffold a new collection:

```bash
crane init --collection <name>
```

This creates the directory structure under `collections/`. The command fails if a collection with that name already exists.

### Folder Structure <a href="#folder-structure" id="folder-structure"></a>

```
collections/
├── assets/                          # Shared assets (cover images)
│   └── collection_cover_image.png
└── <collection-name>/
    └── configuration.ts             # Collection descriptor
```

### Configuration <a href="#configuration" id="configuration"></a>

The `configuration.ts` file defines the collection's metadata and the sections it includes.

### Factory Functions

The `@lightspeed/crane-api` package exports the following factory functions used in configuration files:

| Factory                      | Description                                                                                                     |
| ---------------------------- | --------------------------------------------------------------------------------------------------------------- |
| `collection.configuration()` | Creates a collection configuration object with full type safety. Accepts `metadata`, and `sections` properties. |
| `section.custom()`           | Creates a custom section referencing your own section implementation. Sets `type` to `'custom'` automatically.  |

### Properties

#### Metadata Properties <a href="#metadata-properties" id="metadata-properties"></a>

<table><thead><tr><th width="200.4609375">Property</th><th width="99.79296875">Type</th><th width="119.8984375">Required</th><th>Description</th></tr></thead><tbody><tr><td><code>metadata.name</code></td><td><code>string</code></td><td>Yes</td><td>Display name (2–60 characters)</td></tr><tr><td><code>metadata.description</code></td><td><code>string</code></td><td>Yes</td><td>Description text (2–150 characters)</td></tr><tr><td><code>metadata.cover_image</code></td><td><code>ImageData</code></td><td>Yes</td><td>Cover image with <code>set</code> containing at least one resolution</td></tr><tr><td><code>metadata.preview_url</code></td><td><code>string</code></td><td>No</td><td>Preview URL for the collection</td></tr><tr><td><code>metadata.categories</code></td><td><code>string[]</code></td><td>No</td><td>Template categories (unique values, see below)</td></tr></tbody></table>

#### Template Categories <a href="#template-categories" id="template-categories"></a>

Available values for `metadata.categories`:

* `apparel_footwear`
* `vape_smoke`
* `home_garden`
* `sport_outdoor`
* `jewelry_accessories`
* `pet_animals`
* `bikes`
* `health_beauty`
* `gift_shop`
* `electronics`
* `other`

### Sections <a href="#sections" id="sections"></a>

The `sections` array defines which custom sections are included in the collection. Each entry references a section from your `sections/` directory.

#### Section Properties <a href="#section-properties" id="section-properties"></a>

<table><thead><tr><th width="200.265625">Property</th><th width="100.41015625">Type</th><th width="120.1640625">Required</th><th>Description</th></tr></thead><tbody><tr><td><code>type</code></td><td><code>'custom'</code></td><td>Yes</td><td>Always <code>'custom'</code></td></tr><tr><td><code>id</code></td><td><code>string</code></td><td>Yes</td><td>Section ID (must exist in the <code>sections/</code> directory)</td></tr><tr><td><code>showcase_id</code></td><td><code>string</code></td><td>No</td><td>Default <a href="/pages/8AFXuroY3zKcdYdCVoer">showcase</a> to use</td></tr><tr><td><code>showcase_overrides</code></td><td><code>object</code></td><td>No</td><td>Override showcase defaults (see <a href="/pages/8AFXuroY3zKcdYdCVoer#showcase-overrides">Showcases — Showcase Overrides</a>)</td></tr><tr><td><code>category</code></td><td><code>string</code></td><td>No</td><td>Section category for classification in the editor</td></tr></tbody></table>

#### Section Categories <a href="#section-categories" id="section-categories"></a>

Available values for the `category` field:

`COVER`, `ANNOUNCEMENT`, `STORE`, `SLIDER`, `VIDEO`, `SPECIAL_OFFER`, `CUSTOMER_REVIEW`, `COMPANY_INFO`, `SHIPPING_PAYMENT`, `LOCATION`, `COLLECTIONS`, `BRANDS`, `CONTACT_INFO`

### Example <a href="#example" id="example"></a>

```typescript
// collections/my-collection/configuration.ts
import { collection, section } from '@lightspeed/crane-api';

export default collection.configuration({
  metadata: {
    name: 'Example Collection',
    description: 'Example Collection with custom sections',
    cover_image: {
      set: {
        ORIGINAL: {
          url: 'collection_cover_image.png',
        },
      },
    },
  },
  sections: [
    section.custom({
      type: 'custom',
      id: 'example-section',
      showcase_id: '1',
      category: 'COLLECTIONS',
    }),
  ],
});
```

{% hint style="info" %}
Asset Path

The `cover_image` URL references a file in the `collections/assets/` directory.
{% endhint %}

### Build and Deploy <a href="#build-and-deploy" id="build-and-deploy"></a>

Collections are built and deployed alongside sections and templates — no additional commands needed:

```bash
crane build    # Builds sections, templates, and collections
crane deploy   # Deploys everything to the platform
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.ecwid.com/site-themes/develop-site-themes/sections/section-collections.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
