购物趋势正在迅速变化，人们比以往任何时候都更倾向于在网上购物。
这就是为什么他们越来越需要电子商务商店来满足网上购物的习惯，因为人们发现网上购物比外出购物更方便。
您还可以使用正确的工具和设置立即启动您的电子商务商店。 您会发现您的销售额在创纪录的时间内急剧增加。
如果您计划开设一家电子商务商店并寻找 WordPress 专家来为您完成这项工作，让我告诉您，您不需要任何专家。
是的！ 您可以自己完成此操作，因为您不需要成为 WordPress 开发人员或编码专家，并且无需具备任何编码知识即可使用正确的工具和设置来完成此操作。
Elementor 页面构建器创建 WooCommerce 商店页面的分步教程即可
让我们深入挖掘一下，进入正题！
- 使用 Elementor 创建产品页面需要什么？
- 如何安装 Elementor 页面构建器？
- 逐步创建 Elementor WooCommerce 产品页面
- 移动设备优化您的 WooCommerce 产品页面
- Elementor Pro 定价
- 包起来
使用 Elementor 创建产品页面需要什么？
安装 WooCommerceplugin，除此之外，您还需要安装Elementor 页面构建器。 免费版本可以从 WordPress.org 下载，但免费版本的自定义选项有限。 因此，如果您想获得无限的自定义选项，请选择专业版 Elementor 并从官方 Elementor.org 下载。
如何安装 Elementor 页面构建器？
- 对于 Elementor 免费版：
转到Plugin> 添加新插件 > 进入 Elementor 页面构建器 > 单击安装并激活。
- 对于 Elementor Pro：
从 Elementor.com 购买专业版，然后上传 zip 文件，然后单击安装并激活。
逐步创建 Elementor WooCommerce 产品页面
标准的 WooCommerce 产品页面看起来就像任何基本的 WooCommerce 产品页面，没有任何清晰的内容。
但是，如果您想添加品牌的声音，那么您必须对其进行独特的定制。
第 1 步：从仪表板菜单转到模板部分，然后单击“添加新”。
现在从下拉菜单中选择“单一产品”项目
最好的部分是，Elementor 附带了一些预制的产品页面模板，因此，如果您想快速启动，请从选项中选择最接近您所需的选项。
从预制模板创建产品页面比从头开始创建要容易得多。 因此，修改任何现有模板即可节省您的时间和精力。
我们为我们的产品页面选择了此模板。
选择您喜欢的模板后，它将引导您进入 Elementor 编辑器，您可以在其中根据您的喜好自定义模板。
在这里您可以在左侧菜单上看到不同的块。 拖放您喜欢使用的块。
单击“+”添加按钮并选择您要添加的列大小。
我们为产品模板选择了两列大小。
现在，在右列添加产品标题小部件，并在其上添加产品的标题。
添加产品标题后，下一步就是在其上方添加“Woo breadcrumbs”。
现在，在左列中添加产品图像，然后从左列中拖放产品图像小部件。
您可以向两列添加填充，以使它们彼此稍微分开。
添加图像并根据所需尺寸调整填充后，在产品标题下添加产品评级小部件。
在产品评论块下方添加产品小部件的简短描述。 您还可以调整两个块之间的空间。
完成产品描述和所有详细信息后，我们的下一步是添加产品的价格，为此，您必须将价格小部件拖放到产品描述下。
在产品描述下方添加价格选项卡后，您可以通过从左侧菜单中选择选项来自定义价格小部件。 您可以放大图标，更改字体样式以及字体颜色从黑色到您选择的任何其他颜色。
现在添加小部件“添加到购物车”，并根据需要从菜单中自定义其颜色、字体或样式。
现在，在价格小部件下添加产品元数据，该元数据将显示产品类别和产品序列号。
步骤 2： 在下一部分中添加有关产品的其他信息。
创建一个新的两列部分，然后添加产品数据选项卡，包括描述、附加信息和评论。 并在栏右侧添加相关产品部分。
要保持每列的格式相同，您可以单击每列的左上角，然后复制并粘贴每列的列格式。
第 3 步：添加另一个部分或添加“追加销售部分”。
以下是添加后追加销售部分的外观。 添加一些填充以对齐该部分。
最后，您完成了产品页面设计。 现在，最后一步是您想在哪里发布您的产品？ 您可以点击发布，或者进入左侧菜单最下角的眼睛部分，点击设置来选择产品的类别。
单击添加条件菜单，然后选择产品的类别并单击发布。
移动设备优化您的 WooCommerce 产品页面
由于大量流量将通过智能手机进行，因此您必须针对智能手机查看来优化您的商店，否则您可能会损失销售额。
尽管 WooCommerce 已经针对移动设备进行了优化，但要确保您的产品页面模板在移动屏幕上看起来绝对不错，请按照以下步骤操作。
您将在 Elementor 界面的左下角找到“响应模式”选项。
当您单击“移动响应”选项时，您可以在移动、桌面和选项卡查看选项之间切换。
如果您发现任何复杂情况，请单击您想要查看和调整设计的任何选项。
现在，保存并继续发布您的产品页面。
Elementor Pro 定价
Elementor 基本版免费提供，而专业版则附带三个许可证。 如果您正在寻找个人博客或单个站点，那么个人许可证最适合您，您可以在其中获得 WooCommerce 构建器以及 90 多个专业小部件。
而 plus 和 Expert 许可证则适合分别支持 3 个站点和 1000 个站点的成熟企业或机构。
包起来
Elementor 页面构建器的唯一目的是使用户能够在不依赖编码的情况下释放他们的创造力。 Elementor 附带各种小部件，可让您根据有吸引力的布局创建任何类型的产品页面。 基本的 WooCommerce 元素有 10 多个，使用户能够自定义商店页面的每个扭结和曲线。 如果您在 Elementor 菜单中找不到所需的元素，请不要担心！ 还有许多其他高级设置可以升级您的武器库并向您的库添加多个元素。 其中之一是Essential Add-ons ，仅包含 WooCommerce 专用元素。
