Traduire automatiquement le contenu statique de l'interface utilisateur

Écrivez le texte statique normal dans les composants serveur. Altified détecte le texte sécurisé lors de la compilation de Next.js et le résout pour la langue sélectionnée par le proxy.

src/app/page.jsx

export default function WelcomePage() { return ( <main> <Hero Eyebrow="Nouvelles offres" title="Bienvenue sur notre site web" description="Découvrez nos derniers produits" /> <input placeholder="Rechercher toutes les offres..." aria-label="Rechercher les offres" /> <img src="/logo.png" alt="Logo Altified" /> </main> ); }

Aucune importation de traduction n'est requise pour les copies statiques ordinaires dans les composants serveur. Altified enregistre la copie, la résout pour la langue actuelle et revient au texte original si une traduction ou le service est indisponible.

Literal JSX text translates in any tag, including headings, paragraphs, buttons, and spans.
Common copy props on custom components translate, including title, description, label, eyebrow, subtitle, caption, placeholder, and aria-label.
Safe DOM attributes translate in Server Components: alt, title, aria-label, and placeholder.
Static metadata and browser titles are handled by the metadata integration in the SEO step.
Visit each configured locale route to register and resolve newly discovered copy.

Altified évite délibérément les valeurs susceptibles de perturber le fonctionnement d'une application si elles sont traduites : href, src, id, className, data-*, les paramètres de route, les slugs et les expressions d'exécution telles que {product.name}.

Composants clients

Fichiers avec "use client" sont également réécrites automatiquement, en utilisant la sécurité du navigateur @altified/next/auto point d'entrée. Vous pouvez toujours utiliser AltifiedClientProvider précharger les traductions depuis le serveur lorsque les en-têtes, les navigations ou les menus doivent rester côté client.