Ihre Astro-Website ist schnell, Ihr Code ist sauber und Ihre Seiten sind genau dort, wo Sie sie haben möchten. Stellen Sie sich nun vor, Sie bieten Besuchern in Spanisch, Französisch, Japanisch und über 100 weiteren Sprachen das gleiche Erlebnis, ohne für jede einzelne eine separate Website erstellen zu müssen.
Das bringen wir zu Astro.
Lernen Sie Universally für Astro kennen, unser erstes SDK, das für ein JavaScript-Framework entwickelt wurde.
Es bringt KI-gestützte Übersetzung direkt in Ihr Astro-Projekt, sodass Sie mehrsprachige Seiten aus Ihrer bestehenden Codebasis auf Ihrer eigenen Domain mit serverseitig gerendertem HTML bereitstellen können.
Keine doppelten Seitenordner. Keine weitläufigen Übersetzungsdateien, die gepflegt werden müssen. Nur die Seiten, die Sie bereits erstellen, bereit für ein globales Publikum.
Und die Einrichtung dauert nur ein paar Zeilen Code.
Ein Seitensatz für jede Sprache
Mit Universally für Astro erstellen Sie keine zweite Website. Sie schreiben weiterhin Seiten, wie Sie es bereits tun.
Mit Universally für Astro behalten Sie Ihre vorhandenen .astro-Dateien und stellen jede Sprache unter ihrer eigenen URL bereit. Ihre Seite /about kann also zu /fr/about, /es/about und mehr werden, ohne die Seite selbst zu duplizieren.
Alles, was Sie tun müssen, ist, Ihren sichtbaren Text in t() und Ihre internen Links in href() zu verpacken, die beide aus Astro.locals stammen:
---
const { t, href } = Astro.locals;
---
<h1>{t('Plan your next trip')}</h1>
<p>{t('Find flights, hotels, and tours in one place.')}</p>
<a href={href('/pricing')}>{t('See pricing')}</a>Auf Ihren Seiten in der Quellsprache gibt t() Ihren Originaltext unverändert zurück. Auf einer übersetzten Seite gibt es die Übersetzung zurück, und href() fügt das richtige Sprachpräfix hinzu, damit Besucher beim Klicken durch die Seite in ihrer Sprache bleiben.
Müssen Sie eine Formulierung ändern? Öffnen Sie die Zeichenfolge in Ihrem Universally-Dashboard und bearbeiten Sie sie dort. Ihre Glossarregeln gelten ebenfalls, sodass Markennamen und Produktbegriffe in jeder Sprache so erscheinen, wie Sie es wünschen.
Alle Optionen finden Sie in unserem Leitfaden zum Übersetzen von Seiten in Astro.
Die Einrichtung dauert ein paar Zeilen, keine Neufassung
Die Einrichtung ähnelt stark dem Hinzufügen einer beliebigen anderen Astro-Integration.
Erstellen Sie zuerst ein neues Projekt in Ihrem Universally-Dashboard, wählen Sie Astro als Technologie und wählen Sie SDK auf dem Bildschirm mit den Einrichtungsanweisungen.
Installieren Sie als Nächstes das Paket:
npm install @universally-sdk/astroEs funktioniert auch mit pnpm, yarn und bun.
Fügen Sie von hier aus den API-Schlüssel Ihres Projekts zu .env als UNIVERSALLY_API_KEY hinzu und registrieren Sie dann die Integration in astro.config.mjs.
Und es wird ungefähr so aussehen:
import { defineConfig } from 'astro/config';
import node from '@astrojs/node';
import universally from '@universally-sdk/astro';
export default defineConfig({
site: 'https://example.com',
output: 'server',
adapter: node({ mode: 'standalone' }),
integrations: [universally()],
});Fügen Sie schließlich <UniversallyHead /> in den <head> Ihres Layouts ein. Es fügt hreflang-Links und den Sprachumschalter hinzu, sodass nichts weiter verbunden werden muss.
Das ist alles! Fügen Sie eine Zielsprache in Ihrem Dashboard hinzu, starten Sie Ihren Entwicklungsserver neu und öffnen Sie /fr/about, um Ihre Seite auf Französisch zu sehen.
Universally für Astro funktioniert mit Astro 5 oder neuer, sowohl für serverseitig gerenderte als auch für statische Websites. Die vollständige Anleitung finden Sie in unserem Leitfaden zur Installation der Astro-Integration.
Ihre Seiten warten nie auf eine Übersetzung
Das Hinzufügen von Sprachen zu einer Website sollte sie nicht verlangsamen. Wir haben das SDK darauf ausgelegt.
Wenn Ihr Server oder Build startet, lädt Universally Ihre Übersetzungen in den Speicher. Jeder t()-Aufruf ist eine schnelle In-Memory-Abfrage, sodass kein Besucher jemals auf eine Übersetzungsanfrage warten muss.
Das Hinzufügen neuer Inhalte funktioniert genauso. Wenn Sie eine Seite mit neuem Text veröffentlichen, sieht der erste Besucher Ihre ursprüngliche Formulierung, während Universally die neuen Zeichenfolgen im Hintergrund übersetzt. Die übersetzte Version erscheint normalerweise bei einem späteren Rendern innerhalb von ein oder zwei Sekunden.
Bearbeitungen, die Sie im Dashboard vornehmen, erreichen Ihre Live-Website über einen signierten Push, und Ihr Server prüft standardmäßig alle 60 Sekunden auf Änderungen. Führen Sie eine statische Website aus? Ihre Übersetzungen werden zur Build-Zeit integriert, und ein schneller Rebuild erfasst alles Neue.
Unser Leitfaden für Übersetzungsaktualisierungen beschreibt genau, wie dies bei jeder Einrichtung funktioniert.
Sie liefern weiter aus. Ihre Übersetzungen folgen mit.
Bereit, Ihre Astro-Website global zu machen?
Wenn Sie das nächste Mal jemanden nach einer spanischen Version fragen, müssen Sie keine Ordner kopieren oder einen Stapel Übersetzungs-Keys verwalten.
Universally für Astro ist jetzt in der Betaversion verfügbar!
Installieren Sie das Paket, umschließen Sie Ihren Text mit t() und begrüßen Sie Besucher in über 110 Sprachen.
Starten Sie kostenlos mit Universally!
Da dies unser erstes Framework-SDK ist, wird Ihr Feedback bestimmen, wohin es als Nächstes geht. Bauen Sie etwas damit? Sagen Sie uns, was funktioniert, melden Sie einen Fehler oder schlagen Sie eine Funktion über unsere Kontaktseite vor.
Kommentar hinzufügen