woocommerce插件二次开发

写在前面：最近上手了一个wordpress电子商城的二次开发，把自己遇到的点点滴滴做个记录，这篇文章主要记录了我是如何一步步的将woocommerce插件接入自己的主题中，如果你还没有自己的主题，最好先去制作一个自己的主题再来看这篇杂谈。

不得不说，wordpress的插件woocommerce定制性极强，希望与各位同学一起学习，开始吧。

产品详情页

移除详情页面的促销标志

在主题functions.php中任意位置添加下面的代码

remove_action( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_sale_flash', 10 );

remoce_action()是wordpress提供的api，用来移除连接到hook的特定函数，第一个参数是动作hook，第二个参数是连接到该hook的函数， 在产品详情页面content-single-product.php中，你可以找到下面的代码，woocommerce_single_product_summary就是我们我们要找的hook，@符号后面的都是连接到这个hook的函数，有title、price、add_to_cart等等，根据你的需要，你可以在functions中任意移除,但是最好不要更改这个的代码

   <?php
        /**
        * woocommerce_single_product_summary hook
        *
        * @hooked woocommerce_template_single_title - 5
        * @hooked woocommerce_template_single_rating - 10
        * @hooked woocommerce_template_single_price - 10
        * @hooked woocommerce_template_single_excerpt - 20
        * @hooked woocommerce_template_single_add_to_cart - 30
        * @hooked woocommerce_template_single_meta - 40
        * @hooked woocommerce_template_single_sharing - 50
        */
        do_action( 'woocommerce_single_product_summary' );
   ?>

加载自定义js文件

在functions.php中添加下面的代码，add_action()用来将函数连接到指定action(hook),这里我们将myScripts()这个函数连接到wp_enqueue_scripts这个hook上面，关于这个hook你可以在wordpress官网查看更加详细的讲解，其中cookee-js是我取的一个名字，get_template_directory_uri()获取项目的根目录，index.js是我的js文件的名字

function myScripts() {  
    wp_enqueue_script( 'cookee-js',  get_template_directory_uri().'/js/index.js');
} 
add_action( 'wp_enqueue_scripts', 'myScripts' );

禁止woocommerce的默认的css

add_filter( 'woocommerce_enqueue_styles', '__return_empty_array' );

购物车

购物车商品信息对象

WC()->cart

获取购物车内容

WC()->cart->get_cart()可以获取购物车内的商品，这些信息都会保存在一个数组中，可以从数组中将商品的名字、单价等信息循环取出，放在html中

<?php foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {
    //输出价格
    var_dump($cart_item['data']->price);
} ?>

更改购物车产品图片尺寸

在get_image()函数中随便传入一个参数，函数就会返回产品原图，购物车默认的产品是180*180，做了剪裁，这里不需要剪裁，原图显示

$_product->get_image(200);

自定义加入购物车之后的提示

在functions中添加filter，将提示信息的文本隐藏，没有找到方法可以直接删除html的

add_filter( 'wc_add_to_cart_message', 'custom_add_to_cart_message' );
function custom_add_to_cart_message() {
   echo '<style>.woocommerce-message {display: none !important;}</style>';
}

获取购物车页面的链接

同理，你可以获取页面和我的账户页面链接

esc_url( wc_get_page_permalink( 'cart' ));

修改购物车为空的界面

找到cart.php文件夹下面的cart-empty.php文件，找到下面的代码，删除。然后添加我们最终要显示的页面

<p class="cart-empty"><?php _e( 'Your cart is currently empty.', 'woocommerce' ) ?></p>
<?php do_action( 'woocommerce_cart_is_empty' ); ?>
<p class="return-to-shop"><a class="button wc-backward" href="<?php echo esc_url( apply_filters( 'woocommerce_return_to_shop_redirect', wc_get_page_permalink( 'shop' ) ) ); ?>"><?php _e( 'Return To Shop', 'woocommerce' ) ?></a></p>

移除购物车页面的header

找到你的cart.php,然后找到下面的代码，直接delete，然后页面上的catr header就不见了，其他页面日出header同理，更好的方法应该是在functions中添加filter,但是我尝试了几次，暂时没有成功

                    <header class="entry-header">
                        <?php if ( has_post_thumbnail() && ! post_password_required() ) : ?>
                        <div class="entry-thumbnail">
                            <?php the_post_thumbnail(); ?>
                        </div>
                        <?php endif; ?>
                        <h1 class="entry-title"><?php the_title(); ?></h1>
                    </header><!-- .entry-header -->

删除购物车删除商品之后的提示

在cart.php中，找到下面的代码，删除即可

wc_print_notices();

获取购物车内商品的总价

<?php echo WC()->cart->subtotal ?>

获取购物车内商品+运费+折扣的价格

<?php echo WC()->cart->total ?>

订单

获取当前订单的总金额

WC()是woocommerce的一个全局对象，这行代码将返回当前购物车中的金额，不带货币单位，纯数字

WC()->cart->total ;

输出订单运费

在woccommerce中的wc-cart-functions.php中，重写wc_cart_totals_shipping_html()函数，返回当前订单的运费

function wc_cart_totals_shipping_html() {

    $packages = WC()->shipping->get_packages();
    echo $packages[0]['rates']['your_shipping_method']->cost;

}

移除订单备注

在from-checkout.php中，找到下面的代码，删除即可

<div class="col-2">
     <?php do_action( 'woocommerce_checkout_shipping' ); ?>
</div>

获取单个产品的单价

<?php  $cart_item["data"]->price;  ?>

获取单个产品乘以数量的总价

<?php  $cart_item['line_subtotal']; ?>

获取当前优惠卷的价格

<?php $coupon->coupon_amount;  ?>

给hook添加自定义的filter

在wordpress中所有action,就是我们在页面看到的do_action()函数中的参数，都可以添加的自定义的filter

add_filter( 'woocommerce_checkout_fields' , 'custom_demo' );
function custom_demo( $fields ) {
  }

为商城新增加一个页面

如果我们需要在商城中新增加一个关于我们或者客服中心类似的独立页面，请现在主题下面新建一个php文件，在文件中输入下面的代码，wordpress会自动识别到我们新建的页面，然后在后台模板选择的地方出现Page for my这个选项

<?php
/*
Template Name: Page for my
*/
?>

购物车页面数量增减自动刷新总价

在cart.php中找到下面的代码，这段代码是生成的购物车中商品数量的input，删除它

<?php
if ( $_product->is_sold_individually() ) {
    $product_quantity = sprintf( '1 <input type="hidden" name="cart[%s][qty]" value="1" />', $cart_item_key );
} else {
    $product_quantity = woocommerce_quantity_input( array(
        'input_name'  => "cart[{$cart_item_key}][qty]",
        'input_value' => $cart_item['quantity'],
        'max_value'   => $_product->backorders_allowed() ? '' : $_product->get_stock_quantity(),
        'min_value'   => '0'
    ), $_product, false );
}
echo apply_filters( 'woocommerce_cart_item_quantity', $product_quantity, $cart_item_key, $cart_item );
?>

删除之后，替换成下面的静态代码，一定要注意表单中input的value和name值，这两个值记录这当前商品的数量还有字段等信息，在在刷新表单的或死后需要

<div class="quantity">
    <span class='reduce' onclick='ck.productNumber("-")'>-</span>
    <input type="text" autocomplete="off"  step="<?php echo esc_attr( $step ); ?>" <?php if ( is_numeric( $min_value ) ) : ?>min="<?php echo esc_attr( $min_value ); ?>"<?php endif; ?> <?php if ( is_numeric( $max_value ) ) : ?>max="<?php echo esc_attr( $max_value ); ?>"<?php endif; ?> name="<?php echo 'cart['.$cart_item_key.'][qty]'; ?>" value="<?php echo $cart_item['quantity']; ?>" title="<?php echo esc_attr_x( 'Qty', 'Product quantity input tooltip', 'woocommerce' ) ?>" class="input-text qty text" size="4" />
    <span class='add' onclick='ck.productNumber("+")'>+</span>
</div>

为增减选项绑定submit事件，每次增减之后提交购物车表单

订单提交页面获取商品属性信息

$cart_item是一个数组类型的数据，包含了我们在后台给商品添加的各种信息，假设我们在后台给商品添加了color和size等属性，那么可以通过下面的方式获取属性

<?php echo $cart_item['variation']['attribute_pa_size'];  ?>
<?php echo $cart_item['variation']['attribute_pa_color'];  ?>

自定义的属性包含在$cart_item['variation']这个数组中，属性名字是一个拼接的字符串

订单提交页面检查支付方式

woocommerce定义了函数来检查当前是否拥有有效的支付方式，如果后台设置了有效的支付方式，这里函数返回ture

WC()->cart->needs_payment()

移除下单页面select2下拉选择框

在你的functions.php中添加下面的代码

add_action( 'wp_enqueue_scripts', 'mgt_dequeue_stylesandscripts', 100 );
function mgt_dequeue_stylesandscripts() {
    if ( class_exists( 'woocommerce' ) ) {
        wp_dequeue_style( 'select2' );
        wp_deregister_style( 'select2' );
        wp_dequeue_script( 'select2');
        wp_deregister_script('select2');

    } 
}