Mantener la compatibilidad de WPBakery Page Builder con WPML

La compatibilidad de WPBakery Page Builder con WPML se asegura mediante el archivo de configuración de idioma. Aprenda a utilizar este archivo para mantener la compatibilidad.

Esta página está dirigida al equipo de desarrollo de WPBakery, a los desarrolladores que ofrecen una versión personalizada del maquetador visual, a los autores que desarrollan complementos para WPBakery y a los desarrolladores web que utilizan WPBakery Page Builder.

Si usted es un cliente que busca traducir un sitio creado con WPBakery, consulte nuestra documentación detallada para obtener más información sobre cómo crear sitios multilingües con WPBakery Page Builder y WPML.

Cómo funciona la integración de WPBakery Page Builder con WPML

Para entender cómo funciona WPBakery Page Builder con WPML, comenzaremos creando una página sencilla usando WPBakery Page Builder. Incluiremos algunos módulos, como un Text Block, un Message Box y un Hover Box.

Para traducir la página que hemos creado, haga clic en el icono más que se encuentra en la caja meta Idioma de la barra lateral derecha.

Esto le llevará a la pantalla del Editor de traducción avanzado, donde podrá traducir su página. Introduzca las traducciones para cada oración y confírmelas haciendo clic en la marca de verificación verde. Una vez que esté satisfecho con todas sus traducciones, haga clic en Completo.

Actualizar el archivo de configuración de idioma

Es posible que necesite actualizar los shortcodes del maquetador visual en el archivo de configuración de idioma por diferentes motivos:

1. Añadir un nuevo shortcode al maquetador visual
2. Añadir un nuevo atributo a un shortcode existente
3. Eliminar un shortcode obsoleto

Puede descargar el archivo de configuración de idioma desde nuestro repositorio. Añada los shortcodes o atributos a los shortcodes existentes dentro del archivo de configuración de idioma.

Para los autores que incluyen una versión personalizada de WPBakery Page Builder en su tema, tengan en cuenta que deberán actualizar el archivo de configuración de idioma de la versión personalizada del plugin.

Estructura de los shortcodes del maquetador visual en el archivo de configuración de idioma

Para extraer las cadenas de las páginas creadas con WPBakery Page Builder y cargarlas en la pantalla del Editor de traducción, necesitamos configurar WPML para que identifique los shortcodes y atributos que contienen las cadenas que requieren traducción. Esto se hace añadiendo un archivo, llamado wpml-config.xml, que normalmente se coloca en la carpeta raíz de su tema. Para WPBakery Page Builder, alojamos el archivo de configuración de idioma en nuestros servidores. Está configurado para anular el archivo de configuración local situado en la carpeta raíz de WPBakery Page Builder, lo que garantiza que el archivo de configuración esté siempre actualizado.

El archivo wpml-config.xml también se utiliza para configurar los siguientes elementos:

1. Campos personalizados
2. Taxonomías personalizadas
3. Textos de administración / wp_options
4. Configuración del selector de idiomas
5. Shortcodes del maquetador visual

Consulte nuestra documentación detallada para obtener más información sobre la estructura y sintaxis del archivo de configuración de idioma.

Como ejemplo, veamos cómo añadimos el shortcode Tabs al archivo wpml-config.xml.

<shortcode>
         <tag>vc_tta_tabs</tag>
         <attributes>
            <attribute encoding="allow_html_tags">title</attribute>
         </attributes>
</shortcode>

La estructura del ejemplo anterior se puede desglosar de la siguiente manera:

• Todos los shortcodes están envueltos con la etiqueta principal shortcodes (en plural).
• La etiqueta shortcode envuelve todas las etiquetas que pertenecen a un único shortcode.
• La etiqueta tag define el nombre del shortcode, que en este caso es vc_tta_tabs.
• Los shortcodes pueden tener uno o más atributos; por lo tanto, los envolvemos en la etiqueta attributes (en plural) y usamos la etiqueta attribute (en singular) para definir el título de cada atributo. En este caso, tenemos el atributo title.

Para los shortcodes que incluyen atributos de enlace, puede hacer que los enlaces internos apunten automáticamente a la versión traducida de esa entrada utilizando la opción type para el atributo. Aquí tiene un ejemplo:

<shortcode>
         <tag>vc_button</tag>
         <attributes>
            <attribute encoding="allow_html_tags">title</attribute>
            <attribute encoding="vc_link" type="link">href</attribute>
         </attributes>
</shortcode>

Probar el archivo de configuración de idioma

Para probar el archivo de configuración de idioma actualizado, siga estos pasos:

1. Configure una instalación que tenga activados tanto WPBakery Page Builder como WPML. Descargue y active los complementos Traducción de cadenas y Traducción de medios.
2. Tendrá que anular el archivo de configuración de idioma remoto con el actualizado. Para ello, vaya a la página WPML → Configuración y haga clic en la pestaña Configuración XML personalizada. Copie el contenido de su archivo de configuración de idioma actualizado en el editor y luego haga clic en Guardar.

3. Cree una nueva página y añádale los nuevos módulos. En caso de que haya actualizado algunos atributos para módulos existentes, añádalos también a la página. En este ejemplo, supondremos que el módulo Call To Action se ha añadido recientemente a WPBakery Page Builder. Añádalo a la página y haga clic en Publicar.

4. Haga clic en el icono más para traducir la página. Esto le llevará a la pantalla del Editor de traducción avanzado.
5. Asegúrese de que los elementos textuales del módulo se muestran en el Editor de traducción avanzado.
6. Introduzca sus traducciones y confírmelas con la marca de verificación verde. Una vez que haya terminado, haga clic en el botón Completo.

7. Compruebe la página traducida en el front-end.

La página traducida muestra todas las cadenas traducidas, lo que implica que el archivo de configuración de idioma actualizado funciona correctamente.

Tenga en cuenta que los estilos CSS para los elementos de la página del idioma original se copian al idioma de traducción. Esto asegura que todo se vea correctamente entre los idiomas. Si desea deshabilitar esta función, consulte este artículo para obtener instrucciones.

Si tiene algún problema, contacte con nuestro equipo de desarrollo de compatibilidad. Estarán encantados de revisar los problemas relacionados con el archivo de configuración de idioma.

Una vez terminadas las pruebas, envíe un merge request a nuestro repositorio. Nuestros desarrolladores de compatibilidad recibirán su solicitud y la revisarán.

Tenga en cuenta que el archivo de configuración de idioma alojado en nuestro repositorio es para la versión predeterminada de WPBakery Page Builder. En caso de que esté actualizando el archivo de configuración de idioma de una versión personalizada de WPBakery Page Builder, aplique los cambios al archivo de configuración dentro de la carpeta raíz de su plugin.