Con entrambe le versioni, tema e plugin, Divi è uno dei modi più popolari e flessibili per costruire un sito WordPress. Ma mentre Divi ti offre un'enorme flessibilità di progettazione, non esiste un modo integrato per tradurre i siti Divi, ed è per questo che probabilmente stai leggendo questo post.
In questo tutorial imparerai come tradurre un sito Divi utilizzando la versione gratuita del plugin TranslatePress.
Se c'è una cosa Dividi gli utenti adorano, è il suo design visivo, e TranslatePress trasferisce lo stesso approccio visivo alla creazione di un sito multilingue con Divi.
Alla fine di questo post, sarai in grado di utilizzare un'interfaccia visiva per tradurre tutti i tuoi contenuti Divi, incluse immagini, moduli, pulsanti e altro ancora, semplicemente puntando e facendo clic su un'anteprima live del tuo sito:
Pronto a imparare come tradurre qualsiasi sito web Divi? Mettiamoci al lavoro…
Questo metodo funzionerà sia per la versione tema che per la versione plugin di Divi.
Come tradurre i siti Divi con TranslatePress: guida passo dopo passo
Ecco una panoramica generale del processo di creazione di un sito multilingue con Divi:
- Progetta i tuoi contenuti utilizzando il Divi Builder
- Configurare le impostazioni di base di TranslatePress
- Utilizza l'interfaccia dell'editor di traduzione visiva "TranslatePress"
- Aggiungi un frontend selettore di lingua al tuo sito Divi multilingue
Crea i tuoi contenuti con Divi
Divi è disponibile sia in versione tema sia in versione plugin per il Divi Page Builder. In entrambi i casi, potrai utilizzare un'interfaccia visiva drag-and-drop per progettare i tuoi contenuti. Oppure, puoi anche usare un'interfaccia backend astratta se preferisci questo approccio.
Per iniziare, usa Divi per creare tutti i contenuti che desideri utilizzare sul tuo sito. Non preoccuparti della lingua in questo momento, crea semplicemente i contenuti nella lingua che desideri sia quella predefinita del tuo sito.
Per questo tutorial, sceglieremo uno dei tanti layout predefiniti di Divi, poiché fornirà molti contenuti di esempio da tradurre. Puoi anche creare i tuoi contenuti da zero, è totalmente a tua discrezione:
Divi è dotato di oltre duemila template predefiniti, oltre a 342 “Layout Pack” dedicati, che sono fondamentalmente un set di template a tema per una specifica nicchia di siti web.
Dopo aver importato il modello di homepage da uno dei pacchetti di layout per siti web di servizi elettrici e averlo un po' personalizzato, ecco come appare il nostro sito Divi:
Sentiti libero di personalizzare qualsiasi contenuto e di riorganizzarlo secondo le tue esigenze utilizzando l'interfaccia drag-and-drop di Divi: indipendentemente dagli elementi che aggiungi con Divi, potrai tradurre tutto con TranslatePress nei passaggi successivi.
Puoi modificare qualsiasi testo, cambiare lo stile, aggiungere moduli, slider, ecc. Sii creativo!
2. Configurazione delle impostazioni di base TranslatePress
Una volta completati i contenuti in Divi, sei pronto per tradurli con TranslatePress.
Prima di fare ciò, tuttavia, devi eseguire alcuni passaggi di base per la manutenzione, come scegliere quali lingue vuoi offrire il tuo contenuto Divi in.
Per iniziare, installa e attiva il plugin gratuito TranslatePress. Una volta attivato il plugin, vai su Impostazioni → TranslatePress per configurare le impostazioni di base.
La tua prima scelta è quali lingue utilizzare sul tuo sito. Usa le Lingua predefinita menu a tendina per scegliere la lingua in cui esiste attualmente il tuo sito (ad esempio Inglese) Poi, usa il Tutte le lingue sezione per aggiungere quante lingue nuove si desideri.
La versione gratuita di TranslatePress consente di aggiungere una lingua in più, ma puoi aggiornare alla versione a pagamento per tradurre i tuoi contenuti Divi in lingue illimitate:
Un'altra scelta importante qui è se utilizzare o meno la traduzione automatica, che puoi configurare da Traduzione Automatica scheda.
Se vuoi risparmiare tempo, puoi usare il API Google Translate per tradurre automaticamente 100% dei contenuti del tuo sito, compresi tutti i contenuti Divi. Successivamente, potrai tornare indietro e perfezionare manualmente le traduzioni dove necessario:
La versione premium di TranslatePress aggiunge inoltre il supporto per il Traduzione automatica DeepL servizio.
Sentiti libero di controllare le altre impostazioni, poiché potresti trovare qualcosa di pertinente al tuo sito Divi. Quindi, una volta salvate le modifiche, sei pronto per iniziare a tradurre i contenuti di Divi.
3. Utilizzare l'editor visivo TranslatePress per tradurre i siti Divi
Per tradurre il tuo sito Divi, utilizzerai l'editor di traduzione visivo front-end di TranslatePress.
Per accedere a questo editor, apri la pagina Divi che desideri tradurre sul front-end del tuo sito. Quindi, fai clic su Traduci pagina pulsante sulla barra degli strumenti di WordPress:
Si aprirà così l'editor di traduzione visiva, che ti consentirà di tradurre 100% dei contenuti del tuo sito.
Per tradurre un contenuto specifico, basta passarci sopra il mouse e fare clic sull'icona a forma di matita blu o verde. Si aprirà la traduzione per quel contenuto nella barra laterale, dove potrai apportare le tue modifiche:
Non appena salverai la tua traduzione, il testo tradotto apparirà nell'editor in tempo reale quando visualizzerai quella lingua, il che ti permetterà di assicurarti che il layout del tuo sito continui a essere ottimale.
Per spostarti rapidamente tra diverse traduzioni, puoi utilizzare le scorciatoie da tastiera di "TranslatePress".
La cosa potente di questo approccio è che puoi usarlo per tutto del contenuto del tuo sito, comprese immagini, collegamenti dei pulsanti, elementi del menu, popupTutto!
Proviamo con alcuni esempi...
Tradurre pulsanti/link in Divi
Come hai visto sopra, il nostro sito Divi contiene due pulsanti/collegamenti:
- Pulsante di invio – porta a una pagina interna che mostra un messaggio di successo.
- Prenota una chiamata – porta i visitatori su un sito web di terze parti per fissare un appuntamento (Google Calendar).
Per tradurre un pulsante, basta passarci sopra il mouse e fare clic sull'icona della matita blu.
Ciò che è diverso, però, è che puoi tradurre entrambi il testo del pulsante e il link del pulsante. Per il nostro esempio di sito elettrico, ciò significa che puoi inviare i visitatori di lingua spagnola direttamente alla versione spagnola di Google Calendar:
TranslatePress modificherà automaticamente i link interni in modo che rimandino alla versione nella lingua corretta: non è necessario modificare manualmente i link interni.
Tradurre Elementi del Menu, Widget, Piè di pagina, ecc. di Divi.
TranslatePress non si limita ai contenuti dentro il Divi Builder – ti permette anche di tradurre i contenuti del tema Divi (o di qualsiasi altro tema WordPress). Questo include il tuo menu di navigazione e qualsiasi widget che stai utilizzando nella tua barra laterale o nel piè di pagina. Rileva anche e ti permette di modifica/traduci stringhe gettext aggiunto dal tema Divi o dal plugin del page builder.
Una volta tradotto il testo una volta, TranslatePress utilizzerà automaticamente quella traduzione in tutto il sito:
Traduzione di immagini
Oltre ai contenuti testuali, TranslatePress ti permette anche di “immagini di traduzione. Ovvero, puoi usare immagini diverse a seconda della lingua in cui un visitatore sta navigando.
Ad esempio, puoi usare un logo diverso per lingue diverse. Oppure, puoi tradurre un'immagine utilizzata nei tuoi contenuti per una migliore localizzazione.
Per tradurre un'immagine, puoi usare lo stesso approccio: passa il cursore sopra di essa e fai clic sull'icona della matita blu. Quindi, puoi usare la barra laterale per scegliere una nuova immagine dalla tua libreria multimediale di WordPress o inserire l'URL di un'immagine esterna.
Ecco come appare la traduzione del logo nel tema Divi:
E funziona allo stesso modo per le immagini nel tuo contenuto, o anche immagini in uno slider che hai creato con il modulo slider di Divi:
Traduzione di Moduli
Infine, diamo un'occhiata a un altro esempio specifico che è rilevante quando crei un sito multilingua con Divi: i tuoi moduli.
Quasi ogni singolo sito web Divi farà uso del modulo di contatto di Divi o dei moduli di iscrizione via email, quindi la traduzione di questi moduli è una considerazione importante quando si traduce un sito Divi.
Come probabilmente avrete già intuito, TranslatePress vi permette di utilizzare lo stesso approccio “punta e clicca” per traduci i tuoi moduli, anche.
Puoi persino tradurre il testo segnaposto che appare dentro campi del modulo:
Ed ecco fatto! Che si tratti di tradurre testi, pulsanti, link, voci di menu, widget o qualsiasi altra cosa, tradurre il tuo sito Divi è semplicissimo: basta puntare e cliccare con TranslatePress.
4. Configurazione del frontend selettore di lingua
Per impostazione predefinita, TranslatePress aggiunge un valore in virgola mobile cambio lingua nell'angolo in basso a destra del tuo sito, che probabilmente hai visto negli screenshot di esempio qui sopra.
Tuttavia, se desideri modificare tale comportamento predefinito, TranslatePress ti offre anche un paio di altre opzioni per decidere dove inserire il selettore di lingua nel tuo sito web Divi multilingue.
Un'opzione è aggiungerla come voce di menu di navigazione, cosa che puoi fare aggiungendo la Cambio lingua elementi di menuAspetto → Menu):
Ecco come si presenta sul front-end del tuo sito:
È inoltre possibile visualizzare un selettore di lingua con il
Crea oggi stesso un sito multilingue con Divi
Divi ti dà il potere di costruire un bel sito WordPress con un editor visivo drag-and-drop.
Inoltre, TranslatePress ti permette di prendere quel bellissimo design e di tradurlo in nuove lingue grazie a un'esperienza di traduzione visiva altrettanto semplice.
Quando combini le due cose, puoi costruire davvero personalizzato Siti WordPress accessibili ai visitatori da tutto il mondo.
Tutto ciò che hai visto sopra può essere fatto con il versione gratuita di TranslatePress su WordPress.org. Per una maggiore flessibilità, però, puoi considerare passaggio alla versione premium di TranslatePress, che offre…
- Supporto per campi dinamiciottimo se stai usando Funzionalità di contenuti dinamici di Divi)
- Supporto più dettagliato per SEO multilingue
- Supporto per un numero illimitato di lingue di traduzione
- Integrazione con DeepL per la traduzione automatica
- Account di traduttore dedicati
- La possibilità di navigare sul tuo sito come diversi ruoli utente (ottimo per siti con contenuti limitati)
Per saperne di più sulle funzionalità premium, vai alla pagina dei prezzi.