Per spiegare in breve come tradurre per gli script Javascript (Gutenberg): WordPress richiede Quindi quello che dobbiamo fare \u00e8 prima aggiungere le funzioni gettext ( Tieni presente che i file \/ del tuo tema o plugin Il primo passo \u00e8 racchiudere tutti i testi nel nostro file Javascript all’interno delle funzioni di traduzione. Se hai gestito la traduzione per WordPress in PHP probabilmente hai molta familiarit\u00e0 con le funzioni Come con PHP, devi fornire un dominio textdomain (nome\/handle). Pu\u00f2 essere quello che vuoi, ma mantienilo breve poich\u00e9 probabilmente dovrai scriverlo molto spesso. Per il mio tema ho impostato il mio dominio di testo con il dominio Iniziamo a modificare il nostro file Javascript. Per prima cosa dobbiamo destrutturare la funzione E poi si tratta di trovare tutti i nostri testi hardcoded nel file Javascript e aggiornarli. Tieni presente che le funzioni Ad esempio, il nostro E per quanto riguarda gli oggetti di scena, cio\u00e8 in Avvolgi tutti i testi per i quali desideri supportare la traduzione in Questo passaggio varia leggermente a seconda di ci\u00f2 che hai gi\u00e0 fatto e configurato per il tuo tema o plug-in. Potresti scrivere i tuoi script Gutenberg in un nuovo plug-in vuoto che non \u00e8 stato impostato per la traduzione PHP o all’interno di un tema che ha gi\u00e0 registrato un dominio di testo. Potresti avere file PO (e MO) pronti o potresti avere solo un file POT. Far\u00f2 del mio meglio per coprire tutte le basi.<\/p>\n Se hai gi\u00e0 un file PO o POT nel tuo progetto, molto probabilmente hai anche la funzione PHP Tutto quello che devi fare \u00e8 caricare il file PO per la lingua che vuoi tradurre (o generarne uno dal file POT) ad esempio PoEdit<\/a>. Fai clic su "Aggiorna da codice" (o simile in altri programmi) in modo che il programma possa scansionare tutti i file di progetto (inclusi i nostri file Javascript aggiornati di recente) e aggiornare il pool di stringhe per la traduzione. Le stringhe nel nostro file Javascript dovrebbero apparire. Quindi devi solo tradurli normalmente e salvare.<\/p>\n PS: se non sei in grado di fare clic su "Aggiorna da codice" o scansionare nuovamente i file, \u00e8 probabile che il file PO non sia stato impostato correttamente. Cerca suggerimenti nella prossima sezione.<\/p>\n Se il tuo tema o progetto non \u00e8 stato impostato con la traduzione, devi generare un file POT utilizzando WP-CLI o creare manualmente un file PO.<\/p>\n Ho una guida completa su come creare un file PO nel mio Tutorial tema per principianti \u2013 parte 8<\/a>. Il post descrive come creare il file e configurarlo correttamente per cercare i file del tema e le parole chiave da cercare ( Se si desidera creare un file POT, \u00e8 possibile utilizzare il comando wp i18n make-pot<\/a> in WP-CLI, quindi creare un file PO utilizzando ad esempio PoEdit. Tieni presente che dovrai rigenerare il file POT (e quindi il file PO) ogni volta che aggiorni le stringhe nel tuo codice.<\/p>\n Ci\u00f2 di cui hai bisogno alla fine \u00e8 un file PO che abbia trovato le tue stringhe Javascript dove queste sono state tradotte. Ti consiglio di posizionare i tuoi file di traduzione in una cartella separata nel tuo tema o plugin. Quando inizieremo a generare file JSON, ci ritroveremo con un bel po’ di file da tradurre e sar\u00e0 bello tenerli tutti insieme nella loro cartella.<\/p>\n Come punto di riferimento sto inserendo tutti i file di traduzione nel mio file Il passaggio successivo consiste nell’utilizzare WP-CLI per generare file JSON dal nostro file po. Per fare ci\u00f2 utilizziamo il comando wp i18n make-json<\/a>.<\/p>\n Tieni presente che come impostazione predefinita questo comando eliminer\u00e0 le stringhe tradotte dal tuo file PO per utilizzarle nella generazione di file JSON. Questo pu\u00f2 essere ingombrante durante lo sviluppo del tuo tema o plugin. Perch\u00e9 quando aggiungi nuove stringhe o modifichi le stringhe dovrai scansionare nuovamente i file e tradurre tutte le stringhe ancora (e ancora, e ancora). Fortunatamente c’\u00e8 un flag al comando per evitarlo.<\/p>\n Iniziamo! Nel tuo terminale, vai alla directory della tua lingua per il tuo progetto. Esegui il comando seguente e fai riferimento al tuo file po (come accennato, ho un Se non hai problemi con la rimozione delle stringhe tradotte dal tuo file PO (ad esempio se stai creando la tua build finale), puoi saltare il Il terminale dovrebbe richiedere "Success" e indicare quanti file JSON sono stati creati. Se vedi che ha generato due file JSON, \u00e8 perch\u00e9 ha letto sia il nostro file Javascript del codice sorgente che il file build e ne ha generato uno per ciascuno. Se hai pi\u00f9 file Javascript nel tuo progetto, ti ritroverai con ancora pi\u00f9 file JSON.<\/p>\n Al momento della stesura di questo (WordPress v 5.3.2 e WP-CLI versione 2.4.0) i file JSON vengono generati con il codice della lingua e un hash, una stringa criptica come nomi di file. Dobbiamo trovare quello giusto e rinominarlo.<\/p>\n.mo<\/code>dei file per la traduzione dei file PHP, ma per Javascript WordPress richiede un .json<\/code>file. Ogni file Javascript necessita di un file JSON per la traduzione. Il JSON dovrebbe essere di un formato specifico (WP CLI lo generer\u00e0 per noi) con le nostre stringhe tradotte. Abbiamo bisogno di un file JSON per la lingua in cui desideriamo tradurre.<\/p>\n__()<\/code>, _e()<\/code>ecc.) nei nostri file Javascript e generare un file PO come al solito per il nostro tema o plugin. Poich\u00e9 abbiamo racchiuso i testi nei nostri file di script con es __()<\/code>, il file PO dovrebbe essere in grado di includerli. Quindi eseguiamo la traduzione come al solito nel nostro file PO. E infine utilizziamo WP CLI per estrarre le stringhe necessarie dal file PO e generare file JSON per tutti i nostri file Javascript.<\/p>\n.po<\/code>non .mo<\/code>avranno mai effetto sui tuoi file Javascript, anche se contengono stringhe tradotte dai nostri file Javascript.<\/p>\nImplementazione della traduzione in Javascript<\/h2>\n
__()<\/code>, _e()<\/code>, esc_html__()<\/code>e cos\u00ec via. WordPress ha un pacchetto wp.i18n<\/code>che contiene queste funzioni, che funzionano esattamente come in PHP.<\/p>\nawhitepixel<\/code>. Quindi all’interno di PHP far\u00f2 __('My string', 'awhitepixel')<\/code>per tradurre le stringhe e sar\u00e0 esattamente lo stesso nei file Javascript.<\/p>\n__<\/code>e _e<\/code>dal wp.i18n<\/code>pacchetto. A causa della natura di React, molto probabilmente utilizzerai principalmente o forse solo la __<\/code>funzione.<\/p>\nconst { __, _e } = wp.i18n;<\/code><\/pre>\n__<\/code>e _e<\/code>richiedono il contesto Javascript. Ci\u00f2 significa che quando scriviamo stringhe come ad esempio i valori delle propriet\u00e0 degli oggetti, le usiamo __()<\/code>immediatamente, ma come valori per es. props dobbiamo racchiudere tutto all’interno { }<\/code>per significare che si tratta di codice Javascript.<\/p>\nregisterBlockType<\/code>con supporto per la traduzione sar\u00e0 simile a:<\/p>\nregisterBlockType('awp\/firstblock', {\n title: __('My first block', 'awhitepixel'), \n category: 'common',\n icon: 'smiley',\n description: __('Learning in progress', 'awhitepixel'),\n keywords: [__('example', 'awhitepixel'), __('test', 'awhitepixel')],\n attributes: {\n ...<\/code><\/pre>\nInspectorControls<\/code>:<\/p>\n<InspectorControls>\n <PanelBody\n title={__(\"Most awesome settings ever\", 'awhitepixel')}\n initialOpen={true}\n >\n ...\n <ToggleControl\n label={__(\"Toggle me\", 'awhitepixel')}\n checked={attributes.toggle}\n onChange={(newval) => setAttributes({ toggle: newval })}\n \/>\n ...<\/code><\/pre>\n__()<\/code>e _e()<\/code>. Se hai seguito questo tutorial passo dopo passo, non dovresti avere casi in cui devi usare _e()<\/code>. Quando hai finito, ricompila Javascript e ci allontaneremo da Javascript.<\/p>\nConfigurazione di file po e\/o pot<\/h2>\n
Il mio tema o plugin ha gi\u00e0 un file po(t).<\/h3>\n
load_theme_textdomain()<\/code>o load_child_theme_textdomain()<\/code>da load_plugin_textdomain()<\/code>qualche parte nel tuo codice. Assicurati che il dominio registrato sia lo stesso che hai utilizzato nei tuoi file Javascript.<\/p>\nNon ho nessun file di traduzione<\/h3>\n
__<\/code>, _e<\/code>, ecc.).<\/p>\nRisultato finale<\/h3>\n
theme\/assets\/lang\/<\/code>. Ho aggiunto una traduzione norvegese per il mio tema, denominata nb_NO.po<\/code>, che contiene le stringhe tradotte dal nostro file Javascript di blocco personalizzato.<\/p>\nGenerazione di file JSON dal file po<\/h2>\n
nb_NO.po<\/code>file pronto).<\/p>\nwp i18n make-json nb_NO.po --no-purge<\/code><\/pre>\n--no-purge<\/code>flag.<\/p>\nRinominare il file JSON e caricarlo in PHP<\/h2>\n
![\"Crea](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-153240-61e50a824a365.png\")
<\/a><\/p>\n![\"Crea](\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-153240-61e50a83bedae.png\")
<\/a><\/p>\n