Come rendere il tuo tema multilingue e compatibile con WooCommerce

Matt Mullenweg, co-fondatore di WordPress e CEO di Automattic, è stato intervistato da Josh Janssen, dove ha dichiarato che nel maggio di quest'anno i download non in lingua inglese di WordPress hanno superato per la prima volta i download in inglese.


Questa tendenza continua con WordPress 4.0, che rende i siti di WordPress localizzati molto più facili da installare e mantenere. WordPress 4.0 ora ti dà la possibilità di scaricare WordPress nella lingua che preferisci. Ciò renderà il processo di installazione un gioco da ragazzi per chi non parla inglese. Nelle precedenti versioni di WordPress, l'inglese era l'impostazione predefinita e altre lingue erano considerate come eccezioni. WordPress 4.0 rende tutte le lingue ugualmente accessibili. Questo cambiamento renderà sicuramente WordPress ancora più popolare in tutto il mondo.


L'obiettivo di queste nuove funzionalità in WordPress 4.0 è quello di aumentare il numero di utenti internazionali di WordPress, che in precedenza non erano in grado di utilizzare WordPress a causa delle difficoltà linguistiche. Inoltre, secondo Asia e Pacifico, paesi come la Cina, il Giappone, l'India, la Corea del Sud e l'Indonesia sono proiettati a superare il Nord America nelle vendite di eCommerce business-to-consumer..

Cosa significa per te come sviluppatore di temi o plugin? In primo luogo, significa che il tuo prodotto deve essere pronto per la localizzazione. Tutti i testi devono essere racchiusi nelle chiamate 'gettext', consentendo agli utenti di eseguirlo in altre lingue; tuttavia, l'internazionalizzazione è solo il primo passo. In molti paesi, essere in grado di gestire un sito in una sola lingua è un limite importante. Per diventare veramente globali e sfruttare l'enorme potenziale al di fuori del mercato di lingua inglese, i tuoi prodotti dovrebbero essere pronti per il multilinguismo.


Fortunatamente, con WPML, l'esecuzione di siti multilingue è facile. Descriveremo le migliori sette migliori pratiche da seguire, in modo che i temi e i plug-in funzionino perfettamente su siti multilingue e multilingue. Seguendo queste semplici linee guida e attenendosi alla codifica pulita, i tuoi prodotti possono alimentare siti multilingue.


Come gli utenti finali si traducono e per cosa è necessario essere preparati

Quando sviluppi il tuo tema, è di fondamentale importanza capire come i tuoi utenti finali tradurranno i loro siti. Una volta che ti rendi conto della loro prospettiva, ti renderai conto di ciò che devi fare per rendere pronto il tuo tema multilingue.


Un tema tipico mostra un'intestazione, un piè di pagina, menu, widget, contenuti e i propri elementi personalizzati. Ecco un esempio di un sito WooCommerce, basato su un tema Twentyfourteen modificato:


WPML ti consente di tradurre tutti gli elementi standard di WordPress. Ciò comprende:

  • menu

  • Widget standard

  • Elementi di navigazione

  • Tutti i testi racchiusi nelle chiamate 'gettext'

  • Pubblica contenuti, inclusi campi personalizzati e tassonomia

  • Prodotti

  • Opzioni del tema

  • Immagini e archi a loro correlati


Non è necessario aggiungere nulla nel codice per consentire a tutte queste sezioni di essere tradotte. Assicurati di prestare attenzione ai tuoi elementi personalizzati, in modo che anche gli utenti possano tradurli.


Di seguito è riportata una tabella che riassume in che modo l'utente finale tradurrà elementi del sito standard con WPML. 

Cosa possono tradurre gli utenti finali usando WPML

Traduci l'intestazione usando lo strumento di traduzione delle stringhe di WPML

Dal momento che non fa parte di alcun post, pagina o tassonomia, dobbiamo utilizzare la Traduzione String di WPML per tradurla. Vai a WPML-> String Translation, cerca la stringa dal suo contenuto (il titolo del sito) e tradurre.

 

Tradurre i menu di WordPress

Quando vai su Aspetto> Menu, vedrai i controlli di traduzione del menu di WPML. Ulteriori informazioni sulla traduzione dei menu per vedere come funziona.

Tradurre elementi tematici o plug-in personalizzati

Molti temi o plugin hanno caratteristiche uniche, che memorizzano i testi nel wp_options tavolo. Il Messaggio introduttivo, di Ricorrere fa esattamente questo. Il tema o il plugin salva questi testi nella tabella wp_options e dobbiamo dire a WPML di tradurli. Aggiungiamo queste informazioni al file di configurazione della lingua. Lì, diciamo a WPML quali voci nella tabella wp_options richiedono la traduzione.

Questa tecnica è buona quando i tasti sono fissi (come nella maggior parte dei temi). Se il tema utilizza matrici di voci, che possono aumentare con l'input dell'utente, è necessario registrare queste voci in modo dinamico. Usa le funzioni icl_register_string e icl_t di WPML per farlo.

Traduzione del corpo postale

WPML consente agli utenti di tradurre i contenuti con facilità. Le schermate di post-modifica includono la traduzione di WPML controlli, permettendo di creare nuove traduzioni e modificare quelle esistenti.

Non è necessario fare nulla nel tema o nel plugin per farlo accadere. La traduzione di contenuti è una caratteristica fondamentale di WPML.

Quello che devi controllare è che qualsiasi testo aggiunto dal tuo tema all'output è traducibile.

Se sei nuovo nell'usare GetText, scopri di più in merito alle nostre FAQ sulla traduzione dei nostri testi tematici.

Tradurre i widget con la traduzione di stringhe

WPML consente agli utenti di tradurre il contenuto dei widget di testo. Traduce anche i titoli di tutti gli altri widget. Se il tuo tema o plugin crea i propri widget personalizzati, assicurati di passare i loro titoli attraverso i filtri standard di WordPress. In questo modo, WPML permetterà agli utenti di tradurre i titoli dei tuoi widget tramite la schermata di conversione delle stringhe.

Traduzione del piè di pagina

 Alcuni temi hanno una schermata di amministrazione personalizzata per memorizzare i testi del piè di pagina. Come altri testi che abbiamo visto, il tema o il plugin salvati i testi footer nel wp_options tavolo anche. Aggiungeremo queste voci al file di configurazione della lingua, dicendo a WPML di tradurle.

 



Per una spiegazione dettagliata e dettagliata su come gli utenti finali utilizzeranno WPML, visita il nostro tutorial per ottenere la compatibilità con WPML.


Non è necessario riscrivere l'intero tema o il plug-in perché WPML gestisce tutto questo. Questo tutorial non è così difficile come scalare il Monte Everest, ma ci sono alcune cose che dovrai modificare per renderlo più facile per il tuo utente finale.


Ora che abbiamo spiegato come le persone tradurranno gli elementi standard di WordPress, rivediamo insieme cosa dovresti fare per garantire la compatibilità multilingue per i tuoi elementi personalizzati.

Le migliori 7 migliori pratiche per rendere il tuo tema multilingue e compatibile con WooCommerce

1. Aggiungi le funzioni GetText al testo hard-coded

Per plugin o temi, assicurati di avvolgere il tuo testo codificato in funzioni 'gettext'. Questo include l'intestazione, il piè di pagina e il testo del widget. I file del tuo modello mostrano un assortimento di informazioni sul prodotto e un testo codificato. Ad esempio, la maggior parte dei modelli includerà il nome del prodotto e un link "Acquista". Il nome del prodotto viene dal database, quindi non devi preoccuparti di tradurlo.

Dovresti assicurarti che tutti i testi codificati siano traducibili, usando le funzioni 'gettext'.

Buono

Male

"/>

"Prodotti simili" e "Acquista ora!" Non sono racchiusi tra le chiamate GetText.

