# Tienda

> [Depende de: ecommerce](/es/docs/enable/ecommerce)

Un listado de productos en `/shop` y una página por producto, para el carrito que añadió [`vela enable ecommerce`](/es/docs/enable/ecommerce). Las páginas están escritas en los términos de tu proveedor de pagos, y son tuyas: el generador nunca sobrescribe un archivo que ya existe.

### Sintaxis

```
$ vela generate shop
```

### Opciones

- `--provider <provider>` - Opcional. La tienda sigue al proveedor de [pagos](/es/docs/enable/payments) del proyecto, así que esto solo lo confirma; un proveedor distinto se rechaza.

Cada página de producto tiene un botón `<AddToCart>`. Si alguno de los archivos de abajo ya existe, no se escribe nada y el comando nombra el archivo: ejecuta [`vela destroy shop`](/es/docs/destroy/shop) para eliminar una tienda generada antes, o aparta el archivo.

### Stripe

> [Depende de: backend](/es/docs/enable/backend)

Las páginas leen el catálogo que la sincronización de pagos copia de Stripe a PocketBase (`stripe_products` y `stripe_prices`), en el servidor:

```
src/routes/(public)/shop/+page.server.ts
src/routes/(public)/shop/+page.svelte
src/routes/(public)/shop/[product]/+page.server.ts
src/routes/(public)/shop/[product]/+page.svelte
```

El listado muestra cada producto activo con su precio único predeterminado, y la página de producto su descripción, su primera imagen y todos sus precios únicos activos, con un selector cuando hay más de uno (tallas, por ejemplo; ponles nombre con el apodo del precio en el panel). La URL de un producto es su id, o `metadata.slug` si lo defines en el producto en el panel de Stripe. Los productos, precios, imágenes y descripciones se editan en Stripe; la sincronización corre cada diez minutos.

### Shopify

Las páginas consultan la Storefront API:

```
src/routes/(public)/shop/+page.ts
src/routes/(public)/shop/+page.svelte
src/routes/(public)/shop/[handle]/+page.ts
src/routes/(public)/shop/[handle]/+page.svelte
```

Los loads son universales (el token de la Storefront es público) y no se prerenderizan, así que el catálogo cambia sin recompilar y un sitio estático muestra las páginas con su fallback. La página de producto ofrece cada opción (talla, color) como un selector y resuelve la variante a añadir; una variante agotada lo indica. Los productos viven en el admin de Shopify y deben publicarse en el canal Headless al que pertenece el token.

### WhatsApp

WhatsApp no tiene catálogo propio, así que los productos son un módulo que editas:

```
src/lib/catalog.ts
src/routes/(public)/shop/+page.svelte
src/routes/(public)/shop/[id]/+page.ts
src/routes/(public)/shop/[id]/+page.svelte
```

`catalog.ts` lista el `id`, `name`, `description`, `price` (en `site.currency`, escrito como lo escribirías tú: `4.5`) e `image` de cada producto. Omite el precio en un artículo que el negocio cotiza en el chat. Las páginas de producto toman sus entradas del módulo, así que un sitio estático las prerenderiza todas.

Con el [CMS](/es/docs/enable/cms) habilitado, el catálogo es contenido en lugar de un módulo: una `CmsCollection` llamada `catalog` en el ámbito del layout raíz, que leen tanto el listado como las páginas de producto, así que los productos se añaden y se les pone precio en el sitio con `?edit`. Los precios siguen en `site.currency`.

### Lo que no es

Una tienda son páginas sobre un catálogo que vive en otro lugar (Stripe, Shopify, tu módulo o el CMS). No se generan existencias, categorías ni búsqueda; en Shopify el listado muestra los primeros cien productos.