[版本 6.1] Essential Addons x WooCommerce:探索新的小部件来自定义 WooCommerce 单一产品页面
已发表: 2025-01-15Essential Addons — 排名第一的 Eelementor 插件,受到全球超过 200 万用户的信赖,不断推出小部件和扩展,使您的网络构建变得更轻松、更快捷。尽管如此,Essential Addons 的最新版本引入了 5 个功能强大的小部件,可以轻松自定义 WooCommerce 单一产品页面。编辑 WooCommerce 单一产品页面具有 PRO 依赖性,但现在,借助这些新的 Essential Addons 小部件,您可以免费获得相同的结果。

在本博客中,我们将探索 Elementor Essential Addons 的最新新增功能,并了解这些小部件如何改变您的单个产品页面,而无需花费您一毛钱。让我们深入了解一下。
Elementor 基本插件的所有新小部件概述
每次更新时,Essential Addons for Elementor 都会重新定义 Web 构建过程,其小部件库的最新添加内容也不例外。这一次,一切都集中在 WooCommerce 单一产品页面上。这些小部件提供了无与伦比的灵活性和定制选项。
要使用这些小部件,请确保您的站点上安装了另一个插件 Templately 。以令人惊叹且完全可定制的方式展示 WooCommerce 产品从未如此简单。
1. Woo 产品图片:以时尚的方式展示您的产品
吸引客户对您的在线产品在很大程度上取决于您如何展示产品形象的每一个细节。借助 Essential Addons 中的Woo 产品图片,您可以使您的 WooCommerce 单一产品页面脱颖而出并超越基础。该元素经过专门设计和开发,旨在创建令人惊叹的交互式画廊,具有缩放效果、悬停动画和适合您品牌的布局。
无论您是展示艺术品还是高科技产品,此小部件都可确保每个图像在各种尺寸的屏幕上弹出,从而提供无与伦比的购物体验,从而提高客户参与度并推动销售。
2. Woo 产品价格:定价变得完美
定价是消费者决定购买的关键因素。这就是为什么在 WooCommerce 商店中显示这些价格的方式可以发挥重要作用的原因。 Essential Addons 为您带来了Woo 产品价格小部件,旨在让您完全控制产品定价的外观,没有任何麻烦。
这个小部件确保您不仅仅是在页面上放置数字,而是可以自定义从字体样式、大小到颜色等的所有内容。它确保您的价格与商店的品牌相符并吸引客户的眼球。您可以突出显示您的销售价格和原始价格,这样您的定价看起来更加专业和精致,有助于吸引客户。
3. Woo 添加到购物车:简化购物体验
在客户进行结账之前,最后一个检查点是购物车功能。对于任何电子商务商店来说,让这一切变得简单和无缝至关重要。通过Woo 添加到购物车小部件,您可以提升商店的购物车界面并创建可促进转化的无缝购物体验。
然而,这个强大的元素提供了一系列旨在优化用户参与和增强功能的功能。使用“快速添加到购物车”按钮为您的商店增添一抹活力,并配有流畅的动画,为购物者创造愉快的互动。
4. Woo 产品评级:通过评论建立信任
在帮助用户做出购买决策时,客户评论和评级始终发挥着举足轻重的作用。借助评论和评级,您可以为潜在买家提供有关产品质量和用户满意度的宝贵见解。借助Woo 产品评级小部件,您可以以视觉上有吸引力且高度可定制的方式展示这些评级,从而提高 WooCommerce 商店的可信度。
该小部件允许您显示具有可调整大小和颜色的星级评级。它确保它们与您的品牌美学完美契合。无缝对齐选项可以轻松地将评级自然地整合到产品页面中,从而保持简洁和专业的设计。
5. 面包屑:轻松导航
新添加的 Essential Addons面包屑可以帮助您改善商店的导航和用户体验。这个强大的工具不仅可以帮助用户轻松追踪他们的浏览路径,还可以增强网站的 SEO 性能。通过创建具有视觉吸引力和实用性的面包屑路径,您可以使导航更加直观且对客户而言更易于访问。

