Aprender WordPress - Internacionalización general de la API

Qué es la internacionalización y por qué es tan importante. Te enseña cómo aplicar la internacionalización al código de WordPress para que tu sitio web traspase la barrera del idioma y llegue a un público global.

¿Qué es la internacionalización?

La internacionalización es el proceso de desarrollar aplicaciones de forma que puedan traducirse fácilmente a otros idiomas. La internacionalización suele abreviarse como i18n (porque hay 18 letras entre la i y la n).

WordPress es utilizado en todo el mundo por personas que hablan muchos idiomas.

Por lo tanto, las cadenas de texto de WordPress deben codificarse para que puedan traducirse fácilmente a otros idiomas.

El proceso de garantizar que una cadena de texto sea traducible se denomina internacionalización, mientras que el proceso de traducir una cadena y adaptarla a un lugar concreto se denomina localización.

Aunque la localización está fuera del alcance de este tutorial, puede encontrar más información al respecto en el Manual general de la APIEn la sección Localización encontrará más información al respecto.

Como desarrollador, es posible que no pueda localizar para todos los usuarios; sin embargo, mediante el uso de funciones y herramientas i18n para crear archivos específicos, los traductores pueden localizar con éxito su código sin modificar el propio código fuente.

La internacionalización no es nada

La internacionalización no es lo mismo que asegurarse de que su contenido está disponible en varios idiomas en la parte frontal de su sitio web. Esto suele denominarse asegurarse de que el contenido es multilingüe o está traducido. Dado que el contenido se almacena en una base de datos, conviene tener una copia de su sitio web totalmente traducida para cada idioma que desee admitir. Para ello, puede utilizar la herramientaTraducirPrensayPolylangtal vezWeGlot et al.plugin para hacerlo.

Cómo internacionalizar su código

Siempre que se encuentre escribiendo una cadena de texto para mostrarla al usuario, debe utilizar la funciónFunciones i18n de WordPresspara asegurarse de que se puede traducir. Hay varias funciones i18n disponibles, cada una de las cuales realiza una tarea diferente relacionada con la internacionalización.

Veamos las funciones i18n más básicas:__() funciónEsta función toma una cadena de texto y devuelve una versión traducida de esa cadena. Esta función toma una cadena de texto y devuelve una versión traducida de esa cadena. Si no hay traducción disponible, se devuelve la cadena original.

También notará que esta función y la mayoría de las otras funciones i18n toman un segundo argumento. Este parámetro se utiliza para especificar el campo de texto. El campo de texto es un identificador único para su plugin o tema. Se utiliza para asegurar que se carga el archivo de traducción correcto.

El campo de texto también se utiliza para crear archivos de traducción. El archivo de traducción final se almacena en la carpetaidiomasde su plugin o tema. El nombre de archivo es el nombre de la carpeta con la extensión.model campo de texto. Por ejemplo, si su campo de texto esmi-dominio-de-textoentonces el archivo traducido serámi-dominio-de-texto.mo.

__( 'Algún texto', 'mi-dominio-texto' ).

Para entender cómo funciona, veamos un ejemplo:

en esefunciones.phpel archivo JavaScript se pone en cola en el contexto del panel de control de WordPress, y también registra un elemento de submenú en el menú Apariencia, que presenta la página de configuración del tema hijo.

<?php
/**
 * Enqueue theme.js file in the dashboard.
 */
add_action( 'admin_enqueue_scripts', 'twentytwentythreechild_enqueue_scripts' );
function twentytwentythreechild_enqueue_scripts() {
    wp_enqueue_script(
        'twentytwentythreechild-theme-js',
        get_stylesheet_directory_uri() . '/assets/theme.js',
        array(),
        '1.0.0',
        true
    );
}

/**
 * Create a submenu item under the "Appearance" menu.
 */
add_action( 'admin_menu', 'twentytwentythreechild_add_submenu_page' );
function twentytwentythreechild_add_submenu_page() {
    add_submenu_page(
        'themes.php', 
        'Twenty Twenty Three Child', 
        'Twenty Twenty Three Child',
        'manage_options', 
        'twentytwentythreechild', 
        'twentytwentythreechild_display_page' 
    );
}

/**
 * Render the page for the submenu item.
 */
function twentytwentythreechild_display_page() {
    ?>
    <div class="wrap">
        <h1>Veintitrés entornos infantiles</h1>
        <p>Esta es una página de configuración para el tema Twenty Twenty Three Child</p>
        <button id="twentytwentythreechild-settings-button" class="button button-primary">Alerta</button>
    </div>
    <?php
}

La página Configuración contiene un botón que, al pulsarlo, muestra una alerta.

Esta alerta se gestiona en el archivo JavaScript del tema.

/**
 * Añadir escuchador de eventos al botón
 */
document.querySelector( '#twentytwentythreechild-settings-button' ).addEventListener( 'click', function(){
    alert( 'Botón de configuración pulsado' );
} );

En este código, tiene varias cadenas de texto en inglés que deben traducirse.

El primer paso consiste en internacionalizar las cadenas de texto del código PHP. Para ello, puede añadir el parámetro__()envuelve una cadena de texto y especifica el campo de texto.

Primero actualice la cadena de texto en la funcióntwentytwentythreechild_add_submenu_page().

/**
 * Crear un submenú de administración en el menú "Apariencia".
 */
