Cómo funcionan los dominios con Cmssy headless

Cmssy es un CMS headless con editor visual. Tu contenido vive en el admin de Cmssy y se sirve a través de la API de entrega, mientras que tu sitio web real es una aplicación Next.js (App Router) que construyes con @cmssy/react y @cmssy/next y despliegas tú mismo (por ejemplo en Vercel). Cmssy no aloja tu sitio.

Como el despliegue es tuyo, tu dominio personalizado apunta a tu hosting, no a Cmssy. Añades el dominio donde esté desplegado tu sitio, configuras el DNS en tu registrador, y tu hosting emite el certificado SSL. Del lado de Cmssy, configuras la Preview URL del espacio de trabajo para que el editor enmarque tu sitio desplegado para la edición visual.

Por qué usar un dominio personalizado

Usar un dominio personalizado para tu sitio headless ofrece varias ventajas importantes:

• Profesionalidad — Un dominio personalizado como yourcompany.com se ve mucho más profesional que una URL de despliegue por defecto. Muestra a los visitantes que te tomas en serio tu presencia online.
• Marca — Tu dominio es parte de tu identidad de marca. Un dominio memorable refuerza el reconocimiento de marca cada vez que alguien visita o comparte tu URL.
• Beneficios SEO — Los buscadores favorecen los dominios personalizados consolidados. Con el tiempo, tu dominio gana autoridad y mejora tu posición en los resultados de búsqueda.
• Emails a juego — Con un dominio personalizado puedes usar direcciones de email a juego (p. ej., hello@yourcompany.com) para una experiencia de marca coherente y confiable.

Requisitos previos

Antes de empezar, asegúrate de tener:

• Un sitio Cmssy desplegado — Una aplicación Next.js conectada a tu espacio de trabajo con @cmssy/react y @cmssy/next. Consulta la guía de instalación y el quickstart si aún no has desplegado.
• Una cuenta de hosting — Donde hayas desplegado tu sitio (p. ej., Vercel). Los dominios personalizados y el SSL se gestionan allí.
• Un dominio registrado en cualquier registrador — Puedes usar Cloudflare Registrar (precios a coste), Namecheap, Porkbun o cualquier otro registrador de dominios.

Paso 1: Despliega tu sitio headless

Antes de conectar un dominio, asegúrate de que tu sitio está construido y desplegado:

1. Construye tu aplicación Next.js con bloques de Cmssy usando @cmssy/react y @cmssy/next.
2. Despliégala en tu hosting (por ejemplo, haz push a un repositorio Git conectado a Vercel).
3. Confirma que el despliegue está en vivo en su URL por defecto (p. ej., your-site.vercel.app).

Esta aplicación desplegada es a la que apuntará tu dominio personalizado.

Paso 2: Añade tu dominio en tu hosting

En el panel de tu proveedor de hosting (Vercel como ejemplo):

1. Abre tu proyecto y ve a Settings → Domains.
2. Haz clic en Add e introduce tu nombre de dominio, por ejemplo: example.com.
3. Añade también la variante www si la quieres: www.example.com.

Tu hosting mostrará entonces los registros DNS exactos que necesitas configurar en el siguiente paso.

Paso 3: Configura los registros DNS

Ve al panel de gestión de DNS de tu registrador de dominios y añade los registros que te dio tu hosting. Para Vercel, suelen verse así:

El registro CNAME de www apunta tu subdominio www a tu hosting. El registro A del dominio raíz (@) apunta el apex a la IP de tu hosting. Usa siempre los valores exactos que muestra el panel de tu hosting — pueden variar entre proveedores y con el tiempo.

Paso 4: Verifica el dominio

Después de añadir los registros DNS:

1. Vuelve a la sección Domains del panel de tu hosting.
2. Tu hosting comprueba los registros automáticamente y marca el dominio como válido en cuanto resuelven.

La propagación del DNS puede tardar hasta 48 horas, pero en la mayoría de los casos se completa en 15–30 minutos. Si el dominio aparece como inválido, espera un poco más y vuelve a comprobar.