Assicurati di utilizzare il dominio di testo del tema per tutte le chiamate di GetText.

2. Utilizzare le funzioni API per collegarsi alle pagine di WooCommerce

Molti temi di e-commerce includono pagine speciali, come "carrello" o "account". Il tema include spesso collegamenti a queste pagine, visualizzati su ogni pagina del sito.


Se utilizzi un menu WordPress per questi collegamenti, dovresti essere tutto pronto. WPML visualizza un diverso menu WordPress per ogni lingua, quindi i collegamenti a queste "pagine speciali" saranno diversi, per lingua. Tuttavia, se si codificano questi collegamenti nei file modello, è necessario consentire a WPML di sostituire i collegamenti, con collegamenti a queste pagine nella lingua corretta.


Il modo giusto per collegarsi alle pagine speciali di WooCommerce è utilizzando le funzioni dell'API di WordPress e gli ID delle pagine di WooCommerce. WooCommerce chiama i filtri multilingue su 'get_option ()' con gli ID delle pagine di WooCommerce. Restituirà l'ID della pagina nella lingua corrente.


Buono

Male

“>

“>

'shop' è lo slug della pagina nella lingua predefinita.

“>

L'ID della "pagina del negozio" è hardcoded. Sarà diverso per diversi siti e per diverse lingue.

L'URL della "pagina del negozio" è hardcoded. Sarà diverso per diverse lingue.

3. Aggiungi elenchi di prodotti multilingue

Se si utilizzano gli shortcode WooCommerce per visualizzare l'elenco dei prodotti, è tutto pronto. WooCommerce caricherà i prodotti nella lingua corretta e li visualizzerà.

Se preferisci caricare i prodotti manualmente, utilizzando il tuo codice, assicurati di utilizzare l'API di WordPress o le chiamate all'API di WooCommerce. Se accedi direttamente al database, WPML non filtrerà la tua chiamata e otterrai un mix di tutti i prodotti in tutte le lingue.

Buono

Male

[featured_products per_page = "12" columns = "4"]

[id prodotto = "99"]

(Di Più)

'prodotto', 'suppress_filters' => 0)); ?>

$ args = array (

'post_type' => 'prodotto',

'posts_per_page' => 10,

);

$ products = new WP_Query ($ args);

?>

'Prodotto')); ?>

suppress_filters sarà impostato su true per impostazione predefinita, impedendo il filtraggio delle lingue.

$ prodotti = $ wpdb-> get_results ($ wpdb-> prepare ("SELECT * FROM $ wpdb-> posts WHERE post_type =" prodotto "ORDINE PER ID LIMITE DI DESCRI% d", 10));

WPML non filtra le query SQL di basso livello. Tutti i prodotti in tutte le lingue saranno restituiti.

Una volta caricati i prodotti giusti, non è necessario preoccuparsi delle lingue durante la visualizzazione. Ogni prodotto verrà fornito con i propri campi personalizzati, con informazioni nella lingua corretta.

4. Aggiungi opzioni di pagamento multi valuta

Alcuni siti eCommerce globali richiedono più lingue e più valute. Il tuo tema dovrebbe supportare quei siti che richiedono multi-valuta. Per molti siti non americani, il supporto di più valute è una caratteristica molto importante. Ad esempio, molti siti europei dovranno pagare in euro, sterline britanniche e dollari USA. I siti dell'Europa dell'Est richiedono spesso il rublo russo e i siti asiatici necessitano di una varietà di altre valute diverse.

Il supporto multivaluta è incluso in WooCommerce Multilingual. Per consentire ai visitatori di passare da una valuta all'altra, il tuo tema dovrebbe includere un cambio valuta opzionale.

È possibile visualizzare un selettore di valuta, utilizzando una chiamata PHP o inserendo uno shortcode.

'% name (% symbol)')); ?>

[Currency_switcher]