add_action( 'admin_menu', 'twentytwentythreechild_add_submenu_page' ); function twentytwentythreechild_add_submenu_page() { { add_submenu_page()
function twentytwentythreechild_add_submenu_page() {
    add_submenu_page(
        themes.php', // slug principal
        __( 'Twenty Twenty Three Child', 'twentytwentythreechild' ), // título de la página
        __( 'Twenty Twenty Three Child', 'twentytwentythreechild' ), // título del menú
        'manage_options', // capacidad
        'twentytwentythreechild', // slug
        'twentytwentythreechild_display_page' // devolución de llamada
    );
}

Puede hacer lo mismo con la cadena de texto en la funcióntwentytwentythreechild_display_page().

/**
 * Renderiza la página para el elemento del submenú.
 */
function twentytwentythreechild_display_page() {
    ? >
    <div class="wrap">
        <h1><?php echo __( 'Twenty Twenty Three Child Settings', 'twentytwentythreechild' ); ?></h1>
        <p><?php echo __( 'This is a settings page for the Twenty Twenty Three Child theme', '__' ); ?></p>
        <button id="twentytwentythreechild-settings-button" class="button button-primary"><?php echo __( 'Alert', 'twentytwentythreechild' ); ?></button>
    </div>
    <?php
}

WordPress también incluye una función abreviada para recuperar cadenas traducibles. Esta función es la_e(). Traduce y devuelve la cadena. Puede utilizar esta función para simplificar su código.

function twentytwentythreechild_display_page() {
    ? >{ ?
    <div class="wrap">
        <h1><?php _e( 'Twenty Twenty Three Child Settings', 'twentytwentythreechild' ); ?></h1>
        <p><?php _e( 'This is a settings page for the Twenty Twenty Three Child theme', '__' ); ?></p>
        <button id="twentytwentythreechild-settings-button" class="button button-primary"><?php _e( 'Alert', 'twentytwentythreechild' ); ?></button>
    </div>
    <?php
}

A continuación, hay que internacionalizar las cadenas de texto de los archivos JavaScript. Para ello, existe un método de internacionalización similar al utilizado por PHP__()El equivalente JavaScript de la función está disponible en el objeto wp.i18n del front-end de WordPress. Para asegurarse de que puede utilizar esta función, tendrá que actualizar su archivotwentytwentythreechild_enqueue_scripts()para solicitar quewp-i18ncomo dependencia. Esto garantizará que sólo el paquetewp-i18nCargue el paquete ywp.i18nEl código JavaScript se carga cuando el objeto está disponible.

/**
 * Enqueue theme.js file in the dashboard.
 */
add_action( 'admin_enqueue_scripts', 'twentytwentythreechild_enqueue_scripts' ); }
function twentytwentythreechild_enqueue_scripts() {
    wp_enqueue_scripts(
        'twentytwentythreechild-theme-js',
        get_stylesheet_directory_uri() . '/activos/tema.js',
        array( 'wp-i18n' ),
        '1.0.0',
        true
    );
}

A continuación, debe llamar al script que desea traducir con el comandowp_set_script_translationsfunción (matem.). Esta función toma como argumentos un manejador de script y un campo de texto. Esto cargará la traducción del script.

wp_set_script_translations( 'twentytwentythreechild-theme-js', 'twentytwentythreechild' );

Una vez hecho esto, puede utilizar la función__()para traducir cadenas de texto en archivos JavaScript.

/**
 * Añadir escuchador de eventos al botón
 */
document.querySelector( '#twentytwentythreechild-settings-button' ).addEventListener( 'click', function(){
    alert( __('Botón de configuración pulsado', 'twentytwentythreechild' ) );;
} );

Cómo probar las funciones de internacionalización

Una vez que haya configurado su código para utilizar las funciones i18n, puede probarlo generando un archivo POT. Este es el archivo que utilizan los traductores para crear archivos de traducción. Puede utilizar la funciónWP CLIGenerar un archivo POT.

wp i18n make-pot path/to/your/plugin/or/theme

Esto escaneará el código del plugin o tema en busca de cadenas traducibles y las pondrá en el archivo POT.

Guía de internacionalización

Es importante seguir las mejores prácticas a la hora de internacionalizar el código.

En el apartado Internacionalización de la sección API general de los Recursos para desarrolladores de WordPress, hay una página sobre Directrices de internacionalización, por lo que conviene familiarizarse con ella.

Además, si tiene previsto enviar un tema al Directorio de temas de WordPress, debería leer el Manual del revisor de temas en relación con los siguientes aspectosIdiomas e internacionalizaciónLa parte de la

Esto escaneará el código del plugin o tema en busca de cadenas traducibles y las pondrá en el archivo POT.

Guía de internacionalización

Es importante seguir las mejores prácticas a la hora de internacionalizar el código.

En el apartado Internacionalización de la sección API general de los Recursos para desarrolladores de WordPress, hay una página sobre Directrices de internacionalización, por lo que conviene familiarizarse con ella.

Además, si tiene previsto enviar un tema al Directorio de temas de WordPress, debería leer el Manual del revisor de temas en relación con los siguientes aspectosIdiomas e internacionalizaciónLa parte de la

Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas	Servicio de atención al cliente WeChat
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) Correo electrónico: info@361sale.com
④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres