I prodotti di WooCommerce sono “articoli” personalizzati di WordPress con campi personalizzati. Sono organizzati utilizzando le tassonomie personalizzate “categorie di prodotto” e “tag di prodotto”. Qui ti mostreremo come funzionano i siti WooCommerce multilingue e di cosa hanno bisogno i tuoi temi WooCommerce per essere Multilingual Ready.
Come funzionano i siti WooCommerce multilingue
Quando un sito usa WPML, viene assegnata una lingua a ogni elemento di contenuto. Questo significa che ogni prodotto, categoria e tag avrà un attributo di lingua. Le traduzioni vengono salvate nel database come prodotti separati, collegati tra loro utilizzando la tabella delle lingue di WPML. I prodotti tradotti condividono le stesse immagini e hanno i propri campi separati con i testi nella lingua corretta.
Gli amministratori del sito possono tradurre comodamente utilizzando la tabella di traduzione dei prodotti di WPML. In questo modo, possono concentrarsi sulla traduzione dei testi richiesti, senza doversi preoccupare di come le traduzioni vengono archiviate nel database.
Poiché le traduzioni sono separate nel database, è anche facile visualizzare siti WooCommerce multilingue. Infatti, se usi le API di WordPress e WooCommerce, il tuo tema potrebbe essere già Multilingual Ready. Con qualche test e possibilmente piccole modifiche, puoi ottenere una completa compatibilità multilingue e goderti nuovi mercati.
Plugin richiesti per i siti WooCommerce multilingue
Per gestire siti WooCommerce multilingue, sono necessari i seguenti plugin:
- WooCommerce
- Il plugin WPML core e i componenti aggiuntivi WPML Traduzione stringhe e WPML Media Translation
- WPML Multilingual & Multicurrency for WooCommerce
WPML e tutti i plugin correlati, incluso WPML Multilingual & Multicurrency for WooCommerce, sono inclusi nel tipo di account Multilingual CMS.
Testi hardcoded nei template
I file del tuo template mostrano un mix di informazioni sul prodotto e testi hardcoded. Ad esempio, la maggior parte dei template includerà il nome del prodotto e un link “Acquista”. Il nome del prodotto proviene dal database, quindi non devi preoccuparti di tradurlo.
Dovresti assicurarti che tutti i testi hardcoded siano traducibili, utilizzando GetText.
Corretto
<p><?php _e('Similar products:', 'my-textdomain') ?></p><input type="button" name="buy-button" value="<?php esc_attr_e('Buy now!', 'my-textdomain') ?>" />Nell'esempio seguente, “Similar products” e “Buy now!” non sono racchiusi in chiamate GetText.
Sbagliato
<p><?php echo 'Similar products:'; ?></p>
<input type="button" name="buy-button" value="Buy now!" />Corretto
<p><?php _e('Similar products:', 'my-textdomain') ?></p><input type="button" name="buy-button" value="<?php esc_attr_e('Buy now!', 'my-textdomain') ?>" />Sbagliato
<p><?php echo 'Similar products:'; ?></p><input type="button" name="buy-button" value="Buy now!" />“Similar products” e “Buy now!” non sono racchiusi in chiamate GetText.
| Corretto | Sbagliato |
|---|---|
<p><?php _e('Similar products:', 'my-textdomain') ?></p><input type="button" name="buy-button" value="<?php esc_attr_e('Buy now!', 'my-textdomain') ?>" /> | <p><?php echo 'Similar products:'; ?></p><input type="button" name="buy-button" value="Buy now!" />“Similar products” e “Buy now!” non sono racchiusi in chiamate GetText. |
Assicurati di usare il textdomain del tuo tema per tutte le chiamate GetText.
Pagine WooCommerce hardcoded
Molti temi di e-commerce includono pagine speciali, come le pagine Carrello o Account. Spesso il tema include link a queste pagine, che appaiono su ogni pagina del sito.
Se usi un menu di WordPress per questi link, dovresti essere a posto. WPML mostra un menu di WordPress diverso per ogni lingua, quindi i link a queste “pagine speciali” saranno diversi, per lingua. Tuttavia, se inserisci questi link in modo hardcoded nei file del template, devi permettere a WPML di sostituire i link con quelli a queste pagine nella lingua corretta.
Il modo giusto per collegare le pagine speciali di WooCommerce è utilizzare le funzioni delle API di WordPress e gli ID delle pagine di WooCommerce. WPML Multilingual & Multicurrency for WooCommerce filtra le chiamate a get_option() con gli ID delle pagine di WooCommerce. Restituirà l'ID della pagina nella lingua corrente.
Corretto
<a href="<?php echo get_permalink(get_option('woocommerce_shop_page_id')) ?>"><?php _e('Shop page', 'my-textdomain') ?></a><a href="<?php echo get_permalink(wc_get_page_id('shop')) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>Lo “shop” è lo slug della pagina nella lingua predefinita.
Sbagliato
<a href="<?php echo get_permalink(5) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>L'ID di “shop page” è hardcoded. Sarà diverso per siti diversi e per lingue diverse.
<a href="/shop"><?php _e('Shop page', 'my-textdomain') ?></a>L'URL di “shop page” è hardcoded. Sarà diverso per lingue diverse.
| Corretto | Sbagliato |
|---|---|
<a href="<?php echo get_permalink(get_option('woocommerce_shop_page_id')) ?>"><?php _e('Shop page', 'my-textdomain') ?></a><a href="<?php echo get_permalink(wc_get_page_id('shop')) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>Lo “shop” è lo slug della pagina nella lingua predefinita. | <a href="<?php echo get_permalink(5) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>L'ID di “shop page” è hardcoded. Sarà diverso per siti diversi e per lingue diverse. <a href="/shop"><?php _e('Shop page', 'my-textdomain') ?></a>L'URL di “shop page” è hardcoded. Sarà diverso per lingue diverse. |
Elenchi di prodotti Multilingual Ready
Se usi gli shortcode di WooCommerce per mostrare l'elenco dei prodotti, sei a posto. WooCommerce caricherà i prodotti nella lingua corretta e li mostrerà.
Se preferisci caricare i prodotti manualmente, usando il tuo codice, assicurati di utilizzare le API di WordPress o le chiamate alle 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.
Corretto
<?php $products = get_posts(array('post_type' => 'product', 'suppress_filters' => 0)); ?><?php
$args = array(
'post_type' => 'product',
'posts_per_page' => 10,
);
$products = new WP_Query( $args );
?>Sbagliato
<?php $products = get_posts(array('post_type' => 'product')); ?>suppress_filters sarà impostato su true per impostazione predefinita, impedendo il filtro della lingua.
$products = $wpdb->get_results($wpdb->prepare(“SELECT * FROM {$wpdb->posts} WHERE post_type='product' ORDER BY ID DESC LIMIT %d", 10));WPML non filtra le query SQL di basso livello. Verranno restituiti tutti i prodotti in tutte le lingue.
| Corretto | Sbagliato |
|---|---|
<?php $products = get_posts(array('post_type' => 'product', 'suppress_filters' => 0)); ?><?php | <?php $products = get_posts(array('post_type' => 'product')); ?>suppress_filters sarà impostato su true per impostazione predefinita, impedendo il filtro della lingua. $products = $wpdb->get_results($wpdb->prepare(“SELECT * FROM {$wpdb->posts} WHERE post_type='product' ORDER BY ID DESC LIMIT %d", 10));WPML non filtra le query SQL di basso livello. Verranno restituiti tutti i prodotti in tutte le lingue. |
Una volta caricati i prodotti giusti, non devi preoccuparti delle lingue quando li mostri. Ogni prodotto avrà i propri campi personalizzati, con le informazioni nella lingua corretta.
Template di prodotto Multilingual Ready
Poiché le traduzioni sono archiviate in prodotti separati, mostrare un singolo prodotto su un sito WooCommerce multilingue non dovrebbe richiedere uno sforzo speciale.
Opzioni di pagamento multivaluta
Il tuo sito WooCommerce multilingue potrebbe includere anche più valute. Per molti siti non americani, supportare più valute è una funzionalità molto importante. Ad esempio, molti siti europei avranno bisogno di addebitare in euro, sterline britanniche e dollari statunitensi. I siti dell'Europa orientale spesso richiedono il rublo russo, mentre i siti asiatici necessitano di una varietà di altre valute diverse.
Il supporto multivaluta è incluso in WPML Multilingual & Multicurrency for WooCommerce. Per permettere ai visitatori di passare da una valuta all'altra, il tuo tema dovrebbe includere un selettore di valuta opzionale.
Puoi mostrare un selettore di valuta utilizzando una chiamata PHP o inserendo uno shortcode.
<?php do_action('currency_switcher', array('format' => '%name (%symbol)')); ?>[currency_switcher]Per maggiori informazioni, consulta il tutorial sul multivaluta per WooCommerce. Tieni presente che vedrai il selettore di valuta sul front-end solo se il sito usa più valute.
Rendere il tuo sito WooCommerce compatibile con RTL
I temi WooCommerce devono seguire le stesse linee guida di supporto per i temi RTL di qualsiasi altro tema WordPress. Dovresti creare un file rtl.css, con le regole CSS per la visualizzazione RTL.
Gestire diverse lunghezze di testo in lingue diverse utilizzando il design fluido
Quando crei il tuo tema WooCommerce Multilingual Ready, ricorda che alcuni testi saranno più lunghi in certe lingue e più corti in altre. A volte, non sarai nemmeno in grado di testarlo, perché saranno i tuoi utenti finali a tradurre.
Ad esempio, guarda questi due blocchi di prodotto.
CSS ottimizzato per il testo breve in inglese
I testi in spagnolo più lunghi non si adattano allo spazio
Come regola generale, testa il tuo tema con testi che sono 2 volte più lunghi e la metà più corti. Questo ti coprirà nella maggior parte dei casi. Il modo migliore per gestire testi di dimensioni diverse è consentire layout fluidi. I layout fluidi permetteranno agli elementi di ridimensionarsi e occupare l'area di cui hanno bisogno. Creare un template elegante con dimensioni fluide non è banale, ma farlo aiuta a evitare difetti visivi.
Pronto per iniziare?
Se sei uno sviluppatore e crei temi o estensioni per WooCommerce, dovresti assolutamente unirti al nostro programma Go Global. Riceverai un account sviluppatore WPML in omaggio e otterrai supporto prioritario dal nostro team di compatibilità. Il negozio WooCommerce è solo una (grande) sezione del tuo tema. Dovresti assolutamente leggere la nostra guida su come ottenere la compatibilità con WPML per i tuoi temi.
Crei siti per i clienti? Acquista WPML e inizia a creare siti multilingue per WooCommerce e oltre.