Este artículo invitado es presentado por Daan, de wplift.com. Recientemente ha lanzado EasyThemePacks, una fantástica biblioteca premium de plantillas de Elementor. Le mostrará exactamente cómo traducirlas con WPML.
Si es un usuario habitual de Elementor, probablemente ya esté bastante familiarizado con cómo Elementor le permite crear hermosos diseños sin necesidad de código. Pero, ¿puede Elementor ayudarle a crear también hermosos diseños multilingües?
Buenas noticias: ¡Con WPML, sí puede!
Al final de este tutorial, sabrá exactamente cómo puede empezar a crear sitios web multilingües construidos con Elementor, incluso si está utilizando la opción completamente en blanco de Elementor Canvas.
Qué necesita para crear un sitio web multilingüe con Elementor
Esto es todo lo que necesitará para seguir este tutorial:
- Una página que haya diseñado con Elementor: utilizaremos la plantilla Barista Bluegrass de EasyThemePacks, que es un diseño completo de página de destino basado en la plantilla en blanco de Elementor Canvas.
- WPML Multilingual CMS: esto es lo que le ayuda a crear un sitio web de WordPress multilingüe, incluido su contenido de Elementor.
También tendrá que asegurarse de instalar los demás componentes del paquete WPML Multilingual CMS, en particular WPML Traducción de cadenas y Gestión de traducción de WPML.
Una vez que tenga estos elementos básicos, ¡veamos cómo puede utilizar WPML para crear un sitio web multilingüe con Elementor!
Paso 1: Instale y active WPML CMS y sus componentes
Una vez que haya instalado WPML Multilingual CMS y sus componentes, puede usar el asistente de configuración de WPML para configurar sus ajustes básicos de idioma (como a qué idiomas le gustaría traducir sus diseños de Elementor).
Para este ejemplo, vamos a traducir nuestra plantilla al alemán (con Google Traductor; ¡disculpas por cualquier error a los puristas de la gramática alemana!):
Asegúrese de activar también el gestor de traducción (WPML le pedirá que lo haga en su escritorio; es difícil no verlo y solo tiene que hacer clic en un botón).
Paso 2: Vaya a la página de Elementor que quiera traducir
Una vez que haya establecido la configuración básica de WPML, vaya al editor del escritorio de WordPress para la página de Elementor que quiera traducir (no abra el editor de Elementor; quédese en el editor normal de WordPress).
Así es como se ve la plantilla Barista Bluegrass de EasyThemePacks en su inglés nativo:
¡En solo unos minutos, podremos traducirla al alemán!
Paso 3: Cree una nueva traducción para su diseño de Elementor
En el Editor de WordPress, haga clic en el icono + para crear una nueva traducción de su diseño de Elementor:
Esto abrirá un práctico editor en paralelo. En el lado izquierdo, verá toda la información de la traducción original en inglés. WPML extrae cada cadena individual de su diseño de Elementor, así como otros atributos útiles (como la URL a la que enlaza un botón para que pueda enviar a los usuarios a la traducción correcta).
Para empezar a traducir su plantilla de Elementor, solo tiene que introducir la traducción en el cuadro correspondiente del lado derecho:
A medida que avance, asegúrese de marcar cada traducción como La traducción se ha completado para que pueda saber rápidamente qué se ha hecho y qué falta por traducir. Además, aunque siempre puede guardar el trabajo parcial, no podrá mostrar su traducción en el front-end hasta que haya marcado todo como completo.
Una vez que termine sus traducciones y las guarde, ¡habrá terminado! Ahora, podrá editar su traducción existente siempre que lo necesite:
Y si va al front-end de su sitio, podrá acceder a la versión traducida de su página cambiando la URL según sus preferencias (¡en un segundo hablaremos más sobre cómo crear un selector de idiomas!).
Así es como se ve la versión traducida de nuestra plantilla de EasyThemePacks, incluida la estructura de la URL para que pueda ver cómo está todo localizado:
¿Qué ocurre si cambia el diseño original de Elementor?
En algún momento, probablemente se encontrará en una situación en la que quiera cambiar la versión original del diseño de Elementor.
Entonces, ¿qué ocurre? ¿Perderá su contenido traducido después de hacer los cambios?
¡No!
Si alguna vez utiliza la interfaz de Elementor para editar la traducción existente de su página, WPML simplemente marcará esas traducciones en el editor y le dará la opción de mostrar las diferencias:
WPML no hará nada con las cadenas ya traducidas que no se hayan cambiado. Por lo tanto, todo lo que tiene que hacer es actualizar el texto editado y ¡listo!
¿Qué pasa con el selector de idiomas en la plantilla Elementor Canvas?
Todos los diseños de EasyThemePacks se basan en el uso de la plantilla en blanco Elementor Canvas. Y si está creando sus propias páginas con Elementor, es muy probable que también utilice la plantilla en blanco Elementor Canvas.
Cuando utiliza esa plantilla, no hay un menú de navegación ni una barra lateral de su tema, que son los dos lugares donde normalmente añadiría un selector de idiomas con WPML.
Entonces… ¿cómo permite realmente a los visitantes acceder a la versión traducida de su plantilla de Elementor cuando está utilizando Elementor Canvas?
Aunque puede crear su propio selector de idiomas de WPML utilizando código, la forma más sencilla es simplemente incluir un shortcode del selector de idiomas en su plantilla de Elementor.
Para hacerlo, coloque el widget Shortcode de Elementor donde quiera que se muestre e incluya este shortcode:
{{wpml_language_selector_footer}}
Este shortcode extraerá la configuración de su selector de idiomas del pie de página de WPML. Para establecer esa configuración, vaya a WPML → Idiomas en su escritorio de WordPress y desplácese hacia abajo hasta la sección Selector de idiomas del pie de página :
Al hacer clic en el icono del lápiz, podrá configurar cómo funciona su selector de idiomas. Puede:
- Cambiar el diseño
- Elegir si desea mostrar o no los nombres de los idiomas y las banderas
- Elegir una nueva combinación de colores
- Configurar los estilos de los elementos individuales
Como consejo, utilizar el nombre del idioma es una gran opción, ya que permite a las personas buscar su idioma local utilizando CTRL + F.
Reflexiones finales sobre cómo traducir Elementor
Con el paquete WPML Multilingual CMS, es fácil traducir cualquier plantilla de página de Elementor, incluidas las basadas en Elementor Canvas, como las plantillas premium disponibles en EasyThemePacks. Puede ir cadena por cadena para traducir todo el contenido que construya con el maquetador visual de páginas de Elementor. Y si alguna vez hace algún cambio en su diseño original de Elementor en el futuro, WPML le ayudará a encontrar esos cambios para asegurarse de que también actualiza la versión traducida.
Por último, incluso si está utilizando la plantilla en blanco Elementor Canvas, puede incluir un selector de idiomas fácil de usar a través de los shortcodes de WPML o el método de código personalizado que hemos enlazado.
¿Tiene alguna otra pregunta sobre cómo traducir sus diseños de Elementor? ¡Deje un comentario!
