新功能：Off-Canvas Widget
Elementor 3.22 引入了新的专业设计工具 Off-Canvas Widget，它可以创建交互式页面布局并提升用户体验。
功能特点：
- 交互式布局：通过单击链接打开和关闭容器，可以设计出更具互动性的页面。
- 例如，可以将 Off-Canvas Widget 连接到“注册”按钮，点击后打开一个包含表单的小部件。
- 嵌套元素支持：Off-Canvas Widget 的内容区域可以作为容器使用，支持放置其他小部件，如表单。
- 允许使用常规容器的所有设计功能对其进行样式化。
- 动态标签设置：在链接设置中，点击动态标签按钮可以选择连接到特定的 Off-Canvas Widget。
- 例如，页面上有多个 Off-Canvas Widget 时，它们会显示为“Off-Canvas Widget 1”或“Off-Canvas Widget 2”等。
- 可以选择链接触发打开、关闭或两种行为。
- 品牌个性化：可以个性化小部件的进入和退出动画样式和持续时间。
- 控制交互的行为，如设置何时以及如何退出覆盖层，防止页面滚动。
- 设置覆盖效果的样式，可以选择打开或关闭覆盖层，更改颜色，或选择图像。
- 定义容器的 HTML 标签。
- 样式自定义：在“样式”选项卡中，自定义 Off-Canvas Widget 的外观，如颜色、字体和布局等。
使用步骤：
- 将 Off-Canvas Widget 放置在页面的任何位置。
- 单击编辑面板中的“编辑模式”控件，在编辑器中打开和关闭它。
- 在链接的设置中，点击动态标签按钮，选择触发打开、关闭或两种行为。
- 前往 WordPress 仪表板 → Elementor → 功能激活“嵌套元素”。
新功能：Elementor 缓存
Elementor 3.22 引入了新的缓存功能，通过缓存小部件的输出来显著提高网站性能。
性能改进：
- 内存使用减少：内存使用量从 3MB 减少到 8KB。
- TTFB 提升：首次字节时间 (TTFB) 提升 33%-70%。
缓存管理：
- 静态与动态内容区分：缓存功能区分静态和动态小部件，仅缓存静态内容。
- 动态小部件（如包含访问者特定信息的小部件）不缓存。
- 缓存设置：在编辑面板中的高级选项卡中，可以控制特定小部件的缓存设置。
- 例如，可以激活或停用小部件的缓存功能。
激活步骤：
- 前往 WordPress 仪表板 → Elementor → 功能激活“元素缓存”。
- 在 WordPress 仪表板 → Elementor → 性能中，控制缓存设置和缓存时间。
其他性能更新
原生 JS 替换 JS 库
- 提升前端性能：将外部 JavaScript 库（如 Waypoint.js）替换为原生的 JavaScript 解决方案。
- 这种替换使用更现代的代码，提高了性能和 SEO 分数。
- 替换后减少 18KB 内存使用。
- 向后兼容性：为了保持与第三方插件的向后兼容性，旧的 JavaScript 库将在未来版本中保留，但仅在插件开发者将其设置为依赖项时才会被激活。
新的“性能”选项卡
- 集中管理性能功能：所有稳定的性能功能都集中在新的“性能”选项卡中，方便用户激活或停用。
- 用户可以在此选项卡中探索并激活与网站相关的性能改进功能。
激活步骤：
前往 WordPress 仪表板 → Elementor → 设置 → 性能。
总结
Elementor 3.22 通过以下方式显著提升网站性能和用户体验：
- 新增 Off-Canvas Widget：构建交互式布局，提升用户参与度。
- 引入缓存功能：优化小部件加载时间，提高网站性能。
- 原生 JS 替换外部库：清理网站代码，提高前端性能。
- 新的性能选项卡：集中管理性能改进功能，简化优化流程。
这些新功能和改进不仅提高了网站的加载速度，还简化了性能优化的管理流程，帮助用户更轻松地构建快速且引人入胜的网站。
需要工程师帮你判断？
开始初诊把症状、错误提示和最近改动发过来。
我们先判断风险、可能原因和安全下一步，再决定是否需要登录后台或服务器。