WooCommerce – 蓝月网络 https://lanyueer.com 专注于WordPress外贸建站,主题插件汉化、配置 Sat, 13 Dec 2025 15:40:57 +0000 zh-CN hourly 1 实用的25个WooCommerce片段2 https://lanyueer.com/25-best-woocommerce-snippets-2/ Tue, 20 Jun 2017 11:32:50 +0000 https://lanyueer.com/?p=958 WooCommerce是非常强大的电商工具,并且易于扩展。 它有许多钩子可以用于修改几乎所有的东西,这就是使W…

实用的25个WooCommerce片段2,首发于蓝月网络

]]>
WooCommerce是非常强大的电商工具,并且易于扩展。 它有许多钩子可以用于修改几乎所有的东西,这就是使WooCommerce如此受欢迎。 以下一些实用的Woocommerce片段列表 所有这些片段必须粘贴在您的主题文件夹中的functions.php文件中才能起作用:

1 – 替换WooCommerce默认PayPal logo

  1. /*
  2.  * Replace WooCommerce default PayPal icon
  3.  */
  4. function paypal_checkout_icon() {
  5.  return 'https://www.paypalobjects.com/webstatic/mktg/logo-center/logo_betalen_met_paypal_nl.jpg'; // write your own image URL here
  6. }
  7. add_filter( 'woocommerce_paypal_icon', 'paypal_checkout_icon' );

2 – 替换默认产品占位符图片

  1. /*
  2. * goes in theme functions.php or a custom plugin. Replace the image filename/path with your own ?
  3. *
  4. **/
  5. add_action( 'init', 'custom_fix_thumbnail' );
  6.  
  7. function custom_fix_thumbnail() {
  8.   add_filter('woocommerce_placeholder_img_src', 'custom_woocommerce_placeholder_img_src');
  9.  
  10. 	function custom_woocommerce_placeholder_img_src( $src ) {
  11. 	$upload_dir = wp_upload_dir();
  12. 	$uploads = untrailingslashit( $upload_dir['baseurl'] );
  13. 	$src = $uploads . '/2012/07/thumb1.jpg';
  14.  
  15. 	return $src;
  16. 	}
  17. }

3 – 从面包屑中移除“Products”

  1. /*
  2.  * Hide "Products" in WooCommerce breadcrumb
  3.  */
  4. function woo_custom_filter_breadcrumbs_trail ( $trail ) {
  5.   foreach ( $trail as $k => $v ) {
  6.     if ( strtolower( strip_tags( $v ) ) == 'products' ) {
  7.       unset( $trail[$k] );
  8.       break;
  9.     }
  10.   }
  11.  
  12.   return $trail;
  13. }
  14.  
  15. add_filter( 'woo_breadcrumbs_trail', 'woo_custom_filter_breadcrumbs_trail', 10 );

4 – 清空购物车

  1. /*
  2.  * Empty WooCommerce cart
  3.  */
  4. function my_empty_cart(){
  5. 	global $woocommerce;
  6. 	$woocommerce->cart->empty_cart(); 
  7. }
  8. add_action('init', 'my_empty_cart');

5 – 访问时自动添加产品到购物车

  1. /*
  2.  * Add item to cart on visit
  3.  */
  4. function add_product_to_cart() {
  5. 	if ( ! is_admin() ) {
  6. 		global $woocommerce;
  7. 		$product_id = 64;
  8. 		$found = false;
  9. 		//check if product already in cart
  10. 		if ( sizeof( $woocommerce->cart->get_cart() ) > 0 ) {
  11. 			foreach ( $woocommerce->cart->get_cart() as $cart_item_key => $values ) {
  12. 				$_product = $values['data'];
  13. 				if ( $_product->id == $product_id )
  14. 					$found = true;
  15. 			}
  16. 			// if product not found, add it
  17. 			if ( ! $found )
  18. 				$woocommerce->cart->add_to_cart( $product_id );
  19. 		} else {
  20. 			// if no products in cart, add it
  21. 			$woocommerce->cart->add_to_cart( $product_id );
  22. 		}
  23. 	}
  24. }
  25. add_action( 'init', 'add_product_to_cart' );

6 – 添加自定义货币/符号

  1. add_filter( 'woocommerce_currencies', 'add_my_currency' );
  2.  
  3. function add_my_currency( $currencies ) {
  4.      $currencies['ABC'] = __( 'Currency name', 'woocommerce' );
  5.      return $currencies;
  6. }
  7.  
  8. add_filter('woocommerce_currency_symbol', 'add_my_currency_symbol', 10, 2);
  9.  
  10. function add_my_currency_symbol( $currency_symbol, $currency ) {
  11.      switch( $currency ) {
  12.           case 'ABC': $currency_symbol = '$'; break;
  13.      }
  14.      return $currency_symbol;
  15. }

7 – 更改添加到购物车按钮文字

  1. /**
  2.  * Change the add to cart text on single product pages
  3.  */
  4. function woo_custom_cart_button_text() {
  5. 	return __('My Button Text', 'woocommerce');
  6. }
  7. add_filter('single_add_to_cart_text', 'woo_custom_cart_button_text');
  8.  
  9.  
  10.  
  11. /**
  12.  * Change the add to cart text on product archives
  13.  */
  14. function woo_archive_custom_cart_button_text() {
  15. 	return __( 'My Button Text', 'woocommerce' );
  16. }
  17. add_filter( 'add_to_cart_text', 'woo_archive_custom_cart_button_text' );

8 – 重定向订阅添加到购物车到结帐页面

  1. /**
  2.  * Redirect subscription add to cart to checkout page
  3.  *
  4.  * @param string $url
  5.  */
  6. function custom_add_to_cart_redirect( $url ) {
  7.  
  8.   $product_id	= (int) $_REQUEST['add-to-cart'];
  9. 	if ( class_exists( 'WC_Subscriptions_Product' ) ) {
  10. 		if ( WC_Subscriptions_Product::is_subscription( $product_id ) ) {
  11. 			return get_permalink(get_option( 'woocommerce_checkout_page_id' ) );
  12. 		} else return $url;
  13. 	} else return $url;
  14.  
  15. }
  16. add_filter('add_to_cart_redirect', 'custom_add_to_cart_redirect');

此片段需要订阅插件。

9 – 加入购物车后,重定向到结帐页面

  1. /**
  2.  * Redirect subscription add to cart to checkout page
  3.  *
  4.  * @param none
  5.  */
  6. function add_to_cart_checkout_redirect() {
  7. 	wp_safe_redirect( get_permalink( get_option( 'woocommerce_checkout_page_id' ) ) );
  8. 	die();
  9. }
  10. add_action( 'woocommerce_add_to_cart',  'add_to_cart_checkout_redirect', 11 );

10 – CC所有电子邮件

  1.  /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Add another email recipient to all WooCommerce emails
  6.  *
  7.  */
  8. function woo_cc_all_emails() {
  9.   return 'Bcc: youremail@yourdomain.com' . "\r\n";
  10. }
  11. add_filter('woocommerce_email_headers', 'woo_cc_all_emails' );

11 – 当使用优惠券完成新订单时,发送电子邮件

  1. /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Send an email each time an order with coupon(s) is completed
  6.  * The email contains coupon(s) used during checkout process
  7.  *
  8.  */ 
  9. function woo_email_order_coupons( $order_id ) {
  10.         $order = new WC_Order( $order_id );
  11.  
  12.         if( $order->get_used_coupons() ) {
  13.  
  14.           $to = 'youremail@yourcompany.com';
  15. 	        $subject = 'New Order Completed';
  16. 	        $headers = 'From: My Name ' . "\r\n";
  17.  
  18. 	        $message = 'A new order has been completed.\n';
  19. 	        $message .= 'Order ID: '.$order_id.'\n';
  20. 	        $message .= 'Coupons used:\n';
  21.  
  22. 	        foreach( $order->get_used_coupons() as $coupon) {
  23. 		        $message .= $coupon.'\n';
  24. 	        }
  25. 	        @wp_mail( $to, $subject, $message, $headers );
  26.         }
  27. }
  28. add_action( 'woocommerce_thankyou', 'woo_email_order_coupons' );

12 – 更改相关产品数量

  1. /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Change number of related products on product page
  6.  * Set your own value for 'posts_per_page'
  7.  *
  8.  */ 
  9. function woo_related_products_limit() {
  10.   global $product;
  11.  
  12. 	$args = array(
  13. 		'post_type'        		=> 'product',
  14. 		'no_found_rows'    		=> 1,
  15. 		'posts_per_page'   		=> 6,
  16. 		'ignore_sticky_posts' 	=> 1,
  17. 		'orderby'             	=> $orderby,
  18. 		'post__in'            	=> $related,
  19. 		'post__not_in'        	=> array($product->id)
  20. 	);
  21. 	return $args;
  22. }
  23. add_filter( 'woocommerce_related_products_args', 'woo_related_products_limit' );

