使用浮动条和可变字体提升您的网站,通过增强 CSS 加载等提高性能!
目录
我们很高兴推出 Elementor 3.24,此更新将您的网站构建体验提升到一个新的水平,重点关注性能、转化率、设计灵活性和访客体验。在此更新中,我们添加了几个强大的功能,包括浮动栏、可变字体和增强 CSS 加载 – 每个功能都提供独特的优势,可帮助您创建更快、更动态的网站。
浮动栏:访客滚动浏览时始终可见的置顶消息
通过持续的可视性增强用户参与度
在当今快节奏的数字世界中,将重要信息放在最显眼的位置至关重要。这就是我们新推出的浮动栏的作用所在。此功能允许您创建固定栏,这些栏在用户滚动浏览您的页面时保持可见,确保您的关键信息(无论是促销优惠、重要通知还是号召性用语)始终可见。
Elementor 3.24 包含30 多个预先设计的模板和 3 种主要浮动栏类型:
行动号召 (CTA) 栏 – 用于突出显示页面顶部或底部的重要行动号召按钮。适用于所有 Elementor 用户。
行情栏 – 用于循环显示持续更新和促销信息,吸引访客。仅适用于 Elementor Pro。
优惠券栏 – 用于推广只需单击即可复制的优惠券代码。仅适用于 Elementor Pro。
Floating Bars 的持续可见性旨在通过确保您最重要的信息永远不会丢失来提高访客参与度。此功能对于进行促销的电子商务网站、鼓励订阅简报的博客或任何用户互动是成功关键的网站尤其有用。
灵活定位,实现最佳效果
但浮动栏不仅关乎可见性,还关乎灵活性。您可以将这些栏放置在屏幕的顶部或底部,自定义其外观以完美匹配您网站的设计,并且借助显示条件,您可以控制其行为,例如何时以及如何显示。这意味着您可以打造一种不仅引人入胜而且经过精心设计的访客体验,以推动转化并让访客随时了解最新信息。
例如,如果您正在推出限时优惠,在页面顶部放置浮动栏可以让促销活动始终处于最显眼的位置,促使用户立即采取行动。相反,底部的浮动栏可以起到微妙的提醒作用,提醒用户注册新闻简报或查看特色产品。
无缝设置和定制
在这里启动您的公司。此外,最新邮件 2024 年更新的全球电话号码列表 数据库中提供了来自世界各地的大约 5 亿个手机列表。在这里,您可以获得任何国家/地区的手机营销列表。
最后,对于最新邮件数据库组织来说,使用手机号码列表的客户数量正在增加。我们的客户都持续购买我们的潜在客户。此外,中国、香港、越南、柬埔寨和新加坡是我们的主要客户。因此,您可以依赖最新邮件数据库作为您的数据源的合作伙伴。
设置浮动栏毫不费力。首先,通过导航至 WP 仪表板 > Elementor > 设置 > 功能,确保已激活“Flexbox 容器”功能。添加新的浮动元素(WP 仪表板 > 模板)后,系统将提示您在浮动栏或浮动按钮之间进行选择。从 30 多个可用模板中选择一个,然后通过自定义设计、图标、文本内容、CTA 链接等,将浮动栏打造为您自己的浮动栏。Elementor Pro 用户还可以利用显示条件来指定浮动栏的显示位置、时间和对象,从而增强针对性和有效性。
浮动栏 1 介绍 Elementor 3.24:浮动栏、可变字体、增强的 CSS 加载等等!
图像优化器
加速您的网站
无限网站
上传大小无限制
批量优化
WebP 转换
开始免费试用
[专业版] 可变字体:通过精确的排版控制释放创作自由
利用动态排版彻底改变你的设计
排版是任何优秀设计的基石,在 Elementor 3.24 中,我们引入了可变字体,为您提供比以往更多的控制权。对于想要微调网站文本各个方面的设计师来说,此功能是一个改变游戏规则的功能。
可变字体允许您使用直观的滑块以单次增量调整粗细和宽度属性,确保完全控制文本自定义,从而实现更具动态性和吸引力的设计,增强视觉叙事和观众参与度。相比之下,使用静态字体时,您只能以 100 像素的固定增量调整文本粗细和宽度。
通过多种字体控制增强品牌一致性
如果您正在打造品牌形象,您可以轻松尝试不同的字体粗细和宽度,以找到最合适的字体。无论您需要醒目的醒目标题还是低调优雅的正文,可变字体都能让您灵活地获得最合适的字体。而且由于您使用的是可以完成所有工作的单个字体文件,因此您的网站仍然轻巧且快速。
这种排版控制的多功能性还意味着在整个网站上保持品牌一致性比以往更加容易。您可以确保标题、正文和其他排版元素与品牌的视觉形象完美契合,而无需使用多种字体变体。
开始使用可变字体
要设置可变字体,首先从您首选的平台(例如 Google Fonts)下载可变字体 TTF 文件。然后,转到 WP 仪表板 > Elementor > 自定义字体 > 添加新字体 > 添加可变字体,命名新字体,上传您的 TTF 文件,选择所需的粗细和宽度复选框,根据字体的属性设置值,然后发布。编辑文本并导航到排版控件时,您可以在字体系列选择顶部的“可变字体”下看到新字体。
获取 Elementor Pro
可变字体 1 Elementor 3.24 简介:浮动栏、可变字体、增强型 CSS 加载等!2
增强 CSS 加载:更智能、更快速、更高效
使用条件 CSS 加载优化网站性能
页面加载时间分秒必争,在 Elementor 3.24 中,我们通过条件 CSS 加载向优化网站性能迈出了重要一步。此功能旨在仅加载页面元素所需的 CSS,从而大幅减少可能拖慢网站速度的未使用代码量。
条件 CSS 加载的工作原理是分析您正在使用的特定小部件和元素,并仅加载这些组件所需的 CSS。这意味着,如果您不使用某个特定功能,则不会加载其 CSS,从而使网站更精简、更快速。事实上,这种增强功能最多可将CSS 大小减少 668KB!
通过更快的页面加载提升访客体验
例如,如果您的主页包含一个带有单个号召性用语按钮的英雄部分,则现在只会加载该布局和按钮所需的 CSS。所有其他不必要的 CSS 文件都将被排除在外,确保您的页面尽快加载。这对于具有各种小部件和元素的复杂网站尤其有益,在这些网站上,最大限度地减少 CSS 膨胀可以显著提高性能。
通过改进样式缓存最大限度地减少累积布局偏移
更快的加载时间不仅可以提高访问者满意度,还可以对 SEO 产生积极影响,帮助您的网站在搜索引擎结果中排名更高。为了履行我们大幅提升网站性能的承诺,我们在此版本中优化了 Elementor 小部件的 CSS 资源加载方式,从而减少了累积布局偏移 (CLS)。借助我们新的“样式依赖项缓存”系统,小部件样式会在第一次访问时缓存,然后在后续访问时从缓存中加载到 <head> 中。这通过确保在页面加载过程中更早地应用样式来最大限度地减少 CLS,从而带来更流畅、更稳定的用户体验。
Css 加载 1 Elementor 3.24 简介:浮动栏、可变字体、增强型 Css 加载等! 3
更高级别的工作流程改进
[专业版] 精细调整显示条件,实现更好的控制
Elementor 3.24 通过改进显示条件的管理方式来增强您的工作流程。现在,当为元素设置显示条件时,结构面板中会出现一条垂直线和图标,清楚地指示活动的显示条件。单击图标可直接进入显示条件设置,使调整变得快速而直观。
此外,您现在可以跨元素和页面复制和粘贴显示条件,或者通过右键单击元素立即清除它们,从而进一步简化您的设计流程并节省宝贵的时间。
获取 Elementor Pro
使用 Elementor AI 在结构面板中生成容器名称
您网站上的每个页面可能都有几十个容器和小部件,当向页面添加新容器时,它们将在结构面板(以前称为导航器)中被简单地命名为“容器”。这 六月案例:国家创新日 可能是一个挑战,因为容器越多,保持井然有序和正确概览页面结构就越困难。到目前为止,为了获得更好的结构,您需要查看每个容器,想出一个相关的名称,然后在结构面板中逐个输入它。
借助人工智能的力量,这个问题将成为过去。Elementor AI 简化了您的工作流程并加快了网站交付速度,同时将您的专业指导放在首位。Elementor 3.24 对 Elementor AI 进行了重大更新,并增加了一项新功能:AI 生成的容器名称。它负责处理细节,因此您可以专注于大局。只需单击结构面板中的一个按钮,几秒钟内,您的所有容器就会根据其包含的内容自动重命名。
探索 Elementor AI
使用 Ai 重命名容器 1 介绍 Elementor 3.24:浮动栏、可变字体、增强的 Css 加载等等! 4
附加功能和更新
[专业版] 简化的搜索体验
在 3.24 版本中,Elementor 在 3.23 版本中引入的搜索小部件的基础上,结合用户反馈来增强其功能。搜索小部件的新更新包括:
显著缩短结果页面 URL,以简化访客体验。
主题生成器的直接按钮可更轻松地创建循环模板。
更好地控制结果下拉菜单的宽度以及搜索加载器的可见性和设计。
搜索小部件是编辑器的原生部分,不再需要手动激活。
获取 Elementor Pro
其他更新 1 Elementor 3.24
简介:浮动栏、可变字体、增强的 CSS 加载等! 5
Elementor AI 的退出选项
Elementor AI 工具可简化您的工作流程并加快网站交付速度,同时将您的专业指导放在首位。现在,您可以在将网站移交给客户时轻松关闭 AI 功能,确保他们只看到最终的、经过精心打磨的产品,没有任何 AI 元素。对于不想使用 Elementor AI 并想清理工作空间的人来说,禁用 AI 通知的功能也很有用。要关闭 Elementor AI,请转到 WP 仪表板 > 用户 > 个人资料,然后取消选中“启用 AI 功能”复选框。
更多更新
分类过滤器、简历中的链接和浮动联系按钮现在是编辑器的原生部分,不再位于功能页面中。
对于新网站来说,嵌套元素现在默认处于活动状态。
延迟加载背景图像已合并并移至性能设置。
可访问性 – 命名您的 Off-Canvas 小部件的新功能。
使用 Elementor 3.24 解锁新可能性
Elementor 3.24 包含大量功能和增强功能,让您可以比以往更轻松地创建令人惊叹、性能卓越的网站。无论您对可变字体的设计可能性、浮动栏的战略潜力还是条件 CSS 加载带来的性能提升感到兴奋,此更新都能满足每个人的需求。我们鼓励您立即升级到 Elementor 3.24 并探索它提供的所有新可能性。
获取 Elementor Pro
分享
寻找新鲜内容?
从我们的每周新闻通讯中获取文章和见解。
电子邮件
输入您的电子邮件地址
通过输入您的电子邮件,您同意接收 Elementor 电子邮件,包括营销电子邮件,
并同意我们的条款和条件以及隐私政策。
Roi Tal 的图片
罗伊塔尔
Roi 是 Elementor 的产 警报新闻 品营销经理,在 Editor Plugin 团队工作。他拥有音乐背景,在内容营销和广播方面经验丰富,以创造有意义的沟通方式而自豪,这些沟通方式能激发人们的共鸣和灵感。在业余时间,Roi 喜欢制作音乐、烹饪和看电影。
你可能还会喜欢
使用 AI 创建登陆页面的简单分步指南
克里斯蒂娜·斯塔尔
2024 年 8 月 27 日
0 条评论
利用 Elementor 的 Sell Pro 和 Pro+ 电子商务托管来提高销量
齐夫·格尔茨
2024 年 8 月 14 日
0 条评论