为了方便我们插件产品到文章或页面中,WooCommerce 默认提供了一些简码,使用这些简码,我们可以很方便的插入WooCommerce 的商品或功能到普通的WordPress 页面中。

基本页面简码

[woocommerce_cart] – 显示购物车页面

[woocommerce_checkout] – 显示结账页面

[woocommerce_order_tracking] – 显示订单跟踪表单

[woocommerce_my_account] – 显示用户账户页面

大多数情况下,安装 WooCommerce 时,向导会自动添加以上简码到响应的页面中,如果没有运行安装向导,我们需要自行把上面的简码添加到页面中。

我的账户页面

在账户页面显示 ‘我的账户’ 内容,用户可以浏览历史订单,更新他们的信息,我们可以指定显示特定用户的账户页面,并指定一个页面显示多少订单。

参数:

array(

'current_user' => '',

'order_count' => '15'

)

[woocommerce_my_account order_count="12"]

当前页面参数会通过 get_user_by( ‘id’, get_current_user_id() ) 函数自动添加。

下面的页面可以在 WordPress 站点中的任何地方使用。

显示最新商品:recent_products

列出最新的商品 ,通常在网站首页比较常用,‘per_page’ 参数确定显示几个最新商品, columns 参数确定把商品显示为几列。

参数:

array(

'per_page' => '12',

'columns' => '4',

'orderby' => 'date',

'order' => 'desc'

)

[recent_products per_page="12" columns="4"]

如需了解怎么使用 ‘orderby’ 参数, 参见 WordPress Codex Class Reference

显示特色推荐商品:featured_products

和最新商品简码类似,只不过这个简码显示的是后台推荐的特色商品。下面的示例简码中,显示12个推荐商品,每行显示4个。

参数:

array(

'per_page' => '12',

'columns' => '4',

'orderby' => 'date',

'order' => 'desc'

)

[featured_products per_page="12" columns="4"]

显示单个商品:product

通过商品 ID 或这 SKU 显示某个商品。

[product id="99"]

[product sku="FOO"]

如果商品没有显示,确认一下是否在后台设置为隐藏了。

显示多个商品:products

通过商品 ID 或 SKU 显示多个商品,和上面的 product 简码类似,只不过这个显示的是多个商品。注意复数形式 ‘products’。

参数:

array(

'columns' => '4',

'orderby' => 'title',

'order' => 'asc'

)

[products ids="1, 2, 3, 4, 5"]

[products skus="foo, bar, baz" orderby="date" order="desc"]

如果商品没有显示,确认一下是否在后台设置为隐藏了。

显示添加到购物车按钮:add_to_cart

通过商品 ID 显示价格和添加到购物车按钮。

参数:

array(

'id' => '99',

'style' => 'border:4px solid #ccc; padding: 12px;',

'sku' => 'FOO'

)

[add_to_cart id="99"]

显示添加到购物车 URL:add_to_cart_url

通过商品 ID 显示价格和添加到购物车按钮,上面的 add_to_cart 显示的直接是功能,这个简码只是输出了一个加入到购物车的链接。

Args:

array(

'id' => '99',

'sku' => 'FOO'

)

[add_to_cart_url id="99"]

显示单个商品分类的商品:product_category

通过商品分类别名显示分类中的多个商品。

参数:

array(

'per_page' => '12',

'columns' => '4',

'orderby' => 'title',

'order' => 'asc',

'category' => ''

)

[product_category category="appliances"]

显示多个商品分类中的商品:product_categories

显示多个商品分类中的商品,和上面的 product_categorie 类似,只不过这个显示的是多个商品分类中的商品。

参数:

array(

'number' => 'null',

'orderby' => 'title',

'order' => 'ASC',

'columns' => '4',

'hide_empty' => '1',

'parent' => '',

'ids' => ''

)

`number` 参数用来指定显示多少商品, `ids` 参数用来指定显示哪些分类中的商品。

[product_categories number="12" parent="0"]

设置parent 参数为0,只显示顶级分类,设置 ‘ids’ 为逗号分隔的分类id列表,只显示指定分类中的商品。

