您是否曾经想创建一个包含所有或部分WooCommerce产品的可排序和可过滤的网格?

如果您经营WooCommerce商店,您就会知道WooCommerce已经带有专用的存档页面,可帮助您展示单个产品。如何创建wordpress woocommerce产品网格1

但是,根据您的销售产品,这并不总是展示产品的最有效方法。

在某些情况下,在网格中显示WooCommerce产品更为有效。

而且,如果这听起来像您遇到的情况,那您就很好,因为我将向您展示如何创建WooCommerce产品网格。

但是,如果您从未安装过WordPress,请发现 如何安装WordPress博客7步骤 et 如何找到,安装和你的博客激活WordPress主题 

然后回到为什么我们在这里。

您可以使用WooCommerce产品网格做什么?

虽然列表不完整,但在某些情况下,产品网格可以为访问者带来比常规存档页面更好的体验:

发现 如何使用WooCommerce插件在WordPress上安装在线商店

  • 批发商店 -如果您批发很多产品,给客户一种简单的方法来对网格进行排序或过滤可能比让他们浏览单个产品页面更为用户友好。
  • 产品目录 -同样,如果您只想显示易于浏览的产品目录,则AJAX排序/过滤器网格将节省客户的时间(并重新加载页面)。
  • 订单表格 -如果您要基于WooCommerce产品创建订单,则网格提供了一种非常简单的方法。 这也是显示餐厅菜单和接受在线订单的好方法。

如何创建WooCommerce产品网格

我们将使用该插件 WooCommerce产品表该插件仅专注于产品网格的创建。 并且由于其接口参数和 SHORTCODE,您几乎可以自定义网格工作方式的每个方面。

另请阅读我们的指南: 如何增加在你的WordPress博客上花费的时间

我认为以下是一些最有用的功能:

  • 轻松添加或删除列 您甚至可以添加包含自定义字段或自定义分类法的列,并且WooCommerce产品表与高级自定义字段完全集成。
  • 包括4过滤器小部件。 通过侧边栏中的过滤选项,您可以为读者提供无缝的体验。
  • 产品变体/属性支持。 从3种不同的方法中进行选择,以在网格中显示产品变体。
  • 多选框。 通过允许客户在将多种产品添加到购物车之前选择多种产品,它有助于创建订单。
  • 即时搜索,排序和过滤 。 客户无需重新加载页面即可操纵您的网格数据。
  • 加入购物车 。 同样,客户可以将产品添加到购物篮中,而无需重新加载页面。
  • 延迟加载支持。 有助于提高大型网格的性能( 尽管这会影响提供即时排序或过滤的可能性 )

这是使用此插件的方法...

1步骤:配置默认网格功能

安装并激活插件后,首先要做的是为网格配置默认功能。 查看有关如何安装WordPress插件的分步指南。

这实质上定义了短代码的默认行为。 但是,您也可以通过向短代码添加参数来更改单个网格的此行为。

要访问插件设置,请转到 WooCommerce→设置。 然后点击选项卡 热销产品 然后选择选项 产品表 :

添加产品栏woocommerce wordpress.png

配置网格的外观

首先,您可以在该部分中选择网格的样式 表设计。 您可以执行以下操作:

  • 默认 -可以想象,此选项使用插件的默认设置,而无需您进行任何其他干预。 他将尝试尽可能多地使用您博客的当前主题。
  • Personnalisé :选中后,它会展开样式选项列表,使您可以自定义字体颜色和大小,而无需 自定义CSS.

自定义产品表css.png

设置样式后,必须配置短代码默认设置。 同样,您可以通过后者的参数为单个短代码编辑它们。 但是设置可以节省您的时间,并使以后的工作变得简单一些。

配置产品表settings.png

大多数设置是不言自明的,您可以看到WooCommerce产品表在提供工具提示或文档链接方面做得很好,可以帮助您了解有关每个设置的更多信息。

发现 如何添加WooCommerce商店在Facebook上

设置短代码默认设置后,您可以进一步滚动以配置更高级的布局和功能设置。

产品table.png的高级配置

同样,该插件做得很好。 可以为可能难以理解的任何参数提供附加信息。 