13 – 从商店页面中的特定类别中排除产品

  1.  /**
  2.  * Remove products from shop page by category
  3.  *
  4.  */
  5. function woo_custom_pre_get_posts_query( $q ) {
  6.  
  7. 	if ( ! $q->is_main_query() ) return;
  8. 	if ( ! $q->is_post_type_archive() ) return;
  9.  
  10. 	if ( ! is_admin() && is_shop() ) {
  11.  
  12. 		$q->set( 'tax_query', array(array(
  13. 			'taxonomy' => 'product_cat',
  14. 			'field' => 'slug',
  15. 			'terms' => array( 'shoes' ), // Don't display products in the shoes category on the shop page
  16. 			'operator' => 'NOT IN'
  17. 		)));
  18.  
  19. 	}
  20.  
  21. 	remove_action( 'pre_get_posts', 'custom_pre_get_posts_query' );
  22.  
  23. }
  24. add_action( 'pre_get_posts', 'woo_custom_pre_get_posts_query' );

14 – 更改商城列数

  1. /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Change product columns number on shop pages
  6.  *
  7.  */
  8. function woo_product_columns_frontend() {
  9.     global $woocommerce;
  10.  
  11.     // Default Value also used for categories and sub_categories
  12.     $columns = 4;
  13.  
  14.     // Product List
  15.     if ( is_product_category() ) :
  16.         $columns = 4;
  17.     endif;
  18.  
  19.     //Related Products
  20.     if ( is_product() ) :
  21.         $columns = 2;
  22.     endif;
  23.  
  24.     //Cross Sells
  25.     if ( is_checkout() ) :
  26.         $columns = 4;
  27.     endif;
  28.  
  29. 	return $columns;
  30. }
  31. add_filter('loop_shop_columns', 'woo_product_columns_frontend');

15 – 禁用WooCommerce选项卡

  1. /**
  2.  * Remove product tabs
  3.  *
  4.  */
  5. function woo_remove_product_tab($tabs) {
  6.  
  7.     unset( $tabs['description'] );      		// Remove the description tab
  8.     unset( $tabs['reviews'] ); 					// Remove the reviews tab
  9.     unset( $tabs['additional_information'] );  	// Remove the additional information tab
  10.  
  11.  	return $tabs;
  12.  
  13. }
  14. add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tab', 98);

16 – 移除面包屑

  1.  /**
  2.  * Remove WooCommerce BreadCrumb
  3.  *
  4.  */
  5. remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20);

17 – 限制运输的国家列表

  1. /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Restrict shipping countries list
  6.  *
  7.  */
  8. function woo_override_checkout_fields( $fields ) { 
  9.  
  10. 	$fields['shipping']['shipping_country'] = array(
  11. 		'type'      => 'select',
  12. 		'label'     => __('My New Country List', 'woocommerce'),
  13. 		'options' 	=> array('AU' => 'Australia')
  14. 	);
  15.  
  16. 	return $fields; 
  17. } 
  18. add_filter( 'woocommerce_checkout_fields' , 'woo_override_checkout_fields' );

18 – 替换“Free!”产品字符串

  1. /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Replace "Free!" by a custom string
  6.  *
  7.  */
  8. function woo_my_custom_free_message() {
  9. 	return "This product is FREE!";
  10. }
  11.  
  12. add_filter('woocommerce_free_price_html', 'woo_my_custom_free_message');

19 – 当免费送货可用时隐藏所有其他运送方式

  1. // Hide ALL shipping options when free shipping is available
  2. add_filter( 'woocommerce_available_shipping_methods', 'hide_all_shipping_when_free_is_available' , 10, 1 );
  3.  
  4. /**
  5. * Hide ALL Shipping option when free shipping is available
  6. *
  7. * @param array $available_methods
  8. */
  9. function hide_all_shipping_when_free_is_available( $available_methods ) {
  10.  
  11.   	if( isset( $available_methods['free_shipping'] ) ) :
  12.  
  13. 		// Get Free Shipping array into a new array
  14. 		$freeshipping = array();
  15. 		$freeshipping = $available_methods['free_shipping'];
  16.  
  17. 		// Empty the $available_methods array
  18. 		unset( $available_methods );
  19.  
  20. 		// Add Free Shipping back into $avaialble_methods
  21. 		$available_methods = array();
  22. 		$available_methods[] = $freeshipping;
  23.  
  24. 	endif;
  25.  
  26. 	return $available_methods;
  27. }

20 – 设置结账时“state”字段非必填

  1. /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Make "state" field not required on checkout
  6.  *
  7.  */
  8.  
  9. add_filter( 'woocommerce_billing_fields', 'woo_filter_state_billing', 10, 1 );
  10. add_filter( 'woocommerce_shipping_fields', 'woo_filter_state_shipping', 10, 1 );
  11.  
  12. function woo_filter_state_billing( $address_fields ) { 
  13. 	$address_fields['billing_state']['required'] = false;
  14. 	return $address_fields;
  15. }
  16.  
  17. function woo_filter_state_shipping( $address_fields ) { 
  18. 	$address_fields['shipping_state']['required'] = false;
  19. 	return $address_fields;
  20. }

21 – 创建优惠券程序

  1. $coupon_code = 'UNIQUECODE'; // Code
  2. $amount = '10'; // Amount
  3. $discount_type = 'fixed_cart'; // Type: fixed_cart, percent, fixed_product, percent_product
  4.  
  5. $coupon = array(
  6. 	'post_title' => $coupon_code,
  7. 	'post_content' => '',
  8. 	'post_status' => 'publish',
  9. 	'post_author' => 1,
  10. 	'post_type'		=> 'shop_coupon'
  11. );
  12.  
  13. $new_coupon_id = wp_insert_post( $coupon );
  14.  
  15. // Add meta
  16. update_post_meta( $new_coupon_id, 'discount_type', $discount_type );
  17. update_post_meta( $new_coupon_id, 'coupon_amount', $amount );
  18. update_post_meta( $new_coupon_id, 'individual_use', 'no' );
  19. update_post_meta( $new_coupon_id, 'product_ids', '' );
  20. update_post_meta( $new_coupon_id, 'exclude_product_ids', '' );
  21. update_post_meta( $new_coupon_id, 'usage_limit', '' );
  22. update_post_meta( $new_coupon_id, 'expiry_date', '' );
  23. update_post_meta( $new_coupon_id, 'apply_before_tax', 'yes' );
  24. update_post_meta( $new_coupon_id, 'free_shipping', 'no' );

22 – 更改电子邮件主题行

  1. /*
  2.  * Subject filters: 
  3.  *   woocommerce_email_subject_new_order
  4.  *   woocommerce_email_subject_customer_procesing_order
  5.  *   woocommerce_email_subject_customer_completed_order
  6.  *   woocommerce_email_subject_customer_invoice
  7.  *   woocommerce_email_subject_customer_note
  8.  *   woocommerce_email_subject_low_stock
  9.  *   woocommerce_email_subject_no_stock
  10.  *   woocommerce_email_subject_backorder
  11.  *   woocommerce_email_subject_customer_new_account
  12.  *   woocommerce_email_subject_customer_invoice_paid
  13.  **/
  14. add_filter('woocommerce_email_subject_new_order', 'change_admin_email_subject', 1, 2);
  15.  
  16. function change_admin_email_subject( $subject, $order ) {
  17. 	global $woocommerce;
  18.  
  19. 	$blogname = wp_specialchars_decode(get_option('blogname'), ENT_QUOTES);
  20.  
  21. 	$subject = sprintf( '[%s] New Customer Order (# %s) from Name %s %s', $blogname, $order->id, $order->billing_first_name, $order->billing_last_name );
  22.  
  23. 	return $subject;
  24. }

23 – 添加自定义费用到购物车

  1. /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Add custom fee to cart automatically
  6.  *
  7.  */
  8. function woo_add_cart_fee() {
  9.  
  10. 	global $woocommerce;
  11.  
  12. 	if ( is_cart() ) {
  13. 		$woocommerce->cart->add_fee( __('Custom', 'woocommerce'), 5 );
  14. 	}
  15.  
  16. }
  17. add_action( 'woocommerce_before_cart_table', 'woo_add_cart_fee' );

24 – 自定义添加到购物车消息

  1. /**
  2.  * Custom Add To Cart Messages
  3.  * Add this to your theme functions.php file
  4.  **/
  5. add_filter( 'woocommerce_add_to_cart_message', 'custom_add_to_cart_message' );
  6. function custom_add_to_cart_message() {
  7. 	global $woocommerce;
  8.  
  9. 	// Output success messages
  10. 	if (get_option('woocommerce_cart_redirect_after_add')=='yes') :
  11.  
  12. 		$return_to 	= get_permalink(woocommerce_get_page_id('shop'));
  13.  
  14. 		$message 	= sprintf('<a href="%s" class="button">%s</a> %s', $return_to, __('Continue Shopping →', 'woocommerce'), __('Product successfully added to your cart.', 'woocommerce') );
  15.  
  16. 	else :
  17.  
  18. 		$message 	= sprintf('<a href="%s" class="button">%s</a> %s', get_permalink(woocommerce_get_page_id('cart')), __('View Cart →', 'woocommerce'), __('Product successfully added to your cart.', 'woocommerce') );
  19.  
  20. 	endif;
  21.  
  22. 		return $message;
  23. }

