Traduzir automaticamente o conteúdo estático da interface.

Escreva o conteúdo estático normal nos componentes do servidor. O Altified deteta o texto seguro durante a compilação do Next.js e resolve-o para a localidade selecionada pelo proxy.

src/app/page.jsx

export default function WelcomePage() { return ( <main> <Hero eyebrow="Novas ofertas" title="Bem-vindo ao nosso site" description="Veja os nossos produtos mais recentes" /> <input placeholder="Pesquisar todas as ofertas..." aria-label="Pesquisar ofertas" /> <img src="/logo.png" alt="Altified logo" /> </main> ); }

Não é necessária a importação de traduções para cópias estáticas comuns em componentes de servidor. Altified regista a cópia, resolve-a para a localidade atual e recorre ao texto original se uma tradução ou o serviço não estiverem disponíveis.

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.

A Altified evita deliberadamente valores que possam causar problemas numa aplicação se forem traduzidos: href, src, id, className, data-*, parâmetros de rota, slugs e expressões de tempo de execução, como {product.name}.

Componentes do cliente

Arquivos com "use client" são também reescritas automaticamente, utilizando o formato seguro para os browsers. @altified/next/auto ponto de entrada. Pode ainda usar AltifiedClientProvider Para pré-carregar traduções do servidor quando os cabeçalhos, a navegação ou os menus precisam de permanecer do lado do cliente.