Per un tutorial completo, visita il tutorial su Multi-Currency per WooCommerce. Tieni presente che lo scambio di valuta verrà visualizzato solo se il sito utilizza più valute.

5. Diventa compatibile con RTL

Inglese - LTR

Ebraico - RTL


I temi WooCommerce devono seguire le linee guida RTL, proprio come i temi WordPress. Dovresti creare un file 'rtl.css', con le regole CSS per la visualizzazione RTL.

Crea un nuovo file 'rtl.css' e inseriscilo nella directory principale del tuo tema. La direzione 'dir' in CSS farà la maggior parte del lavoro e dovrai solo aggiustare alcune posizioni. Per le lingue RTL, imposta l'attributo 'direction' in CSS a 'rtl'. Inoltre aggiungi l'attributo 'unicode-bidi-.

Buona visualizzazione RTL aggiunta al selettore .body:


direction: rtl;

unicode-bidi: embed;


Ora il tuo tema verrà visualizzato in RTL. Per gestire le eccezioni, consultare le Linee guida per il supporto ai temi RTL.

6. Gestire lunghezze di testo diverse in lingue diverse

Quando crei il tuo tema WooCommerce multilingue pronto, capisci che alcuni testi saranno più lunghi in alcune lingue e più brevi in ​​altri. Alcune lunghezze linguistiche, non puoi testare, perché i tuoi utenti finali tradurranno il contenuto da solo.

Ad esempio, guarda questi due blocchi di prodotti.


CSS ottimizzato per brevi testi in inglese

Il testo spagnolo più lungo non si adatta allo spazio

Il modo migliore per ottenere una compatibilità di più lunghezze è testare il tuo tema con testi più lunghi di x2 e più brevi di ½. Nella maggior parte dei casi, questo coprirà tutte le lingue tradotte. Si consiglia vivamente di utilizzare layout fluidi per gestire testi di dimensioni diverse. Un layout fluido consentirà a ciascun elemento di ridimensionare e catturare l'area necessaria. Raggiungere un layout fluido richiede tempo, ma previene problemi visivi.

Il testo scorre senza interruzioni sulla riga successiva senza alcun errore di visualizzazione

WooCommerce 'style.css' usa la designazione 'white-space: no-wrap'. Ma nel nostro esempio, per avvolgere correttamente il testo devi usare 'white-space: normal;'.

7. Creare un file di configurazione della lingua

Per rendere il tuo tema pienamente compatibile con WPML, dovresti rendere semplice per gli altri l'esecuzione di siti multilingue con il tema creando un file di configurazione della lingua.

WPML può leggere un file di configurazione che descrive in dettaglio cosa deve essere tradotto nel tema o nel plugin. Creare e denominare il file "wpml-config.xml". Salva il file nella directory principale del tema. Usa la struttura e il layout di sezione nell'esempio in questo file di esempio wpml-config.zip e modificalo con il tuo contenuto personalizzato.

Il contenuto nel file "wpml-config.xml" deve essere racchiuso nel seguente modo aprire e chiudere i tag:



Nel file 'wpml-config' imposti quali funzionalità devono essere tradotte da WPML, i tuoi tipi di post personalizzati, le tassonomie personalizzate, i campi personalizzati e il testo di amministrazione (stringa proveniente da wp_options), e puoi anche impostare il modo in cui la lingua del tuo tema switcher guarderà solo seguire questo breve tutorial per esempi completi e dettagli sulla strutturazione del tuo file di configurazione della lingua visita il nostro tutorial sul file di configurazione della lingua.

Prova il tuo sito

Ora che comprendi la necessità di rendere pronto il tuo tema o plugin multilingue e WooCommerce, e dopo aver seguito le consuete pratiche di sviluppo come descritto sopra, è il momento di testare il tuo tema o plugin.


Di solito quando esegui il test, tenterai di tradurre tutto inserendo traduzioni fittizie in ogni area del tuo sito. Ma questo richiederebbe molto tempo. Pertanto, abbiamo creato per te uno strumento di test: Plugin degli strumenti di test di compatibilità WPML.


