使用kadence Blocks建立产品展示页面(WordPress外贸B2B网站)

本站大部分教程都是分享如何搭建独立站的，独立站当然主要是以跨境电商为主，也就是B2C网站了，不过遇到很多朋友询问如何搭建外贸B2B网站，其实流程差不多，不过很多朋友在安装Woocommerce插件之后，发现woocommerce上传的产品并不太适合展示产品，没有自定义添加联系方式的按钮，这是肯定的，毕竟woocommerce是一款电商插件，产品主要以销售为主，并不是以展示为主。

于是有些朋友自己找插件，我也搜索了一轮，没发现很好用的插件，但是其实利用wordpress搭建外贸网站，仅仅是想展示产品的话，完全不需要安装woocommerce，可以完全自主创建产品展示页面，非常简单，就像平常你写个wordpress博客文章一样。

安装Kadence Blocks插件

安装插件非常用，点击左侧的插件Plugins，然后点击安装插件，搜索Kadence，第一个插件就是Kadence Blocks

此插件是专门为wordpress古腾堡编辑器开发的区块插件，使用起来非常方便。点击安装并启用插件，之后在新建文章或者页面等地方都是用得到的，比如新建文章，你就可以在文章编辑页面添加Kadence blocks的任何区块，位置在左上角那个大大的蓝色➕加号里面：

你想要使用什么区块直接点击添加就是，之后我会写文章单独来介绍每一个区块的作用。

接下来我们正式创建产品展示页面。

第一步：创建空白产品展示页面，添加产品名

第一步当然是创建一个空白的页面，这里创建Post文章页面，为何是文章（Post）而非page页面，因为post可设置的元素更丰富，而且更方便访客留言。当然页面也不是不可，但是对于网页元素和类型来说，post可能会更适合一个产品或者内容展示网页。

依次点击左侧Post，Add New，建立新空白文章页面，如下

然后添加产品名，当然也就是标题了，在Add title出填写你的产品名吧，产品名尽量不要关键词堆砌，简练一点，保证基本要素齐全就行，别和跨境电商产品一样那么长，不然在搜索引擎上看不到标题后半部分。

比如一款桑蚕丝布料：标题可以设置为：19 momme 45″(114cm) 100% Mulberry Silk satin fabric，这样基本要素齐全，当然你也可以在后面添加一点for pajamas, pillowcases, dressmaking之类的补充，但是google搜索出来的条目可能看不到这些内容，但是你可以之后在产品详情中添加更多的介绍。

第二步：图片轮播和产品基础信息(使用Row Layout区块)

顺便说一下这里区块的意思，英文界面你看到是Blocks，也就是你可以在任何页面任何位置添加一个区域，让你单独编辑内容。

接下来设置产品图片和产品的基本信息，也就是通常你在一些电商网站看到的产品页面开头部分左侧是图片，右侧是产品的一些购买基本信息。

这里使用Row Layout区块，可以添加一行分成不同栏的区域，如上图，选择2栏的即可，在这个row layout区块中你又可以添加其他任何区块，当然你想的话，无限套娃都行。

设置产品图片

接下来在Row的左栏添加一个图片轮播区块 – Advanced Gallery，点击Row Layout左边的加号可添加：

选择 Advanced Gallery，然后Advanced Gallery就添加到了Row左栏中，接下来设置一下Advanced Gallery并在其中添加产品图片，注意看以下图片右边的设置。

你可以选择图片排列方式以及图片比例，我选择的是图片轮播，但是底部没有缩略图，其实也有底部有缩略图的模式的，但是那是付费版本才行，因为我们主要是产品介绍页面，所以可先不追求这些。

设置产品基础信息

图片设置好后，我们来到右侧，设置产品基本信息，这里可参考一下一些B2B网站，比如alibaba,made-in-china，不过现在阿里巴巴的界面可能不太好参考了，因为改版成了B2C界面。这里给大家几个大致的基础信息：

• 首先是标题因为刚刚标题已经设置好了产品名，这里添不添加产品名都无所谓了，为了产品的整体性，还是添加一下，同样点击右栏的加号添加一个Heading，这里选择H3,H4,H5都行，感觉不需要太大的字体，建议H5吧。
• Wholesale大致价格，FOB或者出厂价
• 原产地
• Material
• 颜色尺寸等规格
• 最低订购量
• Contact us按钮， 按钮可以设置为直接发邮件，在按钮的连接中天下mailto:example@example.com，example@example.com改为你的邮箱，此处可以添加多个按钮，也可以添加whatsapp聊天按钮。

大致这些吧，一目了然，以上信息可以用table也就是表格区块设置。

最后添加的内容上图所示。

你可以在下面添加一些社交分享按钮，比如把分享按钮添加在图片底下吧，wordpress官方自带social share的，而且可以自己选择需要分享的平台。

现在看看是不是像模像样了。

第三步：添加产品详情描述等(使用Tabs区块)

继续，现在要做的当然是添加产品的详细介绍了，点击编辑页面中的黑色的加号➕添加新的区块，或者左上角蓝色➕都行，这里我建议大家用Tabs区块，当然不用也行，直接像编辑word文档一样，把描述写上去也行，总之把你的产品内容介绍清楚。

搜索Tabs，点击tabs就添加一个新的block到了页面，Tabs有多个模式，你可以选择一个你喜欢的，比如第二个

然后你需要你个标签页，你自己设置，默认添加三个，不需要那么多点击标签直接点击x删除不需要的标签，或者点击三角形可以移动标签位置：

然后设置标签名称，直接在Tab1, Tab2文字上修改就行，点击Tab下方框框中的加号添加内容，可以是区块，也可以直接是文字，图片，任何内容，可比很多平台的产品描述丰富多了。

这就是添加了内容的产品介绍了。

其实到这里差不多产品展示的页面就差不多完成了，具体内容可根据你们自身的产品来编辑。

最后说一下B2B网站建站流程

建站流程和我网站的wordpress+woocommerce教程大致是一样的，唯一的区别就是你不需要安装Woocommerce插件了，也就是说woocommerce相关的设置也不需要管了。

• 也就是教程中第五步不需要了
• 最后一步添加页面和产品，产品就用文章来替代，文章也可以分类，文章也可以留言。

所以用wordpress搭建一个B2B的产品展示网站是更容易的，而且比起B2C更能获得搜索引擎的流量。