该元素提供了多个可自定义的选项,可帮助您定制样式、层次结构显示和分隔符,以无缝匹配您的网站设计。其 SEO 友好的标记可确保更好的搜索引擎排名,使其成为任何网站的有价值的补充。
如何使用这些小部件自定义 WooCommerce 单一产品页面?
所有这些小部件可让您通过滑块、响应式布局等功能以更具交互性的方式设计 WooCommerce 单一产品页面。让我们按照下面的分步指南来了解如何使用此 WooCommerce 元素。
注意:在开始配置 Essential Addons Woo 产品图像元素之前,请确保您已在站点上安装并激活了WooCommerce 插件和全站点编辑可用主题或插件。我们在这里使用Templately来免费访问 FSE。
为了向您展示如何使您的 WooCommerce 单一产品页面脱颖而出,我们将在此处使用 Woo 产品图像小部件配置。完全相同的过程也可以应用于其他小部件。
如何激活 EA Woo 产品图片?
要激活 EA Woo 产品图像,请导航至“Essential Addons”→“Elements”,然后从管理仪表板中选择“WooCommerce Elements”选项卡。然后,打开以启用“Woo 产品图片”元素。一旦您点击“保存设置”按钮,该元素将立即启用。

如何使用模板在单个产品页面中添加 EA Woo 产品图像小部件?
要在 Essential Addons for Elementor 中配置 Woo 产品图像,您需要通过插件或主题在 WordPress 网站中拥有完整的网站编辑功能,以编辑单个产品页面模板。我们正在使用 FSE模板主题生成器。
导航到 WordPress 仪表板菜单中的 Templately → Theme Builder,单击“添加新模板”按钮,选择“Elementor”,然后从下拉列表中选择模板“Product Single”,添加模板名称并单击“创建模板”按钮。您的产品单页模板将在 Templately 主题生成器上创建。

如何在 Essential Addons 中配置 EA Woo 产品映像?
在模板页面上,要显示您的产品,请单击“+”图标并在目录中搜索“Woo Product Images”,然后将小部件拖放到页面部分。现在,您可以在不同选项卡的小部件设置中配置单个产品图像。

内容
在“内容”选项卡下,您将看到多个选项,例如图像分辨率、效果、分页、导航、缩略图等的显示/隐藏切换按钮。您可以配置这些设置以根据需要自定义 Woo 产品图像的内容。

风格
配置完 Woo 产品图像部分的内容后,就可以对其进行样式设置了。单击“样式”选项卡可自定义产品图像的不同区域。根据需要设计产品图像的不同方面,例如销售 Flash、其颜色、图像、图像弹出窗口、缩略图和导航。

先进的
在“高级”选项卡中,您可以对产品图像部分的布局进行更改,还可以根据您的需要应用内容保护、高级工具提示、条件显示等功能。
在单个产品图像模板上配置 EA Woo 产品图像小部件后,现在是时候使其上线并将该页面引入 WordPress 作为默认的单个产品图像页面。
点击“发布”按钮,然后单击“添加新条件”按钮将此页面配置为默认单个产品模板页面。按此顺序设置条件,包括然后单数,然后产品和全部。设置条件后,点击“保存并关闭”按钮。

您可以如此轻松地添加和配置 EA Woo 产品图像并显示引人注目的产品图像,以提高您的 WooCommerce 商店转化率。按照类似的步骤,您可以使用其他小部件来制作吸引访问者并提高 WooCommerce 销售额的产品页面。
使用基本插件改造您的 WooCommerce 商店
Essential Addons 带来的元素是自定义 WooCommerce 单一产品页面的游戏规则改变者。无论您是想创建令人惊叹的产品图库、专业地展示定价、简化购物体验、通过评级建立信任,还是通过面包屑改进导航,这些小部件都提供了终极解决方案 - 全部免费。
这是您的 WooCommerce 单一产品页面,更具可定制性,并带来对话和销售。要了解即将推出的更新和版本,请不要忘记订阅我们的博客并加入我们友好的Facebook 社区。