25 – 向管理员电子邮件添加付款方式

  1. /**
  2.  * WooCommerce Extra Feature
  3.  * --------------------------
  4.  *
  5.  * Add payment method to admin new order email
  6.  *
  7.  */
  8. add_action( 'woocommerce_email_after_order_table', 'woo_add_payment_method_to_admin_new_order', 15, 2 ); 
  9.  
  10. function woo_add_payment_method_to_admin_new_order( $order, $is_admin_email ) { 
  11. 	if ( $is_admin_email ) { 
  12. 	echo '<p><strong>Payment Method:</strong> ' . $order->payment_method_title . '</p>'; 
  13. 	} 
  14. }

原文链接:My 25 Best WooCommerce Snippets For WordPress Part 2

实用的25个WooCommerce片段2,首发于蓝月网络

]]>
实用的25个WooCommerce片段1 https://lanyueer.com/25-best-woocommerce-snippets-1/ Tue, 20 Jun 2017 11:30:56 +0000 https://lanyueer.com/?p=957 WooCommerce是非常强大的电商工具,并且易于扩展。 它有许多钩子可以用于修改几乎所有的东西,这就是使W…

实用的25个WooCommerce片段1,首发于蓝月网络

]]>
WooCommerce是非常强大的电商工具,并且易于扩展。 它有许多钩子可以用于修改几乎所有的东西,这就是使WooCommerce如此受欢迎。 以下一些实用的Woocommerce片段列表 所有这些片段必须粘贴在您的主题文件夹中的functions.php文件中才能起作用:
实用的25个WooCommerce片段2

WooCommerce是非常强大的电商工具,并且易于扩展。 它有许多钩子可以用于修改几乎所有的东西,这就是使WooCommerce如此受欢迎。 以下一些实用的Woocommerce片段列表 所有这些片段必须粘贴在您的主题文件夹中的functions.php文件中才能起作用: 1 – 替换WooCommerce默认PayPal logo /* * Replace WooCommerce default P...

1 – 将付款类型添加到WooCommerce管理电子邮件

  1. add_action( 'woocommerce_email_after_order_table', 'add_payment_method_to_admin_new_order', 15, 2 );
  2.  
  3. function add_payment_method_to_admin_new_order( $order, $is_admin_email ) {
  4.   if ( $is_admin_email ) {
  5.     echo '<p><strong>Payment Method:</strong> ' . $order->payment_method_title . '</p>';
  6.   }
  7. }

2 – 每页/每行向上销售产品数

  1. remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_upsell_display', 15 );
  2. add_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_upsells', 15 );
  3.  
  4. if ( ! function_exists( 'woocommerce_output_upsells' ) ) {
  5. 	function woocommerce_output_upsells() {
  6. 	    woocommerce_upsell_display( 3,3 ); // Display 3 products in rows of 3
  7. 	}
  8. }

3 – 从商店页面中删除某些产品类别

  1. add_action( 'pre_get_posts', 'custom_pre_get_posts_query' );
  2.  
  3. function custom_pre_get_posts_query( $q ) {
  4.  
  5. 	if ( ! $q->is_main_query() ) return;
  6. 	if ( ! $q->is_post_type_archive() ) return;
  7.  
  8. 	if ( ! is_admin() && is_shop() && ! is_user_logged_in() ) {
  9.  
  10. 		$q->set( 'tax_query', array(array(
  11. 			'taxonomy' => 'product_cat',
  12. 			'field' => 'slug',
  13. 			'terms' => array( 'color', 'flavor', 'spices', 'vanilla' ), // Don't display products in these categories on the shop page
  14. 			'operator' => 'NOT IN'
  15. 		)));
  16.  
  17. 	}
  18.  
  19. 	remove_action( 'pre_get_posts', 'custom_pre_get_posts_query' );
  20.  
  21. }

4 – 快速翻译字段

  1. add_filter('gettext',  'translate_text');
  2. add_filter('ngettext',  'translate_text');
  3.  
  4. function translate_text($translated) {
  5.      $translated = str_ireplace('Choose and option',  'Select',  $translated);
  6.      return $translated;
  7. }

5 – 从WooCommerce类别小工具中排除一个类别

  1. add_filter( 'woocommerce_product_categories_widget_args', 'woo_product_cat_widget_args' );
  2.  
  3. function woo_product_cat_widget_args( $cat_args ) {
  4.  
  5. 	$cat_args['exclude'] = array('16');
  6.  
  7. 	return $cat_args;
  8. }

6 – 向产品可变添加自定义字段

  1. //Display Fields
  2. add_action( 'woocommerce_product_after_variable_attributes', 'variable_fields', 10, 2 );
  3. //JS to add fields for new variations
  4. add_action( 'woocommerce_product_after_variable_attributes_js', 'variable_fields_js' );
  5. //Save variation fields
  6. add_action( 'woocommerce_process_product_meta_variable', 'variable_fields_process', 10, 1 );
  7.  
  8. function variable_fields( $loop, $variation_data ) { ?>	
  9. 	<tr>
  10. 		<td>
  11. 			<div>
  12. 					<label></label>
  13. 					<input type="text" size="5" name="my_custom_field[]" value=""/>
  14. 			</div>
  15. 		</td>
  16. 	</tr>
  17.  
  18. <tr>
  19. 		<td>
  20. 			<div>
  21. 					<label></label>
  22.  
  23. 			</div>
  24. 		</td>
  25. 	</tr>
  26. <?php }
  27.  
  28. function variable_fields_process( $post_id ) {
  29. 	if (isset( $_POST['variable_sku'] ) ) :
  30. 		$variable_sku = $_POST['variable_sku'];
  31. 		$variable_post_id = $_POST['variable_post_id'];
  32. 		$variable_custom_field = $_POST['my_custom_field'];
  33. 		for ( $i = 0; $i < sizeof( $variable_sku ); $i++ ) :
  34. 			$variation_id = (int) $variable_post_id[$i];
  35. 			if ( isset( $variable_custom_field[$i] ) ) {
  36. 				update_post_meta( $variation_id, '_my_custom_field', stripslashes( $variable_custom_field[$i] ) );
  37. 			}
  38. 		endfor;
  39. 	endif;
  40. }

7 – 用“sold”替换“Out of stock”

  1. add_filter('woocommerce_get_availability', 'availability_filter_func');
  2.  
  3. function availability_filter_func($availability)
  4. {
  5. 	$availability['availability'] = str_ireplace('Out of stock', 'Sold', $availability['availability']);
  6. 	return $availability;
  7. }

8 – 使用“产品已在购物车”替代“加入购物车”按钮

  1. /**
  2.  * Change the add to cart text on single product pages
  3.  */
  4. add_filter( 'woocommerce_product_single_add_to_cart_text', 'woo_custom_cart_button_text' );
  5.  
  6. function woo_custom_cart_button_text() {
  7.  
  8. 	global $woocommerce;
  9.  
  10. 	foreach($woocommerce->cart->get_cart() as $cart_item_key => $values ) {
  11. 		$_product = $values['data'];
  12.  
  13. 		if( get_the_ID() == $_product->id ) {
  14. 			return __('Already in cart - Add Again?', 'woocommerce');
  15. 		}
  16. 	}
  17.  
  18. 	return __('Add to cart', 'woocommerce');
  19. }
  20.  
  21. /**
  22.  * Change the add to cart text on product archives
  23.  */
  24. add_filter( 'add_to_cart_text', 'woo_archive_custom_cart_button_text' );
  25.  
  26. function woo_archive_custom_cart_button_text() {
  27.  
  28. 	global $woocommerce;
  29.  
  30. 	foreach($woocommerce->cart->get_cart() as $cart_item_key => $values ) {
  31. 		$_product = $values['data'];
  32.  
  33. 		if( get_the_ID() == $_product->id ) {
  34. 			return __('Already in cart', 'woocommerce');
  35. 		}
  36. 	}
  37.  
  38. 	return __('Add to cart', 'woocommerce');
  39. }

9 – 在类别视图中隐藏产品数量

  1. add_filter( 'woocommerce_subcategory_count_html', 'woo_remove_category_products_count' );
  2.  
  3. function woo_remove_category_products_count() {
  4. 	return;
  5. }

10 – 设置结账字段必填

  1. add_filter( 'woocommerce_checkout_fields', 'woo_filter_account_checkout_fields' );
  2.  
  3. function woo_filter_account_checkout_fields( $fields ) {
  4. 	$fields['account']['account_username']['required'] = true;
  5. 	$fields['account']['account_password']['required'] = true;
  6. 	$fields['account']['account_password-2']['required'] = true;
  7.  
  8. 	return $fields;
  9. }