商品页面:product_page

通过指定的IPS 呀 ID 或 SKU 显示完整的商品详情页面。

[product_page id="99"]

[product_page sku="FOO"]

显示打折特价促销商品:sale_products

列出促销中的商品:

参数:

array(

'per_page' => '12',

'columns' => '4',

'orderby' => 'title',

'order' => 'asc'

)

[sale_products per_page="12"]

显示销量最高的商品:best_selling_products

列出销量最高的商品。

参数:

array(

'per_page' => '12',

'columns' => '4'

)

[best_selling_products per_page="12"]

显示相关商品:related_products

列出相关商品。

参数:

array(

'per_page' => '12',

'columns' => '4',

'orderby' => 'title'

)

[related_products per_page="12"]

显示评价最高的商品:top_rated_products

显示评价最高的商品。

参数:

array(

'per_page' => '12',

'columns' => '4',

'orderby' => 'title',

'order' => 'asc'

)

[top_rated_products per_page="12"]

显示商品属性:product_attribute

列出指定属性的商品。

参数:

array(

'per_page' => '12',

'columns' => '4',

'orderby' => 'title',

'order' => 'asc',

'attribute' => '',

'filter' => ''

)

[product_attribute attribute='color' filter='black']

‘per_page’ 参数

注意:参数 ‘per_page’ 指定在页面上显示多少件商品,并不会输入分页。

简码问题排除

如果你在页面上粘贴了代码,在前端却看不到商品输入,请确认简码没有被包含,这个问题很常见,移除.

标签,重新保存一下页面就可以了。

根据自定义字段排序商品

很多列出商品的 WooCommerce 简码都是支持自定义排序的,如:

[recent_products]

[featured_products]

[products]

[product_category]

[sale_products]

[top_rated_products]

[product_attribute]

[related_products]

我们可以通过下面的属性对商品进行排序:

menu_order

title

date

rand

id

“orderby” 属性的使用方法如下:

[products skus="foo, bar, baz" orderby="date" order="desc"]

除了上面的属性,我们还可以通过自定义字段对商品进行排序,下面的实例中,我们使用价格对商品进行排序。

add_filter( 'woocommerce_shortcode_products_query', 'woocommerce_shortcode_products_orderby' );

function woocommerce_shortcode_products_orderby( $args ) {

$standard_array = array('menu_order','title','date','rand','id');

if( isset( $args['orderby'] ) && !in_array( $args['orderby'], $standard_array ) ) {

$args['meta_key'] = $args['orderby'];

$args['orderby'] = 'meta_value_num';

}

return $args;

}

我们需要把上面的代码放到主题的 functions.php 文件中,然后根据需要编辑 meta_key。

总结一下

WordPress 中,简码相当于是一个封装,把显示商品的功能逻辑和 HTML 代码封装到了一起,直接使用简码,就可以输出简码指定的内容,非常方便,可重用性非常高。下次开发 WooCommerce 主题的时候,不妨多尝试使用简码,相信会在一定程度上加快开发速度。

