Cómo Desplegar Tu Template con Sanity

Acabas de comprar un template con Sanity. Aquí está el proceso completo para ponerlo en funcionamiento en un dominio real, paso a paso.

¿Buscas la guía para templates estáticos? Si tu template no usa Sanity, consulta Cómo Desplegar Tu Template Estático — cubre Vercel, Netlify y GitHub Pages.

Qué Recibes

Cuando compras un template con Sanity de FSEVO, recibes un archivo ZIP que contiene:

El frontend de Astro en astro/ (completamente construido, listo para producción)
El Sanity Studio preconfigurado en sanity/
Templates de variables de entorno (.env.example en cada carpeta)
LICENSE.md con los términos de tu licencia
Esta guía

Paso 1 — Descargar Tu Template

Tu template llega como un archivo ZIP:

Si compraste en fullstackevolved.com: usa el enlace de descarga de la página de confirmación del pedido. Por seguridad caduca tras un tiempo limitado; si ya caducó, escribe a hello@fullstackevolved.com con tu referencia de pedido y te enviamos uno nuevo.
Si compraste en Gumroad: descárgalo desde tu biblioteca de Gumroad cuando quieras.

Descomprímelo. El template tiene dos partes: el sitio web en astro/ y el Sanity Studio en sanity/. Instala las dependencias en ambas:

unzip nombre-de-tu-template-astro-template.zip
cd nombre-de-tu-template
(cd astro && npm install) && (cd sanity && npm install)

Vercel, Netlify y GitHub Pages despliegan desde un repositorio Git, así que sube el código a un repositorio privado tuyo:

git init && git add . && git commit -m "Initial commit"
gh repo create tu-sitio --private --source=. --push

(O crea un repositorio privado en github.com y haz push.) Mantenlo privado: la licencia no permite publicar el código fuente del template.

Paso 2 — Crear Tu Proyecto en Sanity

Ve a sanity.io/manage e inicia sesión (crea una cuenta gratuita si es necesario).

Haz clic en Create new project
Dale un nombre (por ejemplo, el nombre de tu dominio)
Elige el plan Free — es más que suficiente
Anota tu Project ID — lo necesitarás pronto
Tu dataset se llama production por defecto

Ahora tienes un backend de Sanity vacío listo para recibir contenido.

Paso 3 — Configurar Variables de Entorno

En la carpeta astro/, duplica .env.example y renómbralo a .env:

cd astro
cp .env.example .env

Abre .env y completa tus valores:

PUBLIC_SANITY_PROJECT_ID=tu_project_id_aqui
PUBLIC_SANITY_DATASET=production

Eso es todo lo que necesitas localmente. El frontend lee desde el CDN público de Sanity, así que no se requieren tokens de API para el frontend de solo lectura.

Paso 4 — Desplegar Sanity Studio

La carpeta sanity/ es una app independiente de Sanity Studio. Desde la raíz del proyecto, despliégala en el hosting gratuito de Sanity:

cd sanity
npx sanity deploy

Cuando te pregunte, elige un hostname — este será tu URL del Studio:

https://nombre-de-tu-studio.sanity.studio

Guarda esta URL en favoritos. La usarás para gestionar todo el contenido de tu sitio.

Paso 5 — Poblar Tu Contenido

Abre la URL de tu Studio en el navegador y comienza a agregar contenido.

El schema está preconstruido para coincidir exactamente con el frontend. Cada campo mapea directamente a lo que ves en el sitio en vivo. Algunos consejos:

Imágenes — súbelas a la biblioteca de medios de Sanity; se sirven automáticamente a través del CDN global de Sanity
Texto enriquecido — usa el editor de bloques; encabezados, enlaces y listas están todos estilizados en el frontend
Slugs — haz clic en “Generate” junto al campo de slug; no los escribas manualmente
Borradores — el contenido permanece en borrador hasta que presiones “Publish”; el sitio en vivo no lo mostrará

Comienza con la página más importante (generalmente el hero de la homepage y la sección about) y trabaja hacia afuera.

Paso 6 — Desplegar el Frontend en Vercel (Recomendado)

Vercel es nuestra plataforma recomendada para todos los templates de FSEVO — mejor soporte para Astro, sin configuración y el tier gratuito es más que suficiente para la mayoría de proyectos.

Ve a vercel.com, inicia sesión y haz clic en Add New Project.

Importa el repositorio que subiste en el Paso 1
Define Root Directory como astro. Así Vercel detecta Astro automáticamente y la configuración de build es correcta por defecto
Antes de desplegar, ve a Environment Variables y agrega:
- PUBLIC_SANITY_PROJECT_ID → tu project ID
- PUBLIC_SANITY_DATASET → production
Haz clic en Deploy

Tu sitio estará en vivo en tu-proyecto.vercel.app en unos 60 segundos.

Paso 7 — Conectar un Dominio Personalizado

En tu proyecto de Vercel, ve a Settings → Domains y agrega tu dominio.

Vercel te mostrará los registros DNS que debes agregar. Ve a tu registrador de dominios (Namecheap, Cloudflare, GoDaddy, etc.) y agrega:

Un registro A apuntando a la IP de Vercel: 76.76.21.21
O un CNAME apuntando a cname.vercel-dns.com (para subdominios)

La propagación DNS toma entre 1 minuto y 24 horas dependiendo de tu registrador. Vercel maneja HTTPS automáticamente — no se necesita configuración de SSL.

Paso 8 — Configurar Revalidación (Opcional pero Recomendado)

Por defecto, el frontend se reconstruye en cada deploy de Vercel. Para activar un rebuild automáticamente cuando publicas contenido en Sanity:

En Vercel, ve a Settings → Git → Deploy Hooks y crea un hook — copia la URL
En Sanity Studio, instala el plugin de Vercel Deploy:

cd sanity
npx sanity install @sanity/vercel-deploy

Agrega la URL del hook a la configuración de tu Studio

Ahora cada vez que presiones “Publish” en Sanity, el frontend se reconstruye automáticamente — no se necesitan deploys manuales.

Solución de Problemas

El contenido no se muestra en el sitio en vivo Asegúrate de presionar Publish en Sanity Studio. El contenido en borrador nunca se envía al frontend.

El build falla en Vercel Verifica que tus variables de entorno estén configuradas correctamente en el dashboard de Vercel. Un PUBLIC_SANITY_PROJECT_ID faltante es la causa más común.

Las imágenes no cargan Tu project ID de Sanity debe coincidir exactamente en .env. Verifica el valor en sanity.io/manage.

El Studio muestra “Unauthorized” Ve a sanity.io/manage → tu proyecto → API → CORS Origins y agrega la URL de tu Studio y tu dominio en vivo.

¿Necesitas Ayuda?

Si encuentras algo no cubierto aquí, envía un email a hello@fullstackevolved.com con tu referencia de compra y una descripción del problema. Tiempo de respuesta menor a 24 horas.