WooCommerce简码(shortcode)允许我们向页面或文章添加产品、购物车和其他内容。我们在搭建外贸网站的时候，可以直接通过ElementorPro的Product元素块来配置商品展示，但是如果元素块或者theme不能提供需要的商品配置怎么办？学习WooCommerce短代码可以让您自定义您想要的产品展示，例如在网站首页以标签标签的形式展示不同类别的产品。另外，如果你使用默认的WordPressGutenberg编辑器编辑页面或文章，如下图，点击左上角的加号按钮，可以在面板中找到WooCommerce区块，点击区块添加它页面。它们与本文将介绍的短代码具有相同的功能。短代码是一小段代码，需要您自己编写代码规则。相比之下，这种块更容易使用。虽然我们在做网站页面的时候很少用到Gutenberg编辑器，比如我经常用Elementor编辑器做外贸建站，即便如此，你在写外贸网站资讯的博文时，仍然可以通过这种方式插入相关产品。另外，学习WooCommerce简码后，在使用Elementor制作页面时，可以体验到更多的便利性和灵活性。下面是一些例子。如何使用WooCommerceShortcodes以[woocommerce_cart]为例，表示购物车页面。当您将此短代码添加到页面时，该页面将包含购物车内容。在后台页面中添加了购物车简码。这是页面的预览。如何修改WooCommerce我的账户、结算、购物车页面的设计风格。你也可以用Elementor编辑这个页面，给它添加一些设计样式，如下图是我用Elementor添加样式后的效果（比如我给内容加了边框和阴影，加了背景色和标题的底部形状分隔线）。如果尝试用Elementor编辑这些页面，提示无法编辑，请到WooCommerce设置中取消链接重新编辑，编辑后再建立链接。推荐相关教程：Elementor'sAdvanced高级设置教程（18个功能点）好了，下面开始介绍各种WooCommerceshortcodes及其使用和示例。PageShortcode在安装WooCommerce时，如果您按照WooCommerce安装向导进行操作，将自动生成4个页面：我的帐户、购物车、结帐和商店。如果您想自己制作这些页面，只需添加页面并包含这些短代码即可。购物车、账单和我的帐户的简码如下。[woocommerce_cart]-购物车页面[woocommerce_checkout]-结帐页面[woocommerce_my_account]-我的账户页面[woocommerce_order_tracking]-订单跟踪页面，该页面不会自动生成，您也可以自己添加。当你编辑这些页面时，你会看到下图，实际上是在相应的页面上添加短代码。购物车页面短代码：[woocommerce_cart]结帐页面短代码：[woocommerce_checkout]我的帐户页面短代码：[woocommerce_my_account]订单跟踪页面短代码：[woocommerce_order_tracking]产品短代码您可以在页面、文章中使用产品短代码，在产品详细信息中插入产品。产品短代码是产品。您需要在短代码中添加各种属性组合，以实现您想要展示的商品信息。我们继续往下看。我们先看一个例子，例如：显示6个热销促销产品，每行3个产品，其简码如下。注：下方图例中的展示效果与主题强相关，不同主题看到的“皮肤”不同。[productslimit="6"columns="3"orderby="popularity"on_sale="true"]limit="6":display6columns="3":display3orderby="popularity"inonerow:On_sale=“true”：表示所选商品有促销价。简码的一个问题是产品展示的外观取决于您使用的主题，并且您无法在Elementor中编辑简码。代码可以用于样式的细节修改，但是可以做一些整体的设置，比如内外间距，背景，边框等等。如果你想对细节进行样式化，那么我建议不要使用简码，您购买ElementorPro并使用其Product元素来自定义样式。接下来我们介绍可以使用的产品属性Productattributes以下属性可以与Productsshortcode一起使用。显示商品属性limit–显示的商品数量，例如limit="6"，默认为limit="-1"，表示显示所有商品，默认表示：如果要显示所有商品,limit="-1″可以省略，下同。columns–每行的列数，默认为4，表示一行显示4个产品。paginate–开启翻页功能，与limit一起使用，默认值为false，设置为true开启分页功能，例如：paginate="true"。下图中简码为：[productslimit=”4″columns=”4″paginate=”true”]，表示每页显示4个产品，每行显示4个产品，产品页显示转向功能。orderby-根据您设置的内容选项定义排序。如果要添加多个选项，请用空格分隔多个选项。可用选项包括：rand-在页面加载时随机呈现产品（使用缓存站点时可能不适用，因为它可能会保留特定顺序）。rating-产品的评分title-产品的标题，这是默认的orderby模式。date–产品发布日期id–产品IDmenu_order–菜单排序，编辑产品时，可以在产品数据>高级设置菜单排序，请填写数值，数值越大优先级越高。popularity–产品订单的销量–定义orderby中设置的选项的排序方式，包括：升序（ASC）和降序（DESC），默认为ASC。skus–多个产品的SKU之间用英文逗号分隔，每个产品的SKU是唯一的。编辑商品时，您可以在商品数据>库存中设置商品的SKU。category–多个产品类别的slug，用逗号分隔。tag–多个商品标签用英文逗号分隔，可以在编辑商品时添加标签，也可以快速修改商品，在商品列表中添加多个标签。class–添加一个CSSClass，这样就可以用自定义CSS修改产品的样式了（比较难，没有CSS知识储备的忽略）。on_sale–显示促销商品，不能与下面的best\_selling或top\_rated一起使用。best_selling–显示最畅销的商品，不能与on_sale或top_rated一起使用。top_rated–显示评分最高的项目，不能与on\_sale或best\_selling一起使用。Contentproductattributeattribute–产品属性，可以自己定义产品属性，比如鞋的颜色和尺码，可以指定productattributeslug来选择要展示的产品。terms–商品属性值，通过指定商品属性值来选择要展示的商品，比如红色和黄色鞋子，多个属性值用逗号隔开terms_operator–商品属性值之间的操作关系，包括：AND–表示一个“和”关系，将显示包含所有选定属性值的产品。IN–表示“包含”关系，将显示包含任何选定属性值的产品，这也是TERMS_OPERATOR的默认值。NOTIN–表示“不包含”关系并将显示不包含任何选定属性值的产品。tag_operator–产品标签之间的操作关系，包括：AND–表示“与”关系，将显示所选标签中的所有产品。IN–表示“包含”关系，并将显示包含任何选定标签的产品。这是TAG_OPERATOR的默认值。NOTIN–表示“不包含”关系并将显示不包含任何选定标签的产品。示例：根据颜色属性（attribute="color"），显示6个不包含（terms_operator="notin"）绿色或红色（terms="green,red"）的产品（limit="6"），每行3个产品（列=“3”）。[productslimit="6"columns="3"attribute="color"terms="green,red"terms_operator="notin"]visibility–可见性，产品会根据你选择的可见性选项显示，可见的可用选项如下：visible–Visible：产品在商店和搜索结果中可见。这是默认的可见性选项。catalog–产品目录：产品仅在商店页面、产品目录页面可见，搜索时不可见。search–搜索结果：该产品仅在搜索结果中可见，但在商店、产品目录页面中不可见。hidden——隐藏：商品隐藏在店铺、商品目录页和搜索结果中，只能通过访问URL访问。featured–特色商品：指标记为特色商品的商品，在商品列表中点亮一个小星星即为特色商品。类别–显示您选择的产品类别中的产品。cat_operator–产品类别之间的操作关系，包括：AND–表示“和”关系，将显示包含所有选定类别的产品。IN–表示“包含”关系，将显示包含任一选定类别的产品，这是cat_operator的默认值NOTIN-表示“不包含”关系，将显示不包含任一选定类别的产品类别。标签–显示带有您选择的产品标签的产品。示例：只显示产品标签中有demo的产品[productstag="demo"]ids–显示所选产品ID的产品，多个ID用英文逗号分隔skus–显示所选SKU的产品，多个ID用英文逗号分隔commas注意：如果您选择的产品未显示，请确保它们的可见性未设置为“隐藏”。进阶示例之前在做网站的时候，遇到过这样的需求：以标签切换的形式展示不同分类的商品（见下面的视频）。但是ElementorPro不提供这种形式的产品元素块。学习了WooCommerce简码后，我们就可以使用tab元素块+简码来实现了。Elementor免费版提供了3种tab切换元素块，上图使用的是tab。您只需要将短代码放入选项卡的内容中，如下图所示，如果在编辑模式下看不到效果，请更新页面并预览。ProductCategoryShortcode下面两个shortcode可以在任意页面显示产品类别product_category]??–显示指定类别下的产品product_categories]–显示所有产品类别productcategoryattributeids–指定要显示的类别id，多个id之间用分隔英文逗号并在[product_categories]短代码中使用它们。可以获取类目id如下图所示，也可以查看编辑商品类目页面的url获取idcategory——可以是类目id，slug或者名称，使用product_categorylimit中的——数量categoriestobedisplayedcolumns–每行显示的列数，默认值为4。hide_empty–默认值为1，表示隐藏没有产品的空类别。如果设置为0，则显示空类别。parent–可以设置显示某个分类ID的所有子分类。如果设置为“0”，则只显示第一级分类。orderby–默认按“名称”排序，可以设置为按“ID”、“Slug”或“menu_order”排序。如果你想按你指定的ID排序，可以使用orderby="include"order–基于orderby中的排序依据，设置商品类别的排序是升序（ASC）还是降序（DESC），默认为上升ASC。产品类别简码示例展示多个指定的产品类别，并按选择的产品类别id排序[product_categoriesids="16,17,19,18"orderby="include"]显示2个一级产品，有productsClassification[product_categorieslimit="2"parent="0"]显示指定分类下的所有商品[product_categorycategory="clothing"]这段代码我放在不同的主题下效果不一样，而且有的主题的外观很恐怖つ﹏?，目前波尔图主题预览效果不错。产品页面短代码按ID或SKU显示完整的产品页面。（虽然我想不出一个常见的使用场景，比如直接在博文中插入产品？emm..也是可以的）[product_pageid="16"][product_pagesku="99"]相关产品简码[related_productslimit="12"]此短代码通常用于产品页面，主题通常配置为显示相关产品。添加到购物车短代码显示单个产品的价格和按产品ID显示的“添加到购物车”按钮。在非WooCommerce页面上显示WooCommerce通知shop_messages短代码允许您在非WooCommerce页面上显示WooCommerce通知（如“产品已添加到购物车”）。当您使用其他短代码（如添加\_to\_cart）并希望用户获得有关他们的操作的一些反馈时，这很有用。简码效果示例常见注意事项建议在编辑器的文本模式下添加简码，而不是可视模式注意简码中的双引号是英文符号“”，不是中文双引号“”
