如何自定义 WooCommerce 产品页面(无代码方法)

您想在无需编写任何代码的情况下自定义 WooCommerce 产品页面吗?

通过自定义您的 WooCommerce 产品页面,您可以提高转化率并从现有网站访问者那里获得更多销售额.

在本文中,我们将向您展示如何在没有任何技术知识的情况下自定义 WooCommerce 产品页面.

How to customize WooCommerce product pages (no code method)

为什么要在 WordPress 中自定义 WooCommerce 产品页面?

您的 WooCommerce 产品页面是您在线商店中一些最有价值的页面.问题是默认的 WooCommerce 产品页面没有针对转换进行优化.

通过自定义您的 WooCommerce 产品页面,您可以创建独特的产品登陆页面,以更高的速度将您的访问者转化为客户.

这意味着您的商店无需额外流量即可赚取更多收入.

在开始自定义 WooCommerce 产品页面之前,您需要确保拥有最快的 WooCommerce 托管来支持您的在线商店,因为速度会影响转换.

话虽如此,让我们来看看如何无需代码即可自定义 WooCommerce 产品页面.

如何在 WordPress 中自定义您的 WooCommerce 产品页面

SeedProd 是超过 100 万个网站使用的最佳拖放页面构建器.它可让您轻松自定义 WooCommerce 产品页面并促进销售.

您需要做的第一件事是安装并激活 SeedProd 插件.有关更多详细信息,请参阅有关如何安装 WordPress 插件的分步指南.

注意:您可以使用免费版本的 SeedProd,但在本教程中,我们将展示专业版,因为它具有内置的 WooCommerce 块.

激活后,您需要访问SeedProd »设置并输入您的许可证密钥.

Enter SeedProd license key

您可以在 SeedProd 网站上的帐户下找到此信息.

接下来,您需要访问SeedProd »页面,然后点击"添加新着陆页".

Add new SeedProd landing page

在下一个屏幕上,系统会要求您选择一个模板.SeedProd 有数十种专业设计的模板可供选择.

由于您正在构建一个高转化率的 WooCommerce 产品页面,请选择"销售"选项,然后选择其中一个模板.

只需单击模板即可将其选中.

Select SeedProd page template

我们将使用"晚餐销售页面"模板,但您可以选择任何您喜欢的模板.

接下来,系统会要求您为页面命名,然后单击"保存并开始编辑页面"按钮.

Name WooCommerce product page

这将启动拖放页面构建器界面.

您将看到所选模板的实时预览,您可以在其中指向并单击以选择和编辑页面上的任何项目.

SeedProd page editor screen

左栏有新的区块,您可以添加到您的产品页面.

接下来,我们将添加一些块,使该页面更像 WooCommerce 产品页面.

首先,点击图片并将其替换为您的产品图片.您将上传一张图片或从您的媒体库中选择一张图片.

Edit product image

之后,您可以通过点击这些项目并直接在页面编辑器中更改它们来更改产品标题和文本.

左侧菜单可让您更改大小、对齐方式等.

Change product headline and copy

最后,我们将添加一个"添加到购物车"按钮,就像标准的 WooCommerce 产品页面一样.

您需要找到"添加到购物车"WooCommerce 块并将其拖到您的页面上.

Insert add to cart button

现在您已经了解了 WooCommerce 产品页面的基础知识,我们将向您展示如何添加可以提高转化率的项目.

首先,让我们添加产品星级,以向您的客户表明您的产品是高质量的.

只需将"星级"块拖放到页面预览中您希望它显示的位置.

Add star rating block

您可以完全控制星星的数量、大小、总评分等.

之后,我们将添加一个客户推荐块.添加产品推荐可以帮助提高您的社交证明和产品转化率.

如果您正在寻找一种收集客户推荐的方法,请参阅我们的 WordPress 最佳推荐插件列表.

要添加推荐,只需将"推荐"块拖到您想要显示的页面上.

Add product testimonials block

您可以完全自定义推荐、添加图像和更改推荐文本.

点击推荐项目后,您可以更改左侧菜单上的所有显示选项.

如果您想添加多个推荐,请点击"添加推荐"按钮.这将自动为您的客户推荐创建轮播.

Customize product testimonials

接下来,您可以添加产品常见问题部分,类似于亚马逊产品页面上的问答部分.

单击"手风琴"块并将其拖到您的页面上,然后单击该项目以显示左侧的编辑屏幕.

Add FAQ drop down accordion

您可以在此处添加另一个常见问题下拉列表,更改字体大小、颜色等.

您可以直接在页面预览中更改常见问题解答文本.

Customize product FAQ text

将上述 SeedProd WooCommerce 块添加到您的产品页面将有助于提高您的转化率.

SeedProd 有一些额外的 WooCommerce 块,您也可以添加到您的产品页面.

如果您正在进行春季赠品特卖或黑色星期五特卖,那么您可以使用"倒计时"块来制造紧迫感.

Product countdown timer