短代码 html,WooCommerce 默认提供的简码短代码相关推荐

  1. 腾讯云短信服务使用记录与.NET Core C#代码分享

    1.即使是相同的短信签名与短信正文模板,也需要针对"国内文本短信"与"海外文本短信"分别申请.开始不知道,以为只要申请一次,给国外手机发短信时给api传对应的国 ...

  2. php滚动条代码,CSS_给DIV添加滚动条的实现代码,直接为div指定overflow属性为auto - phpStudy...

    给DIV添加滚动条的实现代码 直接为div指定overflow属性为auto即可,但是必须指定div的高度,如下: 复制代码代码如下: 如果要出现水平滚动条,则: overflow-x:auto 同理 ...

  3. woocommerce 分类到菜单_WooCommerce实用代码集合

    本文整理了一些适用于WooCommerce的短代码,方便查阅和使用,更是为了理清思路,提高自己.以下WooCommerce简称WC,代码放在主题的functions.php中即可. 最后更新于: 20 ...

  4. 提供第三种代码生成方式——通过自定义BuildProvider为ASP.NET提供代码生成

    2019独角兽企业重金招聘Python工程师标准>>> 之前写了一些关于代码生成的文章,提供了两种不同方式的代码生成解决方案,即CodeDOM+Custom Tool和T4.对于AS ...

  5. 中国网建java发送短信_短信验证登陆-中国网建提供的SMS短信平台

    一.JAVA发送手机短信常见的有三种方式(如下所列): 使用webservice接口发送手机短信,这个可以使用sina提供的webservice进行发送,但是需要进行注册 使用短信mao的方式进行短信 ...

  6. Java代码 怎么写很精简的代码 如何写又短又能满足需求的代码 如何写看起来很NB的代码 代码之极简之道

    目录 利用语法 1.利用三元表达式 2.利用 for-each 语句 3.利用 try-with-resource 语句 4.利用 return 关键字 5.利用 static 关键字 6.利用 la ...

  7. android设置为默认短信应用,android默认制作默认短信应用程序

    所以我在这里关注这个Tutorial默认设置我的短信,但由于某种原因,我的代码无效.我试图尽可能多地查看,但所有内容都指向同一个教程或已经过时.我也需要接收器吗?谁能解释我做错了什么? 代码: @Ov ...

  8. 低代码对接腾讯云-阿里云短信平台

    一.什么是低代码 "Low-Code"是什么?第一次接触这个名词的还是被面试官问到是否知道低代码的时候,这种场合不知道三个字是绝对不能出现的. 所以我强装镇定回答到:"低 ...

  9. 中国网建 java_java中用中国网建提供的SMS短信平台发送短信

    接下来的项目需求中提到需要短信发送功能,以前没有做过,因此便在网上搜了一下.大体上说的都是有三种方法,分别是sina提供的webservice接口.短信mao和中国网建提供的SMS短信平台. 这三种方 ...

最新文章

  1. 图解Transformer:Attention Is All You Need
  2. Python zipfile 文件名称编码 file_name.encode(‘cp437‘).decode(‘gbk‘)
  3. why is pricing callback CRM_PRIDOC_UPDATE_EC called
  4. 下载 沙耶之歌Android_沙耶之歌安卓版apk-沙耶之歌下载手机版v1.2-飘荡下载
  5. 微信机器人开发SDK使用教程--养号任务停止
  6. ios开发问题汇总(一)
  7. test.php.bak,MongoDB热备份工具:解决官方版备份缺陷
  8. BGP——路由通告+IBGP水平分割机制+RR路由反射器(讲解+配置命令)
  9. 11,外观模式(Facade Pattern)是为子系统中的一组接口提供一个一致的界面,此模式定义了一个高层接口,这个接口使得这一子系统更加容易使用。...
  10. parent.window php,javascript中的window.self、window.top、window.parent和window.opener详解
  11. 深度linux不能联网,Deepin Linux 无法上网
  12. Centos Nginx+PHP Install 史上最完美
  13. linux dhcp的详细配置
  14. ubuntu 安装log4cpp
  15. 【Keras中文文档】Layer Convolutional网址
  16. 高频逆变器有什么优缺点?它有哪些分类?-道合顺大数据Infinigo
  17. php 写入exif,用PHP将EXIF写入JPG
  18. 上万条流行经典语录大全ACCESS数据库
  19. GPT生成情人节表白情话,AI撩骚情人卡很搞笑!
  20. 【工具】Hosts文件详解

热门文章

  1. vhdl timing requirements not met 错误 quartusII中
  2. 阿波罗java_携程Apollo(阿波罗)配置中心的Java样例客户端启动和调试
  3. 3dsmax部分基础快捷键
  4. python用sympy解二元一次方程等数学运算
  5. uboot构建框架6-u-boot.bin生成过程追踪
  6. 网络编程I/O模型分析
  7. oracle dba 培训教程 第11章 索引的管理与维护
  8. 如何使用轻快PDF阅读器编辑PDF文件
  9. 没想到,这款国产软件牛炸了。
  10. java 给一个开学日期,计算当天是开学第几周星期几或者开学第几周星期几为哪一天