11 – 重命名产品选项卡

  1. add_filter( 'woocommerce_product_tabs', 'woo_rename_tab', 98);
  2. function woo_rename_tab($tabs) {
  3.  
  4.  $tabs['description']['title'] = 'More info';
  5.  
  6.  return $tabs;
  7. }

12 – 列出WooCommerce产品分类

  1. $args = array(
  2.     'number'     => $number,
  3.     'orderby'    => $orderby,
  4.     'order'      => $order,
  5.     'hide_empty' => $hide_empty,
  6.     'include'    => $ids
  7. );
  8.  
  9. $product_categories = get_terms( 'product_cat', $args );
  10.  
  11. $count = count($product_categories);
  12.  if ( $count > 0 ){
  13.      echo "<ul>";
  14.      foreach ( $product_categories as $product_category ) {
  15.        echo '<li><a href="' . get_term_link( $product_category ) . '">' . $product_category->name . '</li>';
  16.  
  17.      }
  18.      echo "</ul>";
  19.  }

13 – 更换商店页面标题

  1. add_filter( 'woocommerce_page_title', 'woo_shop_page_title');
  2.  
  3. function woo_shop_page_title( $page_title ) {
  4.  
  5. 	if( 'Shop' == $page_title) {
  6. 		return "My new title";
  7. 	}
  8. }

14 – 更改小工具标题

  1. /*
  2.  * Change widget title
  3.  */
  4. add_filter( 'widget_title', 'woo_widget_title', 10, 3);
  5.  
  6. function woo_widget_title( $title, $instance, $id_base ) {
  7.  
  8. 	if( 'onsale' == $id_base) {
  9. 		return "My new title";
  10. 	}
  11. }

15 – 删除WooCommerce默认设置

  1. add_filter( 'woocommerce_catalog_settings', 'woo_remove_catalog_options' );
  2.  
  3. function woo_remove_catalog_options( $catalog ) {
  4.  
  5. 	unset($catalog[23]); //Trim zeros (no) 
  6. 	unset($catalog[22]); //2 decimals 
  7. 	unset($catalog[21]); //decimal sep (.) 
  8. 	unset($catalog[20]); //thousand sep (,) 
  9. 	unset($catalog[19]); //currency position (left)	
  10. 	unset($catalog[18]); //currency position (left)	
  11. 	unset($catalog[5]); // ajax add to cart (no)	
  12.  
  13. 	return $catalog; 
  14. }

16 – 更改发件人电子邮件地址

  1. function woo_custom_wp_mail_from() {
  2.         global $woocommerce;
  3.         return html_entity_decode( 'your@email.com' );
  4. }
  5. add_filter( 'wp_mail_from', 'woo_custom_wp_mail_from', 99 );

17 – 从WooCommerce电子邮件名称解码

  1. function woo_custom_wp_mail_from_name() {
  2.         global $woocommerce;
  3.         return html_entity_decode( get_option( 'woocommerce_email_from_name' ) );
  4. }
  5. add_filter( 'wp_mail_from_name', 'woo_custom_wp_mail_from_name', 99 );
  6.  
  7. function woo_custom_wp_mail_from() {
  8.         global $woocommerce;
  9.         return html_entity_decode( get_option( 'woocommerce_email_from' ) );
  10. }
  11. add_filter( 'wp_mail_from_name', 'woo_custom_wp_mail_from_name', 99 );

18 – 返回特色产品ID

  1. function woo_get_featured_product_ids() {
  2. 	// Load from cache
  3. 	$featured_product_ids = get_transient( 'wc_featured_products' );
  4.  
  5. 	// Valid cache found
  6. 	if ( false !== $featured_product_ids )
  7. 		return $featured_product_ids;
  8.  
  9. 	$featured = get_posts( array(
  10. 		'post_type'      => array( 'product', 'product_variation' ),
  11. 		'posts_per_page' => -1,
  12. 		'post_status'    => 'publish',
  13. 		'meta_query'     => array(
  14. 			array(
  15. 				'key' 		=> '_visibility',
  16. 				'value' 	=> array('catalog', 'visible'),
  17. 				'compare' 	=> 'IN'
  18. 			),
  19. 			array(
  20. 				'key' 	=> '_featured',
  21. 				'value' => 'yes'
  22. 			)
  23. 		),
  24. 		'fields' => 'id=>parent'
  25. 	) );
  26.  
  27. 	$product_ids = array_keys( $featured );
  28. 	$parent_ids  = array_values( $featured );
  29. 	$featured_product_ids = array_unique( array_merge( $product_ids, $parent_ids ) );
  30.  
  31. 	set_transient( 'wc_featured_products', $featured_product_ids );
  32.  
  33. 	return $featured_product_ids;
  34. }

19 – 在编辑地址页面添加自定义字段

  1. // add fields to edit address page
  2. function woo_add_edit_address_fields( $fields ) {
  3.  
  4. 	$new_fields = array(
  5. 				'date_of_birth'     => array(
  6. 				'label'             => __( 'Date of birth', 'woocommerce' ),
  7. 				'required'          => false,
  8. 				'class'             => array( 'form-row' ),
  9. 			),
  10. 		);
  11.  
  12. 	$fields = array_merge( $fields, $new_fields );
  13.  
  14.     return $fields;
  15.  
  16. }
  17.  
  18. add_filter( 'woocommerce_default_address_fields', 'woo_add_edit_address_fields' );

20 – 显示销售产品目录简码

  1. function woocommerce_sale_products( $atts ) {
  2.  
  3.     global $woocommerce_loop;
  4.  
  5.     extract(shortcode_atts(array(
  6.         'per_page'  => '12',
  7.         'columns'   => '4',
  8.         'orderby' => 'date',
  9.         'order' => 'desc'
  10.     ), $atts));
  11.  
  12.     $woocommerce_loop['columns'] = $columns;
  13.  
  14.     $args = array(
  15.         'post_type' => 'product',
  16.         'post_status' => 'publish',
  17.         'ignore_sticky_posts'   => 1,
  18.         'posts_per_page' => $per_page,
  19.         'orderby' => $orderby,
  20.         'order' => $order,
  21.         'meta_query' => array(
  22.             array(
  23.                 'key' => '_visibility',
  24.                 'value' => array('catalog', 'visible'),
  25.                 'compare' => 'IN'
  26.             ),
  27.             array(
  28.                 'key' => '_sale_price',
  29.                 'value' =>  0,
  30.                 'compare'   => '>',
  31.                 'type'      => 'NUMERIC'
  32.             )
  33.         )
  34.     );
  35.     query_posts($args);
  36.     ob_start();
  37.     woocommerce_get_template_part( 'loop', 'shop' );
  38.     wp_reset_query();
  39.  
  40.     return ob_get_clean();
  41. }
  42.  
  43. add_shortcode('sale_products', 'woocommerce_sale_products');

21 – 有促销商品

  1. function woo_have_onsale_products() {
  2.  
  3. 	global $woocommerce;
  4.  
  5. 	// Get products on sale
  6. 	$product_ids_on_sale = array_filter( woocommerce_get_product_ids_on_sale() );
  7.  
  8. 	if( !empty( $product_ids_on_sale ) ) {
  9. 		return true;
  10. 	} else {
  11. 		return false;
  12. 	}
  13.  
  14. }
  15.  
  16. // Example:
  17. if( woo_have_onsale_products() ) {
  18. 	echo 'have onsale products';
  19. } else {
  20. 	echo 'no onsale product';
  21. }

22 – 设定最低订单量

  1. add_action( 'woocommerce_checkout_process', 'wc_minimum_order_amount' );
  2. function wc_minimum_order_amount() {
  3. 	global $woocommerce;
  4. 	$minimum = 50;
  5. 	if ( $woocommerce->cart->get_cart_total(); < $minimum ) {
  6.            $woocommerce->add_error( sprintf( 'You must have an order with a minimum of %s to place your order.' , $minimum ) );
  7. 	}
  8. }

23 – 在商城页面按价格,日期或标题排序

  1. add_filter('woocommerce_default_catalog_orderby', 'custom_default_catalog_orderby');
  2.  
  3. function custom_default_catalog_orderby() {
  4.      return 'date'; // Can also use title and price
  5. }

24 – 重定向添加到购物车按钮到结帐页面

  1. add_filter ('add_to_cart_redirect', 'redirect_to_checkout');
  2.  
  3. function redirect_to_checkout() {
  4.     global $woocommerce;
  5.     $checkout_url = $woocommerce->cart->get_checkout_url();
  6.     return $checkout_url;
  7. }

25 – 订单完成时添加电子邮件收件人

  1. function woo_extra_email_recipient($recipient, $object) {
  2.     $recipient = $recipient . ', your@email.com';
  3.     return $recipient;
  4. }
  5. add_filter( 'woocommerce_email_recipient_customer_completed_order', 'woo_extra_email_recipient', 10, 2);

原文链接:My 25 Best WooCommerce Snippets For WordPress

