In questo tutorial, imparerai come creare un sito multilingue con Stitched e WPML. Stitched è un tema per artigiani; puoi usare il componente introduttivo della sua homepage per parlare di te ai tuoi visitatori e puoi estenderne le funzionalità installando i plugin consigliati che possono essere integrati.
Stitched è sviluppato da WooThemes. Per i temi e i plugin sviluppati da WooThemes, ti consigliamo di usare l'interfaccia integrata di WPML per la traduzione delle funzionalità speciali che WooThemes e i plugin usano nel loro codice. In questo tutorial, ti guiderò passo dopo passo per farlo in modo semplice.
Puoi vedere un esempio dal vivo nel sito demo di Stitched + WPML.
Per gestire un sito multilingue con Stitched e WPML, avrai bisogno di:
- Tema Stitched
- Una versione recente di WPML, inclusi i moduli Traduzione stringhe e Gestione traduzioni
Primi passi
Questi sono i passaggi principali da seguire per iniziare:
- Installa e attiva Stitched
- Installa e attiva i plugin di WPML (WPML Multilingual CMS, WPML Traduzione stringhe, WPML Gestione traduzioni)
- Configura WPML da WPML->Lingue. Consulta la nostra Guida introduttiva a WPML per un riferimento completo
- Installa e attiva uno dei numerosi plugin che possono essere integrati con Stitched; per lo scopo di questo tutorial useremo Projects
Tradurre il messaggio introduttivo
La funzionalità “Introductory Message” (Messaggio introduttivo) del tema Stitched è una combinazione dell'immagine Gravatar dell'amministratore del sito e del testo del motto del sito. Con WPML, qualsiasi testo (o stringa, come ci piace chiamarla qui) che non fa parte di articoli, pagine e tassonomie viene tradotto usando il modulo Traduzione stringhe.
Il testo per questo elemento è impostato in Impostazioni > Generali
E ora, per tradurre, ti basta andare su WPML->Traduzione stringhe e cercare quella stringa,
tradurla, contrassegnarla come completata e salvare
Ecco come appare ora il nostro front-end, inclusa l'immagine Gravatar che il tema recupera automaticamente in base alle tue impostazioni
Tradurre i testi generali
Stitched include alcune altre stringhe che potresti voler tradurre. Puoi completare le traduzioni mancanti usando il modulo Traduzione stringhe di WPML, come ho descritto per il “Messaggio introduttivo”. Se mancano alcune stringhe, segui le istruzioni per la Localizzazione di temi e plugin. In breve, vai su WPML->Localizzazione di temi e plugin e fai clic su “Scansiona il tema per trovare le stringhe”. Nota che puoi filtrare facilmente le stringhe corrette nel menu a discesa del contesto: per Stitched filtra per “theme woothemes” e per il plugin Projects filtra per “plugin projects-by-woothemes”. L'aspetto sarà simile a questo:
Tradurre i plugin integrati
Ora che abbiamo visto come tradurre tutto il testo proveniente dal tema, vediamo come rendere traducibili anche le stringhe e le funzionalità provenienti da un plugin Woo. Per lo scopo di questo tutorial, ho scelto l'ottimo plugin consigliato per l'uso con Stitched: “Projects by WooThemes”.
Dopo aver installato e attivato “Projects”, potrai vedere nell'area di amministrazione di WordPress un nuovo menu chiamato esattamente così... “Projects”, come mostrato qui:
Per rendere traducibili i tuoi progetti e le relative categorie usi le impostazioni di WPML (l'interfaccia utente di WPML); in pratica, quello che devi fare è andare su WPML->Gestione traduzioni in questo modo
Scegli Configurazione del contenuto multilingue dalle schede in alto
Prima di continuare, spendiamo due parole su ciò che sta effettivamente accadendo in background: il plugin Projects, come molti altri plugin (e temi), usa i tipi di post personalizzati per le sue funzionalità. Si tratta di una sorta di articoli “speciali”; e proprio perché sono speciali, WPML non “sa” che devono essere tradotti. Quindi, il nostro prossimo passo è dire a WPML esattamente questo: tradurre Projects!
Fai clic su Tipi di post personalizzati, scegli Traduci per Projects. Come puoi vedere, puoi anche impostare gli slug di Projects in modo che siano traducibili e, subito sotto, puoi tradurre le Tassonomie personalizzate relative a questi post personalizzati, in questo caso chiamate “Project categories”. Ora ti basta fare clic su Salva e il gioco è fatto. Allo stesso modo, puoi controllare come vengono gestiti i campi personalizzati per la traduzione facendo clic sul link Traduzione dei campi personalizzati in alto. Per Projects puoi impostare 3 campi personalizzati: _client, _project_image_gallery e _url, ma per questi ti consiglio di seguire il punto successivo -
Vediamo come appare la pagina di amministrazione di Projects: facciamo clic su “Projects” nella schermata di amministrazione e ora, come in qualsiasi pagina o articolo “normale”, possiamo duplicare o tradurre qualsiasi progetto esistente, crearne uno nuovo in qualsiasi lingua desideriamo e, cosa molto importante, usare tutte le funzionalità del tipo di post Project. In questo caso possiamo aggiungere Dettagli, Descrizione e la galleria speciale che ci offre, in questo modo:
Rendere i campi personalizzati (e altri elementi) traducibili nella pagina di modifica del post personalizzato
L'ultimo punto qui: come avrai probabilmente notato nell'ultima schermata, puoi anche controllare come i Campi personalizzati e persino le tassonomie e i tipi di post vengono gestiti per la traduzione in ogni pagina di modifica di un articolo. Ingrandiamola un po':
Qui vogliamo che _project_image_gallery venga copiato tra le lingue, mentre ho ritenuto sensato lasciare non tradotti i campi _client e _url: puoi comunque modificarli nella pagina del post tradotto, ma non abbiamo davvero bisogno che vengano tradotti.
Modificare lo stile del selettore di lingua
Ultimo ma non meno importante, facciamo una piccola modifica per avere il selettore di lingua di WPML perfettamente integrato nella navigazione principale di Stitched. Il selettore di lingua di WPML ha delle classi aggiunte che possono essere modificate in base alle tue esigenze; se vuoi, puoi persino creare un intero selettore di lingua personalizzato. Qui non è necessario: tutto ciò che vogliamo è dare un po' di padding alla bandiera in modo che “sieda” al suo posto e non sembri fuori posto
Per farlo andiamo su WPML->Lingue->Opzioni del selettore di lingua->CSS aggiuntivo (opzionale) e aggiungiamo un po' di padding alla classe che controlla lo stile dell'immagine della bandiera del selettore: img.iclflag
Ora ha un bell'aspetto, proprio come qualsiasi altra voce di menu di Stitched
Conclusione
Stitched è un ottimo tema per diventare multilingue e parlare al mondo di te e dei tuoi progetti; puoi anche aggiungervi un negozio usando WooCommerce e WPML Multilingual & Multicurrency for WooCommerce. Abbiamo visto come puoi regolarne facilmente le funzionalità usando WPML.
Versioni usate
- WordPress 3.9
- WPML 3.1.5
- Tema Stitched 1.0.2
- Plugin Projects 1.2.0