如何控制您的WooCommerce在线商店的库存 ? 通过单击此链接来发现它。

要注意的一件事是 渐进式收费的限制。 如果您决定使用渐进式加载来加快在线商店的速度,则将限制插件的搜索和排序功能。

另请参阅我们的选择 12最好的WooCommerce插件,可增强您的在线商店

配置完成后,请确保保存更改。

2步骤:添加WooCommerce网格小部件(可选)

如前所述,WooCommerce产品表还提供了四个小部件,可帮助您向侧边栏添加过滤器选项( 您可以在经典的WooCommerce商店中使用 ).

要访问它,请转到 外观→小部件 像往常一样,在所需的小部件上滑动:

小部件表woocommerce.png

步骤3:在要显示产品网格的地方添加简码

您已到达终点! 现在您要做的就是添加简码 [product_table] 无论您要在哪里显示网格。

也发现 如何找到链接到WordPress的登录页面

默认情况下,该简码将根据您在步骤1中选择的设置工作。但是,如果您要自定义特定简码的功能,则可以使用 许多短码参数 可用。

例如,要仅在特定类别的产品上使用网格,可以添加如下参数:

[product_table 类别="帽子"]

您甚至可以发挥创造力,并在此处使用AND / OR条件。

例如:

  • [product_table 类别=“帽子 + in 明星« ] 仅显示属于 时间 帽子类别 et 在星星上。
  • Product_table 类别=“帽子 在 ] 显示的产品 soit 帽子 ou 星级类别。

对小细节的关注使WooCommerce产品网格变得如此出色。 

另见我们的 6个WordPress插件为您的文章注入新的活力

这就是WooCommerce上产品网格的全部内容!

WooCommerce产品表插件定价

WooCommerce产品表专门是一个高级插件。 尽管WordPress.org目录中列出了一些免费选项,但我还没有找到任何灵活或有据可查的选项,因此我认为WooCommerce产品表值得这个价格,这是...

对于1网站 -$ 75

对于5网站 卷筒纸 -$ 135

对于20网站 -$ 275

还发现一些高级WordPress插件  

您可以使用其他 WordPress插件 赋予现代外观并优化您的博客或网站的处理。

我们在这里为您提供了一些高级WordPress插件,它们将帮助您实现这一目标。

1。 HBook

HBook 是一个 WordPress扩展 这将使您可以轻松地在您的网站上创建在线预订解决方案。

书

它非常适合在酒店领域开展业务的任何人(酒店,度假公寓,露营等)。

发现我们的 5 WordPress插件可共享您博客的内容

WordPress插件 HBook,您将能够在几秒钟内将可用性日历、价目表和预订表格添加到您的网站。

下载 | 演示 | 虚拟主机 

2. WooCommerce Tabs Pro:产品页面的额外选项卡

Ce WordPress插件 在产品页面上为您提供无限的附加选项卡。额外的选项卡产品页面,WordPress的,插件到页面建设者

它的主要特点是: 更改标签的标题,a 编辑器编辑自定义内容,是否固定标签的可能性 标签图标,易于移除 标签,p自定义公共界面上的标签位置,例如还有更多...

下载 | 演示 | 虚拟主机

如果其订户从您现有的在线商店购买您的产品,则此WooCommerce插件使您的会员可以赚取积分。

Woocommerce多级推荐插件

其功能包括:配置个性化的信用和兑换限制,针对注册用户的完整管理报告,全局或特定产品参数的管理, 支持简码,还有更多。

也发现 如何在全球标题中添加下拉式联系表单

它是一个多层次的WooCommerce会员系统,在典型的会员交易系统之外。

下载 | 演示 | 虚拟主机

其他推荐资源

我们还邀请您参考以下资源,以进一步掌握和控制网站和博客。

结论

就是这样! 本教程就是这样。 希望您能够在WordPress上创建WooCommerce产品网格. 不要犹豫 与社交网络上的朋友分享提示.

但是,您也可以咨询我们的 RESSOURCES,如果您需要更多的元素来执行创建Internet网站的项目,请参考我们关于 WordPress博客创建。

但是,与此同时,请告诉我们您的 评论 和专用部分中的建议。

...