实用的25个WooCommerce片段1,首发于蓝月网络

]]>
WooCommerce使用paypal结账设置 https://lanyueer.com/woocommerce-paypal/ Fri, 09 Jun 2017 05:49:57 +0000 https://lanyueer.com/?p=946 PayPal(在中国大陆的品牌为贝宝),是美国eBay公司的全资子公司。1998年12月由 Peter Thi…

WooCommerce使用paypal结账设置,首发于蓝月网络

]]>
PayPal(在中国大陆的品牌为贝宝),是美国eBay公司的全资子公司。1998年12月由 Peter Thiel 及 Max Levchin 建立。 是一个总部在美国加利福尼亚州圣荷西市的因特网服务商,允许在使用电子邮件来标识身份的用户之间转移资金,避免了传统的邮寄支票或者汇款的方法。

一般国内alipay,国外PayPal,做外贸网站基本都是使用PayPal !

首先请确定您的PayPal账户为商家账户[Business Account],然后继续。

注册PayPal

1.打开PayPal官方网站 https://www.paypal.com/点击右上方注册按钮。

11

2.选择商家账户(目前个人和企业都可以注册)。

12

3.输入要注册的邮箱,账户信息等,一步步向下操作就可以了。

13

14

15

16

PS:右下角可以选择中文显示,请收到邮件后激活一下。

获取API

1.登录您的PayPal,点击右上角的用户信息,弹出窗口,选择【用户信息与设置】。

17

2.点击左侧最后一个选择【销售工具】,然后选择【API访问】,点击更新。

18

3.选择选项2申请API凭证

19

4.请选择申请API签名

20

5.获取成功,点击显示,将会获取下方如图的API签名。

21

添加到woocommerce网店

到网站后台,路径是 woocommerce>设置>结算>贝宝 。把上方获取的API填写到相应的输入框。

120

WooCommerce使用paypal结账设置,首发于蓝月网络

]]>
设置Paypal Sandbox测试WooCommerce Subscription https://lanyueer.com/woocommerce-paypal-sandbox-test/ Fri, 09 Jun 2017 02:04:22 +0000 https://lanyueer.com/?p=941 创建Paypal Sandbox账户 首先,到developer.paypal.com注册一个开发者账户。 注…

设置Paypal Sandbox测试WooCommerce Subscription,首发于蓝月网络

]]>
创建Paypal Sandbox账户

首先,到developer.paypal.com注册一个开发者账户。

注册成功后,到Applications » Sandbox accounts下点击Create Account按钮创建账户,我们需要两个账户:

  • 卖家账户(Business)
  • 买家账户(Personal)

例如,注册卖家账户,所有信息都不需要是真的,如果你懒得编,用Fake Name Generator生成一个填上即可。


获取API信息

WooCommerce Subscription需要Paypal订阅和取消的功能,除了要卖家的邮箱之外,还需要API信息,获取API信息的方法是:点击账户旁边的箭头,点击Profile,切换到弹窗第二个选项卡(API credentials),把信息填写进去即可。

WooCommerce Subscription插件设置

设置Paypal Sandbox测试WooCommerce Subscription,首发于蓝月网络

]]>
WooCommerce 在购物车中显示商品的总重量 https://lanyueer.com/woocommerce-display-total-weight-on-cart-and-checkout/ Sun, 16 Apr 2017 12:56:40 +0000 http://lanyueer.com/?p=836 WooCommerce 每个商品都会有一个重量参数,在有些WooCommerce电子商务站点上,购物的运费是要…

WooCommerce 在购物车中显示商品的总重量,首发于蓝月网络

]]>
WooCommerce 每个商品都会有一个重量参数,在有些WooCommerce电子商务站点上,购物的运费是要根据重量计算的,这种情况下,在购物车中显示一个添加到购物车中所有商品的总重量是非常重要的。WooCommerce的订单是有一个总重量字段的,只不过在默认情况下没显示出来。我们只需要把这个参数调出来就可以了。

  1. add_action('woocommerce_cart_collaterals', 'myprefix_cart_extra_info');
  2.  
  3. function myprefix_cart_extra_info() {
  4.     global $woocommerce;
  5.     echo '<div class="cart-extra-info">';
  6.     echo '<p class="total-weight">' . __('Total Weight:', 'woocommerce');
  7.     echo ' ' . $woocommerce->cart->cart_contents_weight . ' ' . get_option('woocommerce_weight_unit');
  8.     echo '</p>';
  9.     echo '</div>';
  10. }
  11.  
  12. add_action( 'woocommerce_review_order_before_shipping', 'pft_checkout_weight_info' );
  13. function pft_checkout_weight_info() {
  14.     global $woocommerce;
  15.     echo '<tr>';
  16.     echo '<th>Total Weight</th>';
  17.     echo '<td>' . $woocommerce->cart->cart_contents_weight . ' ' . get_option('woocommerce_weight_unit') . '</td>';
  18.     echo '</tr>';
  19. }

WooCommerce 在购物车中显示商品的总重量,首发于蓝月网络

]]>
怎么让你开发的主题兼容 WooCommerce-在主题中声明 WooCommerce 支持 https://lanyueer.com/declare-woocommerce-support/ Sun, 16 Apr 2017 12:28:59 +0000 http://lanyueer.com/?p=833 大多数情况下,WooCommerce 可以很好的集成到大多数 WordPress 主题中。在有些定制开发的主题…

怎么让你开发的主题兼容 WooCommerce-在主题中声明 WooCommerce 支持,首发于蓝月网络

]]>
大多数情况下,WooCommerce 可以很好的集成到大多数 WordPress 主题中。在有些定制开发的主题中,主题的样式可能会和 WooCommerce 的样式有一些冲突或不匹配的情况,这种情况下,WooCommerce 的商店页面、商品分类页面、商品页面的布局可能会出现错乱或显示不正常。我们就需要针对我们的主题做一些改造,使我们的主题很好的支持 WooCommerce。我们可以使用两个方法解决这个问题:

使用 hooks (针对高级用户和开发者)
在主题中使用 WooCommerce 的内容输出函数 woocommerce_content() 调用 WooCommerce 内容

方法一:使用 woocommerce_content() 函数

此方案可以让我们在主题中创建一个新模板中,这个模板负责所有 WooCommerce 分类法存档和商品显示,此方案使用所有默认的 WooCommerce 模板,并且没有办法修改默认的 WooCommerce 模板,对 WooCommerce 不熟悉的开发者或者不需要对 WooCommerce 进行深度定制的情况下,建议使用这种方法。这种方案实现起来非常简单,按照下面的方法操作就可以了。

第一步,复制 page.php 页面模板为 woocommerce.php 模板

复制主题的 page.php,重命名为 woocommerce.php,此文件的位置应该是在:wp-content/themes/你的主题/woocommerce.php.

第二步,编辑 woocommerce.php,替换 WordPress 循环为 WooCommerce 循环

使用你最喜欢的编辑器,打开 woocommerce.php,找到页面的文章循环代码,一般是以下面的代码开始:

  1. <?php if ( have_posts() ) :

以下面代码结束:

  1. <?php endif; ?>

删除以上两段代码中间的内容,粘贴下面的代码到上面的两段代码之间即可。

  1. <?php woocommerce_content(); ?>

完成以上操作后,我们使用了 WooCommerce 的循环代码,代替了 WordPress 默认的文章循环代码。

注意:使用 woocommerce.php 文件的时候,我们将不能在主题中覆盖 WooCommerce 的默认模板文件。

方法二:使用 hooks

hook 的方法比使用 woocommerce_content 的方法更复杂,同事也更灵活,这个方式和使用 hook 创建主题的方法类似,也是 WooCommerce 兼容 Twenty Ten 和 Eleven 的方法。在主题的 functions.php 文件中插入以下代码。

首先卸载 WooCommerce 默认封装 HTML 标记:

  1. remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10);
  2. remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10);

然后挂载我们自己主题的 HTML 标记:

  1. add_action('woocommerce_before_main_content', 'my_theme_wrapper_start', 10);
  2. add_action('woocommerce_after_main_content', 'my_theme_wrapper_end', 10);
  3.  
  4. function my_theme_wrapper_start() {
  5.   echo '<section id="main">';
  6. }
  7.  
  8. function my_theme_wrapper_end() {
  9.   echo '</section>';
  10. }

确保上面的标记和你所用主题的标记相匹配,具体标记可以在 page.php 中响应的位置找到。

声明 WooCommerce 支持

一旦主题做好了 WooCommerce 支持,我们可以在代码中声明我们的主题是支持 WooCommerce 的,这样就可以隐藏后台中 “你的主题没有声明 WooCommerce 支持” 的消息,在主题的 functions.php 文件中加入以下代码来实现这个功能:

  1. add_action( 'after_setup_theme', 'woocommerce_support' );
  2. function woocommerce_support() {
  3.     add_theme_support( 'woocommerce' );
  4. }

做好了以上一些步骤,你的主题已经做好基本的 WooCommerce 支持了,至于实现更多的布局样式和功能,就需要根据实际情况进行一些二次开发工作了

