MultiLang Elementor

Plugin de WordPress para traducciones por directorio URL, compatible con Elementor. Sin JavaScript en el frontend — todo se procesa a nivel servidor (PHP).

Estructura de URLs generada

hola.com/          → idioma por defecto (ej: inglés)
hola.com/es/       → español
hola.com/fr/       → francés
hola.com/es/about  → página About en español
hola.com/fr/blog   → Blog en francés

Instalación

1. Subir la carpeta multilang-elementor/ a /wp-content/plugins/
2. Activar el plugin desde Plugins → Plugins instalados
3. Ir a MultiLang → Configuración y elegir los idiomas
4. Hacer clic en Escanear strings del sitio
5. Ir a MultiLang → Traducciones y completar las traducciones

Estructura de archivos

multilang-elementor/
├── multilang-elementor.php       ← Archivo principal
├── includes/
│   ├── class-mle-settings.php   ← Configuración
│   ├── class-mle-router.php     ← Routing de URLs por idioma
│   ├── class-mle-translator.php ← Motor de traducción (output buffer)
│   ├── class-mle-scanner.php    ← Extractor de strings
│   ├── class-mle-hreflang.php   ← Tags SEO hreflang
│   └── elementor-widget-switcher.php ← Widget Elementor
├── admin/
│   └── class-mle-admin.php      ← Panel de administración
├── assets/
│   ├── css/admin.css
│   ├── css/frontend.css
│   └── js/admin.js
└── locales/                      ← Archivos de traducción (como Shopify)
    ├── es.json
    └── fr.json

Formato de los archivos JSON (locales/)

{
  "Welcome to our site": {
    "source": "Welcome to our site",
    "target": "Bienvenido a nuestro sitio"
  },
  "Contact us": {
    "source": "Contact us",
    "target": "Contáctenos"
  }
}

También aceptá el formato simplificado:

{
  "Welcome to our site": "Bienvenido a nuestro sitio",
  "Contact us": "Contáctenos"
}

Cómo funciona (sin JavaScript)

1. Detección de idioma: Al llegar una request a /es/mi-pagina, el router detecta el prefijo es antes de que WordPress renderice nada.

2. Rewrite Rules: WordPress redirige internamente /es/mi-pagina al contenido correcto, sin redirect HTTP.

3. Output Buffer: Se inicia ob_start() con un callback PHP que reemplaza todos los strings del HTML generado antes de enviarlo al cliente.

4. Filtros de Elementor: Los hooks elementor/widget/render_content y elementor/document/get_elements_data permiten traducir el JSON de Elementor antes de renderizar.

5. Sin JS: El cliente recibe HTML ya traducido. No hay detección de idioma en el browser, no hay reemplazos DOM en runtime.

Uso en templates PHP

// Obtener idioma actual
$lang = MLE_Router::get_current_language(); // 'en', 'es', 'fr'

// Generar switcher de idiomas
echo MLE_Router::language_switcher_html();

// Generar URL en otro idioma
$url_es = MLE_Router::switch_language_url('es');

// Traducir un string manualmente
$text = MLE_Translator::translate_string('Welcome');

Shortcode

[mle_language_switcher]

Widget Elementor

Buscar "Language Switcher" en el panel de widgets de Elementor.

SEO

El plugin agrega automáticamente las etiquetas hreflang en el <head>:

<link rel="alternate" hreflang="en" href="https://hola.com/" />
<link rel="alternate" hreflang="es" href="https://hola.com/es/" />
<link rel="alternate" hreflang="fr" href="https://hola.com/fr/" />
<link rel="alternate" hreflang="x-default" href="https://hola.com/" />

Compatibilidad

• ✅ Elementor (Free y Pro)
• ✅ Elementor Pro Forms
• ✅ Yoast SEO (traduce title y metadescription)
• ✅ RankMath SEO
• ✅ WooCommerce (con hooks adicionales)
• ✅ Menús de navegación
• ✅ Widgets de texto
• ✅ Taxonomías y categorías

Agregar un nuevo idioma

1. Ir a MultiLang → Configuración
2. Marcar el idioma deseado y guardar
3. Hacer clic en Escanear strings para generar el archivo JSON
4. Ir a Traducciones y completar las traducciones

Editar archivos JSON directamente

Los archivos están en:

wp-content/plugins/multilang-elementor/locales/

Podés editarlos con cualquier editor de texto, importarlos/exportarlos, o versionarlos con Git.

Troubleshooting

Las URLs no funcionan (404) → Ve a Ajustes → Enlaces permanentes y guarda (esto regenera las rewrite rules).

Los strings no se traducen → Verificar que el archivo locales/{lang}.json tenga el campo "target" completo. → Limpiar cualquier caché (WP Rocket, LiteSpeed, W3 Total Cache, etc.).

Elementor no muestra las traducciones en el editor → Normal: las traducciones solo se aplican en el frontend para no interferir con la edición.