Questo strumento invierà traduzioni fittizie per il tuo sito, così potrai cambiare lingua, vedere cosa è stato tradotto e cosa è rimasto nella tua lingua originale. Il nostro strumento di test ti farà risparmiare parecchie ore di test e ti aiuterà a vedere quali aree devi migliorare nel tuo tema o plugin.

Installa i plugin giusti per WooCommerce multilingue

I tuoi clienti avranno bisogno dei seguenti plug-in per siti di e-commerce multilingue con WooCommerce:

  • WPML CMS di OnTheGoSystems

  • WooCommerce di WooThemes

  • WooCommerce Multilingue di OnTheGoSystems


WPML viene fornito con il plug-in principale e i componenti aggiuntivi. Questa architettura consente a diverse persone di installare diverse parti di cui hanno bisogno. Per i siti multilingue di WooCommerce, sono necessari i seguenti componenti WPML:


  • WPML (Core)

  • Traduzione String WPML

  • Gestione della traduzione di WPML

  • Traduzione multimediale WPML

Partnership GoGlobal

WPML viene utilizzato su oltre 400.000 siti Web e qualsiasi tema o plug-in che utilizza l'API di WordPress può ottenere compatibilità multilingue tramite WPML. Perché rischiare di non avere un tema o un plugin compatibile multilingue e compatibile con WooCommerce?


WPML ha un programma GoGlobal in cui offriamo account WPML gratuiti agli autori di temi e plugin per test di compatibilità. Abbiamo numerosi temi che sono attualmente compatibili tra cui diversi WooThemes, tutti i temi eleganti, Avada e molti temi su ThemeForest.


In WPML prendiamo seriamente la compatibilità con cinque esperti sviluppatori e consulenti che lavorano a tempo pieno sulla compatibilità per tutti gli autori di temi e plugin per ottenere compatibilità multilingue. Iscriviti gratuitamente oggi al nostro programma GoGlobal WPML.

Distribuzione di temi multilingue

Quando si distribuisce il tema, si desidera che le persone siano in grado di utilizzarlo per siti multilingue e multilingue. I suggerimenti di progettazione che abbiamo dato in questo articolo si basano principalmente sulle best practice di WordPress, quindi il codice del tema include a malapena qualsiasi codice specifico per WPML.


I tuoi clienti dovranno installare WPML e i componenti necessari per l'esecuzione di siti multilingue. Poiché WPML è un marchio registrato (e per altri buoni motivi), non è necessario associare WPML al tema.


Al contrario, WPML offre un piccolo componente per l'acquisto e l'installazione automatica, che sei il benvenuto. Questo componente consente agli utenti di acquistare WPML direttamente dall'amministratore di WordPress. Ti accredita anche con commissioni di affiliazione per qualsiasi riferimento.


L'integrazione di questo piccolo componente di installazione automatica nel tuo tema è un ottimo modo per mostrare alle persone che il tuo tema è veramente compatibile con WPML e può potenziare siti multilingue. Offre inoltre agli utenti un processo semplificato per l'acquisto e l'installazione di WPML, senza dover utilizzare FTP per caricarlo sui loro server.

Sommario

Ora che abbiamo coperto le sette migliori best practice per rendere pronto il tema o il plugin WooCommerce e Multilingual, ci auguriamo che tu sia pronto per iniziare. Essere multilingue pronto è facile e possibile per ogni autore di temi.  


È facile come utilizzare le best practice di WordPress come l'utilizzo delle funzioni "gettext" e la corretta gestione dei collegamenti WooCommerce con hardcoded, per aggiungere finalmente un file di configurazione della lingua al tema. Aumenta la versatilità del tuo prodotto sul mercato concentrandoti sull'internazionalizzazione del tuo tema o plug-in.

Stiamo dando via $ 8.000 nel nostro ultimo evento WPML e WooCommerce WordPress Themes Most Wanted. Devi esserci per vincere!