其他语言页面被缓存成 RTL 布局的现象，其实并不是 GTranslate 或 Elementor 的 bug，而是 WPRocket + Cloudflare 静态缓存机制 在多语言（含 RTL）环境下的缓存污染 (cache contamination) 问题。

🧩 一、问题原理：缓存污染是怎么发生的

当访问阿拉伯语（ar）页面时，GTranslate 在 <html> 标签上添加：

<html lang="ar" dir="rtl">

然后：

  1. WPRocket 会把这个页面缓存为静态 HTML；
  2. Cloudflare 也会缓存这个 HTML 文件；
  3. 当访客访问其他语言（例如英文或法语）时，
    • 缓存层可能直接返回带有 dir="rtl" 的阿语版本；
    • 导致整个英文页面也变成右到左排版。

⚠️ 所以，你看到的“英文也反转”并不是 Elementor 翻车，而是缓存命中了“阿语版本”。

🧭 二、解决方向（必须让不同语言有独立缓存）

你的目标是：

让 WPRocket 和 Cloudflare 分别缓存不同语言的页面，不互相污染。

✅ 三、完整解决方案（推荐做法）

✅ 第一步：让 Cloudflare 识别不同语言 URL

GTranslate Pro 默认语言切换 URL 结构：

/en/
/fr/
/ar/

这意味着不同语言本身有不同的 URL 路径。

➡️ 所以，在 Cloudflare 中：

  1. 不要对整个域名一刀切缓存；
  2. 可以让 Cloudflare 根据路径分别缓存。

建议设置：
在 Cloudflare → Rules → Page Rules 或 Cache Rules 添加规则：

条件缓存策略
example.com/ar/*Cache Everything（允许）
example.com/*（默认）标准缓存（尊重 WPRocket header）

这样 Cloudflare 不会把 /ar/ 的缓存返回给 /en/。

✅ 第二步：在 WPRocket 中强制区分语言缓存

编辑你网站的 wp-config.php，添加以下代码：

/**
 * Force WP Rocket to separate cache files per language.
 */
if ( function_exists( 'rocket_clean_domain' ) ) {
    add_filter( 'rocket_cache_subdir', function( $path ) {
        if ( isset($_SERVER['REQUEST_URI']) ) {
            if ( strpos($_SERVER['REQUEST_URI'], '/ar/') !== false ) {
                return 'ar';
            }
            if ( strpos($_SERVER['REQUEST_URI'], '/fr/') !== false ) {
                return 'fr';
            }
            if ( strpos($_SERVER['REQUEST_URI'], '/en/') !== false ) {
                return 'en';
            }
        }
        return $path;
    });
}

🧠 作用：

  • WPRocket 会为不同语言生成不同的缓存子目录；
  • 即使 HTML 结构不同（如 dir="rtl"），也不会互相污染。

✅ 第三步：确保 Cloudflare 不缓存动态翻译脚本

在 Cloudflare → Cache Rules → Exclude URLs 中排除以下路径：

*/?glang=*
*/gtranslate/*
*/wp-json/*

这些路径往往是 GTranslate 的内部请求或 AJAX 翻译接口，必须绕过缓存，否则会造成错误的 HTML 组合。

✅ 第四步（可选增强）：在页面加载时强制校正方向

为了防止极少数缓存错误情况（例如有人用错误的 HTML 缓存命中），可以在 Elementor → Custom Code 添加以下脚本（全局执行）：

<script>
document.addEventListener('DOMContentLoaded', function() {
  var htmlTag = document.documentElement;
  var lang = htmlTag.lang;

  // 如果语言不是阿拉伯语但方向错误，修复回 LTR
  if (lang !== 'ar' && htmlTag.getAttribute('dir') !== 'ltr') {
    htmlTag.setAttribute('dir', 'ltr');
  }

  // 如果是阿拉伯语但方向错误，修复为 RTL
  if (lang === 'ar' && htmlTag.getAttribute('dir') !== 'rtl') {
    htmlTag.setAttribute('dir', 'rtl');
  }
});
</script>

这样即使缓存出错，也能在前端即时修正页面方向。

🚀 五、最后的清理步骤（非常关键）

完成以上配置后：

  1. 清空 WPRocket 缓存
    → WP 后台 → WPRocket → 清空所有缓存
  2. 清空 Cloudflare 缓存
    → Cloudflare Dashboard → Caching → Purge Everything
  3. 打开：
    • /ar/ 页面，确认 dir="rtl"
    • /en/ 页面，确认 dir="ltr"
  4. 再切换多次语言，确认不会出现反转或继承错误。

🎯 六、总结（适配你的环境）

项目建议
缓存插件✅ WPRocket 支持多语言缓存子目录
CDN 缓存✅ Cloudflare 分语言路径缓存
HTML 方向修复✅ 加 JS 自动校正
最终效果英文/法语保持 LTR，阿语正常 RTL，互不污染