Pubblica il selettore di lingua

Aprire Selettore di lingua nella dashboard del progetto. Attivalo, scegli le lingue disponibili, ordinale, configura le etichette e la visualizzazione su dispositivi mobili, quindi pubblica la configurazione.

• Imposta la lingua sorgente del progetto come predefinita per il routing.
• Scegli se nascondere le impostazioni locali predefinite dall'URL.
• Abilita solo le lingue disponibili per i visitatori.
• Scegliere se il passaggio al nuovo percorso deve preservare il percorso corrente.
• Visualizza in anteprima lo strumento di commutazione, quindi pubblicalo.

L'inizializzatore crea un proxy Altified più un wrapper di routing Next.js radice. Il proxy legge la configurazione pubblicata, riscrive le richieste con prefisso locale alle pagine App Router esistenti, e invia le impostazioni locali selezionate ai componenti del server nel x-altified-locale intestazione della richiesta.

import { createAltifiedProxy } from "@altified/next/proxy";

export const proxy = createAltifiedProxy({
  projectId: process.env.ALTIFIED_PROJECT_ID,
});

Next.js 16 chiama questa funzionalità Proxy. L'SDK crea anche la radice middleware.js Il wrapper mostrato di seguito è compatibile con le versioni attuali, quindi si consiglia di conservare entrambi i file generati nella stessa posizione.

import { proxy } from "./src/proxy";

export default proxy;

export const config = {
  matcher: ["/((?!api|_next/static|_next/image|favicon.ico|.*\..*).*)"],
};

Non è necessario spostare l'applicazione in un app/[locale] directory. Un percorso come /fr/products/25 è servito internamente dall'esistente /products/25 pagina.

L'inizializzatore non inserisce mai lo switcher nel layout. Aggiungilo esattamente dove desideri, di solito all'interno dell'intestazione o della navigazione. Le relative opzioni si aprono direttamente sotto quel controllo, sia su desktop che su dispositivi mobili:

import { AltifiedLanguageSwitcher } from "@altified/next/switcher";

<AltifiedLanguageSwitcher
  projectId={process.env.ALTIFIED_PROJECT_ID}
  apiUrl={process.env.ALTIFIED_API_URL}
/>

Dopo che un visitatore ha selezionato una lingua, il proxy mantiene tale impostazione locale mentre l'utente segue i normali link interni. Ad esempio, dal francese, un collegamento Next.js a /terms diventa /fr/terms; non è necessario riscrivere ogni Link Referenza.