Integración de Astro (beta)
Traduce tu sitio de Astro a más de 110 idiomas
El SDK de Astro de Universally traduce tu sitio desde dentro de tu código. Un árbol de páginas sirve cada idioma bajo su propia URL en tu propio dominio.
Cómo Universally funciona con Astro
Agrega traducciones a tu proyecto de Astro en cuatro pasos.
1. Instala el paquete
Ejecuta npm install @universally-sdk/astro en tu proyecto. pnpm, yarn y bun también funcionan.
2. Agrega tu clave API
Agrega UNIVERSALLY_API_KEY a tu archivo .env. Mantenlo en el servidor y nunca en el código del cliente.
3. Agrega la integración
Agrega universally() a las integraciones en astro.config.mjs y configura tu URL de site.
4. Traduce tus páginas
Usa t() para cadenas de texto y href() para enlaces, y agrega <UniversallyHead /> a tu layout. Cada idioma se sirve en /<lang>/.
Potentes Funciones para Sitios de Astro Multilingües
Todo lo que necesitas para lanzar tu sitio de Astro en cada idioma, desde la misma base de código.
Traducción con IA
Traducción automática con IA
Cada cadena que pasas a t() es traducida por IA que tiene en cuenta su contexto.
- Traducción IA con reconocimiento de contexto
- Más de 110 idiomas
- Edita cadenas en el panel
Optimización SEO
Una URL Real para Cada Idioma
Cada idioma se sirve bajo su propio prefijo /{lang}/ en tu propio dominio. <UniversallyHead /> agrega un enlace hreflang por idioma más x-default, para que los motores de búsqueda puedan encontrar cada versión.
- URLs de idioma como /fr/
- Hreflang para cada idioma
- x-default incluido
SDK para Desarrolladores
Creado para Desarrolladores de Astro
El SDK se integra a Astro como una integración. Envuelves cadenas en t() y enlaces en href(), y Astro renderiza cada idioma desde el mismo árbol de páginas.
- Astro 5 y posteriores
- Compilaciones SSR y estáticas
- Paquete con licencia MIT
Sincronización de Contenido
Nuevas cadenas se traducen automáticamente
Cuando agregas o cambias una cadena, el SDK la reporta después de que se envía la respuesta y la traduce Universally. Hasta que la traducción esté lista, la página muestra el texto fuente.
- Cadenas faltantes reportadas
- Traducido automáticamente
- Sin re-traducción manual
Rendimiento
Ningún visitante espera por una traducción
t() es una búsqueda síncrona en memoria, por lo que las páginas se renderizan sin esperar una solicitud de traducción. Las ediciones del panel llegan a un servidor en ejecución mediante sondeo o mediante un push firmado.
- Búsquedas de cadenas en memoria
- Sin espera de traducción
- Ediciones por sondeo o push
Seguridad
Tu clave API permanece en el servidor
El SDK lee UNIVERSALLY_API_KEY de tu archivo .env en el servidor, por lo que la clave nunca se envía al navegador. Los pushes desde el panel a tu sitio están firmados.
- Clave API del lado del servidor
- Push de revalidación firmado
- Código fuente abierto MIT
Últimos consejos y trucos
Mantente a la vanguardia con información sobre traducciones, estrategias multilingües y tutoriales de localización de Astro para crecer globalmente.
¿Listo para hacer tu sitio web Astro multilingüe?
Traduce tu sitio web Astro, sirve cada idioma en su propia URL y alcanza audiencias globales con la plataforma de traducción rápida y fácil de Universally.
Garantía de devolución de dinero de 14 días
No se requiere tarjeta de crédito
Cancela en cualquier momento
Preguntas frecuentes
Obtén respuestas a las preguntas más comunes sobre el uso de Universally para crear sitios web multilingües que realmente conviertan visitantes internacionales.
¿Qué versiones de Astro y modos de salida son compatibles?
El SDK requiere Astro 5 o posterior. Funciona con renderizado del lado del servidor, que necesita un adaptador de Astro como @astrojs/node, y con compilaciones estáticas.
En una compilación estática, la traducción ocurre en el momento de la compilación. Cuando la compilación encuentra cadenas sin traducción, registra cuántas cadenas nuevas se tradujeron y te pide que recompiles para incluirlas.
¿Cómo se ve la configuración en el código?
Importas universally desde @universally-sdk/astro y agregas universally() a la lista de integraciones en astro.config.mjs. También configuras la opción site a tu URL de producción y colocas UNIVERSALLY_API_KEY en tu archivo .env.
En tus páginas, envuelve el texto en t() y los enlaces internos en href(), y coloca <UniversallyHead /> en el head de tu layout.
¿Universally ralentizará mi sitio Astro?
No. t() es una búsqueda síncrona en memoria, por lo que ningún visitante espera por una solicitud de traducción. Las cadenas sin traducción se reportan después de que se envía la respuesta, y la primera renderización muestra el texto fuente.
¿Cómo maneja el SDK el SEO multilingüe?
Cada idioma obtiene su propio prefijo de URL /{lang}/ en tu propio dominio. <UniversallyHead /> agrega un <link rel="alternate" hreflang> por idioma más x-default. Las propias slugs de URL no se traducen.
¿Cómo llegan las ediciones del panel a mi sitio?
Un servidor en ejecución sondea los cambios, cada 60 segundos por defecto. También puedes enviar un push firmado a /_universally/revalidate para que las ediciones aparezcan de inmediato.
La excepción es un idioma recién agregado: necesita un reinicio del servidor o una recompilación antes de que aparezca en tu sitio.
¿Puedo usar t() dentro de islas del lado del cliente?
Todavía no. t() se ejecuta en el servidor, así que traduce las cadenas en el componente de Astro y pásalas a la isla como props.
¿Qué tan precisa es la traducción de IA?
La IA tiene conocimiento del contexto, por lo que cada cadena se traduce teniendo en cuenta el texto que la rodea. Puedes editar cualquier cadena en el panel de control, y el Glosario y las Reglas de Traducción impulsados por IA fijan los nombres de marca y los términos de la industria.
¿Puedo usar el SDK con subdominios de idioma Universally?
Sí. Establece universally({ mode: 'proxy' }) cuando tus idiomas se sirvan en subdominios de idioma Universally. En modo proxy, el paquete solo agrega los enlaces hreflang y el selector de idioma.