怎么让你开发的主题兼容 WooCommerce-在主题中声明 WooCommerce 支持,首发于蓝月网络

]]>
WooCommerce 中的条件判断标签函数-在主题中判断当前页面 https://lanyueer.com/the-conditional-tagging-function-in-woocommerce/ Sun, 16 Apr 2017 12:07:01 +0000 http://lanyueer.com/?p=832 为了方便主题开发,WooCommerce 为我们提供了一些条件判断函数,我们使用这些判断函数在合适的条件下…

WooCommerce 中的条件判断标签函数-在主题中判断当前页面,首发于蓝月网络

]]>
为了方便主题开发,WooCommerce 为我们提供了一些条件判断函数,我们使用这些判断函数在合适的条件下显示或隐藏某些内容。例如,我们只需要在商店页面显示一端文本,我们只需要使用 is_shop() 函数判断当前页面是否为商店页面就可以了。因为WooCommerce 是 WordPress 的一个插件,所有 WordPress 条件判断函数 在 WooCommerce 中也可以使用。

注意:我们只有在模板加载后,才可以在模板文件中使用这些条件判断函数,functions.php 文件在模板文件之前加载,所以在 functions.php 中,使用这些条件判断函数是无效的。

WooCommerce 中常用的条件判断函数

所有的条件判断函数测试当前条件是否匹配,匹配返回 TRUE,不匹配则返回 FALSE,下面的列表中是我们常用的 WooCommerce 条件判断函数,所有条件函数请参考 WooCommerce API 文档

是否为WooCommerce 页面

is_woocommerce()
如果页面使用的是 WooCommerce 模板,返回 true (购物车和结账页面使用的是标准的页面模板,不会包含在内)。

是否为商店主页面

is_shop()
当前页面为产品存档页面时,返回 true (商店)。

是否为产品分类页面

is_product_category()
当前页面是产品分类时,返回 true。
is_product_category( 'shirts' )
当前页面是产品分类项目 ‘shirts’ 时,返回 true,’shirt’ 为分类别名。
is_product_category( array( 'shirts', 'games' ) )
当前页面是产品分类项目 ‘shirts’ 或 ‘games’ 时,返回 true。

是否为产品标签页面

is_product_tag()
当前页面为产品标签时,返回 true。
is_product_tag( 'shirts' )
当前页面是产品标签项目 ‘shirts’ 时,返回 true,’shirt’ 为分类别名。
is_product_tag( array( 'shirts', 'games' ) )
当前页面是产品标签项目 ‘shirts’ 或 ‘games’ 时,返回 true。

是否为单个产品详情页面

is_product()
当前页面是单个产品详情页面时,返回 true, 是 is_singular 条件函数的封装。

是否为购物车页面

is_cart()
当前页面是购物车页面时,返回 true。

是否为结账页面

is_checkout()
当前分类是结账页面时,返回 true。

是否为客户账户页面

is_account_page()
当前页面为客户账户页面时,返回 true。

判断页面端点

is_wc_endpoint_url()
查看 WooCommerce 端点页面时,返回 true。
is_wc_endpoint_url( 'order-pay' )
查看支付订单端点页面时,返回 true。
is_wc_endpoint_url( 'order-received' )
查看收到订单端点页面时,返回 true。
is_wc_endpoint_url( 'view-order' )
查看查看订单端点页面时,返回 true。
is_wc_endpoint_url( 'edit-account' )
查看编辑账户页面时,返回 true。
is_wc_endpoint_url( 'edit-address' )
查看编辑地址端点页面时,返回 true。
is_wc_endpoint_url( 'lost-password' )
查看找回密码端点页面时,返回 true。
is_wc_endpoint_url( 'customer-logout' )
查看客户登出端点页面时,返回 true。
is_wc_endpoint_url( 'add-payment-method' )
查看添加支付方式端点页面时,返回 true。

判断是否为 Ajax 请求

is_ajax()
当前页面通过 Ajax 加载时,返回 true。

使用示例

下面的使用示例演示了怎么在不同的分类里面显示不同的内容。

  1. if ( is_product_category() ) {
  2.   if ( is_product_category( 'shirts' ) ) {
  3.     echo '你好,我这里都 T-shirt。';
  4.   } elseif ( is_product_category( 'games' ) ) {
  5.     echo '你好,我这里都是游戏。';
  6.   } else {
  7.     echo '你好,欢迎光临我们的商店。';
  8.   }
  9. }

WooCommerce 中的条件判断标签函数-在主题中判断当前页面,首发于蓝月网络

]]>
自定义 WooCommerce 插件的 CSS 样式的两种方法 https://lanyueer.com/there-are-two-ways-to-customize-the-css-style-of-the-woocommerce-plugin/ Sun, 16 Apr 2017 11:47:13 +0000 http://lanyueer.com/?p=831 WooCommerce 内置了负责显示商品和购物流程的所有 CSS 样式,这样能确保在安装了WooCommer…

自定义 WooCommerce 插件的 CSS 样式的两种方法,首发于蓝月网络

]]>
WooCommerce 内置了负责显示商品和购物流程的所有 CSS 样式,这样能确保在安装了WooCommerce,并进行了基本配置之后,就可以得到一个样式不错的商店。这很方便,然而大多数情况下,我们不会使用 WooCommerce 提供的基本样式,我们需要对 WooCommerce 的样式进行一些定制,让 WooCommerce 商店的外观和我们的主题更匹配。有两种方法可以对 WooCommerce 的样式进行定制。

WooCommerce 默认的样式文件

在WooCommerce 插件的 assets/css/ 文件夹中, 我们可以找到WooCommerce 默认的样式文件,分别是 woocommerce.scsswoocommerce.css.

woocommerce.css 压缩后的样式文件,此文件中包含了所有 WooCommerce 商店使用的基础 CSS 样式。
woocommerce.scss 这是WooCommerce 样式的 SCSS 源文件,通过编译后产品上面woocommerce.css 文件。
上面的样式文件中,设计到宽度的样式使用了百分比自适应布局,以便适配大多数主题,当然,我们可以根据自己的实际需要调整。

方法一:覆盖默认的 CSS 文件修改WooCommerce 样式

为了避免升级问题,我们建议只把上面的文件作为参考,而不是直接修改上面提到的文件。如果你只想修改一小部分 WooCommerce 样式,之间通过 CSS 覆盖掉这部分样式就可以了,比如:添加下面的 CSS 到主题的样式文件中,修改 WooCommerce 的按钮为黑色。

a.button, 
button.button, 
input.button, 
#review_form #submit {
  background:black; 
}

在前端,为了方便自定义样式,WooCommerce 在 HTML 的 body 标签上添加了主题名称,页面类型等信息,我们可以使用此信息单独定义一些特殊页面的样式,这也是 WordPress 推荐的做法。

方法二:禁用 WooCommerce 默认样式,使用主题自定义的样式

如果你准备对 WooCommerce 样式做一些大的修改,使用方法一可能会增加很多工作量,多写很多不必要的代码。这时候,禁用 WooCommerce 默认的 CSS 样式,使用我们主题自定义的样式是个比较好的选择。添加下面的代码到主题的 functions.php 文件中即可实现这个修改。

  1. // 逐个移除 WooCommerce 默认的样式文件
  2. add_filter( 'woocommerce_enqueue_styles', 'wizhi_dequeue_styles' );
  3. function wizhi_dequeue_styles( $enqueue_styles ) {
  4.     unset( $enqueue_styles['woocommerce-general'] ); // 移除基础组件样式
  5.     unset( $enqueue_styles['woocommerce-layout'] ); // 移除布局
  6.     unset( $enqueue_styles['woocommerce-smallscreen'] ); // 移除小屏幕自适应优化
  7.     return $enqueue_styles;
  8. }
  9.  
  10. // 或移除所有样式
  11. add_filter( 'woocommerce_enqueue_styles', '__return_false' );

进行了上面的修改之后,我们的主题就不再使用 WooCommerce 默认的样式文件了,我们可以把 WooCoomerce 默认的样式文件中复制到自己的主题中进行响应的修改,如果你使用 SCSS,也可以直接修改 SCSS 文件,修改后,和主题样式文件一起,编译成包含了 WooCommerce 样式的主题样式文件。

自定义 WooCommerce 插件的 CSS 样式的两种方法,首发于蓝月网络

]]>
WooCommerce 默认提供的简码短代码 https://lanyueer.com/woocommerce-default-shortcode/ Wed, 23 Nov 2016 14:16:42 +0000 http://lanyueer.com/?p=801 为了方便我们插件产品到文章或页面中,WooCommerce 默认提供了一些简码,使用这些简码,我们可以很方便的…

WooCommerce 默认提供的简码短代码,首发于蓝月网络

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

基本页面简码

[woocommerce_cart] – 显示购物车页面
[woocommerce_checkout] – 显示结账页面
[woocommerce_order_tracking] – 显示订单跟踪表单
[woocommerce_my_account] – 显示用户账户页面
大多数情况下,安装 WooCommerce 时,向导会自动添加以上简码到响应的页面中,如果没有运行安装向导,我们需要自行把上面的简码添加到页面中。