Paso 5: Certificado SSL

Una vez que tu dominio resuelve, tu hosting aprovisiona el SSL automáticamente — Cmssy no interviene en este paso:

• Aprovisionamiento SSL automático — Hostings como Vercel emiten un certificado (p. ej., vía Let's Encrypt) para tu dominio.
• HTTPS activado por defecto — Todo el tráfico se redirige automáticamente a HTTPS.
• Sin configuración manual — La renovación del certificado la gestiona tu hosting.

Tu sitio será accesible vía https://yourdomain.com a los pocos minutos de que el dominio resuelva.

Paso 6: Configura la Preview URL de Cmssy

Para que el editor visual enmarque el sitio correcto, apunta Cmssy a tu dominio en vivo:

1. Inicia sesión en tu panel de administración de Cmssy.
2. Ve a Settings → Headless.
3. Configura la Preview URL con tu sitio desplegado (p. ej., https://yourdomain.com).

Ahora el editor de Cmssy carga tu sitio desplegado para la edición visual en contexto, mientras el contenido sigue sirviéndose por la API de entrega.

Proveedores de DNS comunes

Aquí tienes instrucciones breves para los registradores de dominios más populares. En todos los casos, usa los valores exactos que te proporcione tu hosting.

GoDaddy

1. Ve a Mis productos → selecciona tu dominio → DNS.
2. Haz clic en Añadir registro e introduce los registros CNAME y A de tu hosting.
3. Guarda los cambios.

Namecheap

1. Ve a Domain List → haz clic en Manage junto a tu dominio.
2. Selecciona la pestaña Advanced DNS.
3. Añade los registros CNAME y A.
4. Guarda todos los cambios.

Cloudflare

1. Selecciona tu dominio en el panel de Cloudflare.
2. Ve a DNS → Records.
3. Añade el registro CNAME en modo DNS only (icono de nube gris — sin proxy).
4. Añade el registro A.

Porkbun

1. Ve a Account → Domain Management → selecciona tu dominio.
2. Abre el editor de DNS Records.
3. Añade los registros CNAME y A.
4. Guarda.

Solución de problemas

El dominio no resuelve

• Comprueba la propagación del DNS — Usa herramientas como dig o nslookup en tu terminal, u online como whatsmydns.net, para confirmar que tus registros se han propagado.
• Confirma que los valores coinciden con tu hosting — Revisa los valores CNAME/A contra lo que muestra el panel Domains de tu hosting.
• Espera más — La propagación puede tardar hasta 48 horas en casos raros. Ten paciencia.

Problemas con el SSL

• Proxy CDN en conflicto — Si usas Cloudflare en modo proxy, puede entrar en conflicto con el aprovisionamiento SSL de tu hosting. Cambia al modo DNS only para que tu hosting pueda emitir el certificado.

WWW vs dominio raíz

• Tanto www.example.com como example.com deben estar configurados en tu hosting. Añade tanto el CNAME (para www) como el registro A (para la raíz) para que los visitantes lleguen a tu sitio usen la URL que usen.

El editor muestra el sitio equivocado

• Si el editor de Cmssy enmarca una URL antigua o por defecto, actualiza la Preview URL en Settings → Headless con tu dominio en vivo.

Buenas prácticas

• Configura siempre www y la raíz — Así los visitantes pueden acceder a tu sitio desde cualquiera de las dos variantes de URL.
• Configura el email por separado — El email con dominio personalizado (p. ej., vía Google Workspace o Zoho) requiere registros MX separados y no entrará en conflicto con los registros DNS que apuntan tu sitio a tu hosting.
• Usa el modo DNS only si usas Cloudflare — El modo proxy de Cloudflare puede interferir con los certificados SSL de tu hosting. Usa la nube gris (DNS only) para los registros que apuntan a tu hosting.
• Mantén la Preview URL sincronizada — Siempre que cambie tu dominio de producción, actualiza la Preview URL en Settings → Headless para que el editor siga enmarcando el sitio correcto.