Il "Language Switcher" è il ponte dell'utente verso la tua infrastruttura localizzata. MultiLipi supporta due metodi di iniezione distinti per bilanciare la facilità di implementazione con l'integrità del progetto. Puoi implementarlo come un persistente Floating Overlay (ideale per il lancio rapido) oppure come Elemento Embedded profondamente integrato (ideale per design personalizzato).
Questa guida dettaglia i passaggi di navigazione e le differenze tecniche tra entrambe le strategie.
1. Protocollo di Configurazione (Navigazione)
Accesso ai controlli dell'interfaccia.
Per configurare la strategia di posizionamento, segui questo percorso nel tuo centro di comando:
Passo 1: Accedi al Dashboard
Accedi al tuo account MultiLipi per accedere alla visualizzazione Home.
Passo 2: Seleziona il progetto
Clicca sulla Tessera Progetto specifica per il sito web che desideri configurare.
Passo 3: Accesso alle impostazioni
Nella barra laterale sinistra, clicca su Impostazioni.
Passo 4: Localizzare il modulo
Dal sottomenu o dalla lista delle impostazioni, seleziona Language Switcher.
Azione:
Qui vedrai l'opzione per alternare tra modalità Fluttuante e Embedded.
2. Il commutatore fluttuante (modalità sovrapposizione)
Dispiegamento rapido tramite iniezione JS.
Cos'è?
Il Floating Switcher è un widget autonomo iniettato nel DOM tramite JavaScript. Si trova sull'asse Z sopra i contenuti del tuo sito web, ancorato a un angolo della finestra panoramica.
Posizionamento: Configurabile a uno qualsiasi dei quattro quadranti:
- • Basso a sinistra (predefinito) / Basso a destra
- • Alto a sinistra / Alto a destra
Vantaggio architettonico:
- • Zero codice: Nessuna modifica HTML necessaria. Funziona immediatamente dopo l'iniezione della sceneggiatura.
- • Compatibilità universale: Garantito per renderizzare su qualsiasi piattaforma (WordPress, Shopify, Webflow) senza interrompere i flussi di layout.
- • Mobile Responsive: Scala e riposiziona automaticamente per viewport più piccoli.
Ideale per: Team che hanno bisogno di una soluzione "Plug-and-Play" senza coinvolgere uno sviluppatore frontend.
3. Il Switcher Embedded (Modalità di Integrazione)
Inserimento DOM senza soluzione di continuità.
Cos'è?
L'Embedded Switcher ti permette di inserire il toggle della lingua direttamente in un contenitore specifico all'interno della tua struttura HTML, come la barra di navigazione (<nav>) o il piè di pagina.</nav>
Il meccanismo: Fornisci un specifico CSS Selector (ID o Classe) nella dashboard di MultiLipi.
Esempio di input: #menu-language-item o .navbar-right.
L'azione: Il nostro script scansiona il DOM per quel selezionatore specifico e renderizza il switcher all'interno di quell'elemento, ereditando i vincoli di layout del suo genitore.
Ideale per: Designer che richiedono un controllo pixel-perfect e vogliono che il switcher sembri una parte nativa del sistema di menu UI.
4. Il protocollo di failover (logica di sicurezza)
Garantire la disponibilità dell'interfaccia.
Negli ambienti web dinamici, ID e Classi possono cambiare. Cosa succede se distribuisci uno Switcher Embedded che mira #nav-lang, ma il tuo sviluppatore rinomina accidentalmente quell'ID in #nav-menu?
MultiLipi esegue un failover automatico:
- • Scansione: Lo script tenta di localizzare il selettore CSS target.
- • Fallimento: Se il target non viene trovato (nullo), lo script segnala un errore.
- • Recupero: Torna automaticamente alla modalità fluttuante.
- • Risultato: il switcher appare nella posizione mobile predefinita (ad esempio, in basso a destra), assicurando che l'utente possa comunque cambiare lingua, anche se il layout è rotto.
- • Debug: viene registrato un avviso sulla console per permettere ai tuoi sviluppatori di correggere il selettore.