我的账户页面

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

参数:

  1. array(
  2.      'current_user' => '',
  3.      'order_count' => '15'
  4.  )
  5. [woocommerce_my_account order_count="12"]

当前页面参数会通过 get_user_by( ‘id’, get_current_user_id() ) 函数自动添加。
下面的页面可以在 WordPress 站点中的任何地方使用。

显示最新商品:recent_products

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

参数:

  1. array(
  2.      'per_page' => '12',
  3.       'columns' => '4',
  4.       'orderby' => 'date',
  5.       'order' => 'desc'
  6.  )
  7. [recent_products per_page="12" columns="4"]

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

显示特色推荐商品:featured_products

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

参数:

  1. array(
  2.      'per_page' => '12',
  3.       'columns' => '4',
  4.       'orderby' => 'date',
  5.       'order' => 'desc'
  6.  )
  7. [featured_products per_page="12" columns="4"]

显示单个商品:product

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

  1. [product id="99"]
  2. [product sku="FOO"]

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

显示多个商品:products

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

参数:

  1. array(
  2.       'columns' => '4',
  3.       'orderby' => 'title',
  4.       'order' => 'asc'
  5.  )
  6. [products ids="1, 2, 3, 4, 5"]
  7. [products skus="foo, bar, baz" orderby="date" order="desc"]

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

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

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

参数:

  1. array(
  2.       'id' => '99',
  3.       'style' => 'border:4px solid #ccc; padding: 12px;',
  4.       'sku' => 'FOO'
  5.  )
  6. [add_to_cart id="99"]

显示添加到购物车 URL:add_to_cart_url

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

Args:

  1. array(
  2.       'id' => '99',
  3.       'sku' => 'FOO'
  4.  )
  5. [add_to_cart_url id="99"]

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

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

参数:

  1. array(
  2.      'per_page' => '12',
  3.       'columns' => '4',
  4.       'orderby' => 'title',
  5.       'order' => 'asc',
  6.       'category' => ''
  7.  )
  8. [product_category category="appliances"]

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

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

参数:

  1. array(
  2.       'number' => 'null',
  3.       'orderby' => 'title',
  4.       'order' => 'ASC',
  5.       'columns' => '4',
  6.       'hide_empty' => '1',
  7.       'parent' => '',
  8.       'ids' => ''
  9.  )
  10. `number` 参数用来指定显示多少商品, `ids` 参数用来指定显示哪些分类中的商品。
  11.  
  12. [product_categories number="12" parent="0"]

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

商品页面:product_page

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

  1. [product_page id="99"]
  2. [product_page sku="FOO"]

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

列出促销中的商品:

参数:

  1. array(
  2.      'per_page' => '12',
  3.      'columns' => '4',
  4.      'orderby' => 'title',
  5.      'order' => 'asc'
  6.  )
  7.  
  8. [sale_products per_page="12"]

显示销量最高的商品:best_selling_products

列出销量最高的商品。

参数:

  1. array(
  2.      'per_page' => '12',
  3.      'columns' => '4'
  4.  )
  5.  
  6. [best_selling_products per_page="12"]

显示相关商品:related_products

列出相关商品。

参数:

  1. array(
  2.      'per_page' => '12',
  3.      'columns' => '4',
  4.      'orderby' => 'title'
  5.  )
  6.  
  7. [related_products per_page="12"]

显示评价最高的商品:top_rated_products

显示评价最高的商品。

参数:

  1. array(
  2.      'per_page' => '12',
  3.      'columns' => '4',
  4.      'orderby' => 'title',
  5.      'order' => 'asc'
  6.  )
  7.  
  8. [top_rated_products per_page="12"]

显示商品属性:product_attribute

列出指定属性的商品。

参数:

  1. array(
  2.      'per_page' => '12',
  3.      'columns' => '4',
  4.      'orderby' => 'title',
  5.      'order' => 'asc',
  6.      'attribute' => '',
  7.      'filter' => ''
  8.  )
  9.  
  10. [product_attribute attribute='color' filter='black']

‘per_page’ 参数

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

简码问题排除

如果你在页面上粘贴了代码,在前端却看不到商品输入,请确认简码没有被

 包含,这个问题很常见,移除.

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

根据自定义字段排序商品

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

  1. [recent_products]
  2. [featured_products]
  3. [products]
  4. [product_category]
  5. [sale_products]
  6. [top_rated_products]
  7. [product_attribute]
  8. [related_products]

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

menu_order
title
date
rand
id
“orderby” 属性的使用方法如下:

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

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

  1. add_filter( 'woocommerce_shortcode_products_query', 'woocommerce_shortcode_products_orderby' );
  2.  
  3. function woocommerce_shortcode_products_orderby( $args ) {
  4.  
  5. 	$standard_array = array('menu_order','title','date','rand','id');
  6.  
  7. 	if( isset( $args['orderby'] ) && !in_array( $args['orderby'], $standard_array ) ) {
  8. 		$args['meta_key'] = $args['orderby'];
  9. 		$args['orderby']  = 'meta_value_num'; 
  10. 	}
  11.  
  12. 	return $args;
  13. }

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

总结一下

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

WooCommerce 默认提供的简码短代码,首发于蓝月网络

]]> WooCommerce:修改“添加到购物车” 的按钮文字 https://lanyueer.com/change-woocommerce-add-to-cart-button-text/ Wed, 23 Nov 2016 13:58:26 +0000 http://lanyueer.com/?p=799 默认情况下,WooCommerce 网络商店中,当填写了商品价格时,添加到购物车上的文字为“添加到购物车(Ad…

WooCommerce:修改“添加到购物车” 的按钮文字,首发于蓝月网络

]]>
默认情况下,WooCommerce 网络商店中,当填写了商品价格时,添加到购物车上的文字为“添加到购物车(Add to cart)”, 大多数情况下,这种默认设置都是没问题的,当我们需要个性化我们的网络商店,提现品牌差异化的时候,我们可能需要修改一下添加到购物车按钮上的文字,比如,修改为 “添加到购物袋”。当然,我们可以通过修改模板实现这个需求,只不过略显麻烦。WooCommerce 为我们提供了一个 Filter 来实现这个需求,我们来看一下这个 Filter 的具体实现方法。

下面的示例中,我们修改 WooCommerce 默认的“Add to cart” 为“Add to bag”,WooCommerce 2.1 以后的版本中,Filter 的名称发生了变化,所以,示例代码分为2.1以前的版本和2.1以后的版本,请注意区分。

修改产品详情页面上的“添加到购物车”文字

  1. add_filter( 'add_to_cart_text', 'woo_custom_cart_button_text' ); // < 2.1
  2. function woo_custom_cart_button_text() {
  3.     return __( 'Add to bag', 'woocommerce' );
  4. }
  1. add_filter( 'woocommerce_product_single_add_to_cart_text', 'woo_custom_cart_button_text' ); // 2.1 +
  2. function woo_custom_cart_button_text() {
  3.     return __( 'Add to bag', 'woocommerce' );
  4. }

修改产品存档页面上的“添加到购物车”文字

  1. add_filter( 'add_to_cart_text', 'woo_custom_cart_button_text' ); // < 2.1
  2. function woo_custom_cart_button_text() {
  3.     return __( 'Add to bag', 'woocommerce' );
  4. }
  1. add_filter( 'woocommerce_product_add_to_cart_text', 'woo_archive_custom_cart_button_text' ); // 2.1 +
  2. function woo_archive_custom_cart_button_text() {
  3.     return __( 'Add to bag', 'woocommerce' );
  4. }

根据产品类型修改产品详情页面上的“添加到购物车”文字

  1. add_filter( 'woocommerce_product_add_to_cart_text' , 'custom_woocommerce_product_add_to_cart_text' );
  2. function custom_woocommerce_product_add_to_cart_text() {
  3.   global $product;
  4.  
  5.   $product_type = $product->product_type;
  6.  
  7.   switch ( $product_type ) {
  8.     case 'external':
  9.       return __( 'Buy product', 'woocommerce' );
  10.       break;
  11.     case 'grouped':
  12.        return __( 'View products', 'woocommerce' );
  13.        break;
  14.     case 'simple':
  15.        return __( 'Add to bag', 'woocommerce' );
  16.        break;
  17.     case 'variable':
  18.        return __( 'Select options', 'woocommerce' );
  19.        break;
  20.     default:
  21.       return __( 'Read more', 'woocommerce' );
  22.   }
  23.  
  24. }

以上的方法适合只修改添加到购物车上的文字而不修改其他内容时,如果你的 WooCommerce 商店在标准的 WooCommerce 模板上做了比较大的修改,直接修改模板代码里面的文字也是一种不错的选择。

WooCommerce:修改“添加到购物车” 的按钮文字,首发于蓝月网络

]]>
WooCommerce: 显示每个产品的总销量 https://lanyueer.com/woocommerce-number-of-products-sold/ Sat, 19 Nov 2016 11:51:24 +0000 http://lanyueer.com/?p=794 WooCommerce将每个产品的总销量作为wp_postmeta表里,可以用get_post_meta获取,…