您可能还想通过使用"特色产品"或"评分最高的产品"块来突出显示您商店中的其他产品.

要添加其他块,只需按照上述相同的步骤操作即可.

WooCommerce featured products block

有关将热门产品添加到 WooCommerce 的更多详细信息,请参阅我们关于如何在 WooCommerce 产品页面上显示热门产品的指南.

您可以通过使用其他块和调整设置菜单来继续自定义您的产品页面.

Publish WooCommerce product page live

完成产品页面的自定义后,请确保点击"保存",然后从下拉菜单中点击"发布"以使您的页面生效.

您所做的产品页面自定义将更容易将您的访问者转化为买家.

WooCommerce product page customized

如何改善您的 WooCommerce 产品页面转换(2 种方式)

自定义 WooCommerce 产品页面后,您可以使用以下动态元素进一步提高商店转化率.

在 WooCommerce 中添加购买活动通知

第一种方法使用社交证明通知来提醒您的访问者其他人刚刚进行了购买.这使用 FOMO 来简单地改善您的转换.

向 WooCommerce 添加社交证明的最佳方式是使用 TrustPulse.它是市场上最好的 WordPress 弹出式插件和社交证明应用程序之一.

它允许您轻松地在您的 WooCommerce 网站上显示实时购买通知.

TrustPulse real-time purchase notifications

有关更多详细信息,请参阅我们的指南,了解如何在您的 WordPress 网站上使用 FOMO 来增加转化率.

在 WooCommerce 中创建个性化营销活动

第二种方法使用动态文本,以便您可以向访问者显示定制的营销信息.借助动态文本,您可以显示访问者的姓名、位置,甚至是星期几.

它允许您在正确的时间向正确的人展示个性化消息,从而大大提高您的参与率和转化率.

添加动态文本的最佳方式是使用 OptinMonster.它是 WordPress 的最佳弹出窗口和电子邮件捕获工具,已被超过 120 万个网站使用.

OptinMonster WooCommerce

首先,您需要访问 OptinMonster 网站并创建一个帐户.您至少需要 Pro 级别的计划才能使用智能标签创建动态文本.

接下来,您需要安装并激活 OptinMonster 插件.有关更多详细信息,请参阅有关如何安装 WordPress 插件的分步指南.

此插件将您的 WordPress 网站连接到 OptinMonster 应用程序.

激活后,您需要输入您的许可证密钥.您可以在 OptinMonster 网站上的帐户下找到此信息.

在您的 WordPress 仪表板中,转到 OptinMonster »设置,点击"连接现有帐户"并输入您的帐户详细信息.

Connect OptinMonster account

接下来,您需要将 OptinMonster 与 WooCommerce 连接起来.

这为您提供了可用于自定义广告系列的其他显示规则.在同一页面上,点击"自动生成密钥 + 连接 WooCommerce".

Connect OptinMonster and WooCommerce

连接到 OptinMonster 后导航到 OptinMonster »广告系列,然后点击"新增"按钮.

这将带您进入 OptinMonster 活动构建工具.

Create new OptinMonster campaign

有数十种模板可供您选择.

我们将创建一个带有 WooCommerce 智能标签的弹出窗口.为此,请选择"弹出"广告系列类型并选择其中一种模板.

我们将选择"优惠"模板,但您可以选择任何您喜欢的模板.

Select OptinMonster template

只需将鼠标悬停在模板上,然后点击"使用模板".

为广告系列命名并单击"开始构建"后,您将被带到拖放式广告系列构建器.

OptinMonster campaign editor screen

您可以通过单击任何项​​目并在左侧菜单中对其进行自定义来自定义弹出窗口的每个部分.

我们将在标题中添加动态文本,以便显示今天的日期并为我们的访问者提供仅在当天有效的优惠券.

首先,双击任何文本元素以显示菜单.然后,单击"智能标签"图标"{}"以显示可用智能标签的下拉列表.

Select dynamic smart tag

只需点击您要添加到广告系列中的智能标签即可.

智能标签使用动态生成的文本为访问者提供独特的自定义消息.

Save dynamic text popup

完成自定义弹出窗口后,请务必点击"保存".

之后,单击"发布"选项卡,然后选择"发布"选项.

Publish dynamic text popup

退出构建器后,您将进入一个屏幕,您可以在其中确认显示设置.

要确保您的弹出窗口是实时的,请将"可见性和"中的状态更改为"已发布"状态"元框,然后单击"保存更改".

WooCommerce popup visibility settings

带有动态文本的 WooCommerce 弹出窗口现在将显示在您的 WooCommerce 商店中.

您可以继续测试不同的动态文本和显示设置,看看哪些广告系列能给您带来最佳效果.

OptinMontster dynamic text popup

我们希望本文能帮助您无需编码即可自定义 WooCommerce 产品页面.您可能希望看到我们的 WooCommerce SEO 指南变得简单,以及我们为您的商店挑选的最佳 WooCommerce 插件的专家.

1
订阅评论
提醒
0 评论
内联反馈
查看所有评论