WooCommerce: 显示每个产品的总销量,首发于蓝月网络

]]>
WooCommerce将每个产品的总销量作为wp_postmeta表里,可以用get_post_meta获取,方法如下

在主题的functions.php中加入如下代码

  1. //在shop页面显示总销量
  2. add_action( 'woocommerce_after_shop_loop_item_title', 'wc_product_sold_count', 5 );
  3. //在产品详情页面显示总销量
  4. add_action( 'woocommerce_single_product_summary', 'wc_product_sold_count', 11 );
  5.  
  6. function wc_product_sold_count() {
  7.     global $product;
  8.     $units_sold = get_post_meta( $product->id, 'total_sales', true );
  9.     echo '<p>' . sprintf( __( '已销售: %s', 'woocommerce' ), $units_sold ) . '</p>';
  10. }

修改add_action最后的数字可以调整位置,值越大越靠后。

 

效果如下所示:

在shop页面显示

在产品详情页面显示

WooCommerce只记录了总销量,无法显示月销量。

WooCommerce: 显示每个产品的总销量,首发于蓝月网络

]]>
WooCommerce: 产品加入购物车后直接结账 https://lanyueer.com/woocommerce-direct-checkout/ Sun, 14 Aug 2016 07:27:42 +0000 http://lanyueer.com/?p=652 WooCommerce中,非Ajax情况下,点击加入购物车按钮后跳转到何处可以通过filter:add_to_…

WooCommerce: 产品加入购物车后直接结账,首发于蓝月网络

]]>
WooCommerce中,非Ajax情况下,点击加入购物车按钮后跳转到何处可以通过filter:add_to_cart_redirect修改,下面代码可以实现产品加入购物车后直接结账的功能,跳过购物车页面。

如果你希望Shop首页或分类页中的加入购物车按钮也具备这种效果,不要勾选Enable AJAX add to cart buttons on archives功能。否则该代码只在单个产品页面有效。

代码放在主题的funcitons.php中即可。

  1. add_filter ('add_to_cart_redirect', 'redirect_to_checkout');
  2.  
  3. function redirect_to_checkout() {
  4.     global $woocommerce;
  5.     $checkout_url = $woocommerce->cart->get_checkout_url();
  6.     return $checkout_url;
  7. }

WooCommerce: 产品加入购物车后直接结账,首发于蓝月网络

]]>
WooCommerce不显示Shop页面标题 https://lanyueer.com/hide-shop-page-title/ Mon, 07 Dec 2015 13:36:53 +0000 http://lanyueer.com/?p=488 WooCommerce Shop页面的默认设置是显示标题,例如Shop页面显示Shop,产品分类页面显示类别名…

WooCommerce不显示Shop页面标题,首发于蓝月网络

]]>
WooCommerce Shop页面的默认设置是显示标题,例如Shop页面显示Shop,产品分类页面显示类别名称,可以在functions.php文件中插入以下代码不显示标题。

  1. add_filter( 'woocommerce_page_title', 'woo_shop_page_title');
  2. function woo_shop_page_title( $page_title ) {
  3.     if( 'Shop' == $page_title) {
  4.     return "";
  5.     }
  6. }

也可以在return "";引号中添加自定义标题。

参考资料
My 25 Best WooCommerce Snippets For WordPress No.13

WooCommerce不显示Shop页面标题,首发于蓝月网络

]]>
WooCommerce有用的代码 https://lanyueer.com/woocommerce-useful-code/ Mon, 07 Dec 2015 13:28:05 +0000 http://lanyueer.com/?p=487 本文汇总了WooCommerce代码,使用方法是插入到主题functions.php文件中,建议使用子主题。 …

WooCommerce有用的代码,首发于蓝月网络

]]>
本文汇总了WooCommerce代码,使用方法是插入到主题functions.php文件中,建议使用子主题。
产品页面
删除产品页面Product Description标题

  1. // Remove "Product Description" heading on Single Product page
  2. function remove_product_description_heading() {
  3. return '';
  4. }
  5. add_filter('woocommerce_product_description_heading', 'remove_product_description_heading');

删除产品页面Product Description, Additional Information, Reviews项

  1. // Disable Product Review (tab) on Single Product page
  2. function remove_product_tabs($tabs) {
  3. unset($tabs['description']);                 // Remove Description tab
  4. unset($tabs['additional_information']);      // Remove Additional Information tab
  5. unset($tabs['reviews']);                     // Remove Reviews tab
  6. return $tabs;
  7. }
  8. add_filter( 'woocommerce_product_tabs', 'remove_product_tabs', 98 );

如果需要保留某一项,可以用//注释掉。

WooCommerce有用的代码,首发于蓝月网络

]]>
WooCommerce产品页面删除分类 https://lanyueer.com/remove-category-from-woocommerce-single-product-page/ Mon, 07 Dec 2015 13:12:30 +0000 http://lanyueer.com/?p=486 WooCommerce产品页面默认显示产品分类,本文介绍了如何从产品页面删除产品分类。 方法 在functio…

WooCommerce产品页面删除分类,首发于蓝月网络

]]>
WooCommerce产品页面默认显示产品分类,本文介绍了如何从产品页面删除产品分类。
方法

在functions.php文件中添加代码,建议使用子主题

  1. // Remove Category from Single Product page
  2. remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_meta', 40 );

代码解释
WooCommerce产品页面模版为single-product.php,通过以下语句调用content-single-product.php模版文件

  1. <?php wc_get_template_part( 'content', 'single-product' ); ?>

content-single-product.php模版文件中对挂钩 (Hook) 进行了详细的代码注释

  1. <?php
  2.      /**
  3.       * woocommerce_single_product_summary hook
  4.       *
  5.       * @hooked woocommerce_template_single_title - 5
  6.       * @hooked woocommerce_template_single_rating - 10
  7.       * @hooked woocommerce_template_single_price - 10
  8.       * @hooked woocommerce_template_single_excerpt - 20
  9.       * @hooked woocommerce_template_single_add_to_cart - 30
  10.       * @hooked woocommerce_template_single_meta - 40
  11.       * @hooked woocommerce_template_single_sharing - 50
  12.       */
  13.      do_action( 'woocommerce_single_product_summary' );
  14. ?>

woocommerce_single_meta通过woocommerce_single_product_summary挂钩40调用。

WooCommerce产品页面删除分类,首发于蓝月网络

]]>
Woocommerce的索引页面模板archive-product.php无法被调用问题 https://lanyueer.com/woocommerce-archive-product/ Sat, 28 Nov 2015 09:56:55 +0000 http://lanyueer.com/?p=477 最近在用WordPress+Woocommerce开发一个商城网站,一步一步抽丝剥茧的尝试修改着Woocomm…

Woocommerce的索引页面模板archive-product.php无法被调用问题,首发于蓝月网络

]]>
最近在用WordPress+Woocommerce开发一个商城网站,一步一步抽丝剥茧的尝试修改着Woocommerce提供的默认主题。其实Woocommerce的主题定制逻辑挺简单,把Woocommerce插件中的templates文件夹整个复制到自己的主题中,重命名woocommerce,即可任意修改。购物车、产品内页、帐号管理等页面都能顺利修改。唯独商品索引页面,我在archive-product.php反复尝试修改覆盖源文件,都没效果。

最后谷歌找到答案,解决方法如下:
在第三方主题里面增加woocommerce文件夹,为了使原主题能兼容Woocommerce,一般都会在主题目录下增加一个woocommerce.php
详细方法见这里:http://docs.woothemes.com/document/third-party-custom-theme-compatibility/。
这个粗略方法就是导致archive-product.php没有被正确调用的原因。

只需要找到主题根目录下woocommerce.php中的这一行:

  1. woocommerce_content();

替换成

  1. if ( is_singular( 'product' ) ) {
  2. 	woocommerce_content();
  3. }else{
  4. 	woocommerce_get_template( 'archive-product.php' );
  5. }

即可解决问题。

Woocommerce的索引页面模板archive-product.php无法被调用问题,首发于蓝月网络

]]>
如何让仅注册用户看到Woocommerce产品价格 https://lanyueer.com/only-registered-users-see-woocommerce-price/ Sun, 08 Nov 2015 05:15:43 +0000 http://lanyueer.com/?p=448 add_filter(‘woocommerce_get_price_html’,’members_on…

如何让仅注册用户看到Woocommerce产品价格,首发于蓝月网络

]]>
add_filter(‘woocommerce_get_price_html’,’members_only_price’);
function members_only_price($price){
if(is_user_logged_in() ){
return $price;
}
else return<a href="’ .get_permalink(woocommerce_get_page_id(‘myaccount’)). ‘">登录</a><a href="’.site_url(‘/wp-login.php?action=register&amp;redirect_to=’ . get_permalink()).’">注册</a>查看价格!';
}

把这行代码放进你主题的function.php函数里即可。

如何让仅注册用户看到Woocommerce产品价格,首发于蓝月网络

]]>