24个简单实用的Woocommerce提示技巧

24个简单实用的Woocommerce提示技巧

24个简单实用的Woocommerce提示技巧

  如果您想开设一家成功的在线商店,WooCommerce 商店是一个绝佳的平台。WordPress 占据了互联网近 42% 的份额。这是相当大的市场份额,也是这项开源计划的巨大成功。众所周知,WooCommerce 是最受欢迎的WordPress 扩展,可让您将 WordPress 安装转换为电子商务商店。提高客户参与度现在被普遍认为是在线业务成功的最重要因素之一。

  在这篇文章中,我将向您展示24个简单实用的Woocommerce提示技巧,这将节省您的时间和金钱。为了使这项工作正常进行,请将您选择的代码片段添加到子主题的functions.php 文件中,或者更好的是,使用像Code Snippets这样的代码片段管理器。

  推荐:(100%免费)怎么使用Claude 2

如何激活 Woocommerce 目录模式并在单个产品页面添加询价表单?

  下面的这个截图激活目录模式并在单个产品页面上显示产品查询表格

add_filter( 'woocommerce_is_purchasable', '__return_false'); // DISABLING PURCHASE FUNCTIONALITY AND REMOVING ADD TO CART BUTTON FROM NORMAL PRODUCTS

remove_action('woocommerce_single_variation', 'woocommerce_single_variation', 10); // REMOVING PRICE FROM VARIATIONS

remove_action('woocommerce_single_variation', 'woocommerce_single_variation_add_to_cart_button', 20); // REMOVING ADD TO CART BUTTON FROM VARIATIONS

// Add an enquiry form on Woocommerce single product page
add_action( 'woocommerce_single_product_summary', 'single_product_message', 20 );
 
function single_product_message() {
    echo '<p class="woocommerce-message">Send us an enquiry </p>';
	echo do_shortcode(''); // Your contact form shortcode goes here. 
}

添加条件 Woocommerce 产品类别页面消息

  借助此处的代码片段,您可以向所有 Woocommerce 产品类别页面添加消息。

// Custom message on Woocommerce shop page and all category pages
add_action( 'woocommerce_before_main_content', 'shop_message', 20 );
function shop_message() {
echo '<p class="woocommerce-message">Free shipping for all orders</p>'; // Change your message here
}

将消息添加到特定的 Woocommerce 类别页面?

  如果您需要向特定的 Woocommerce 产品类别页面(例如存储类别)添加消息,请改用此代码。

// Message for specific category
add_action( 'woocommerce_before_main_content', 'category_message', 20 );
function category_message() {
 if ( is_product_category( 'storage' ) ) { // Change your vategory slug here
echo '<p class="woocommerce-message">Estimated shipping time: 2-3 weeks</p>'; // Change your message here
}
}

  推荐:7个WooCommerce变体样本插件

将消息添加到特定Woocommerce类别页面,向其他类别添加另一条消息

  现在,让我们向 Sotrage 类别页面添加一条消息,向所有其他类别添加另一条消息。

// One message for specific category (storage) and another for all other categories
add_action( 'woocommerce_before_shop_loop', 'conditional_message', 1 );
function conditional_message() {
if ( is_product_category( 'storage' ) ) { // Change your vategory slug here
echo '<p class="woocommerce-message">Estimated delivery time: 2-3 weeks</p>';// Change your Storage category message here 
} else {
echo '<p class="woocommerce-message">Estimated delivery time: 1 week</p>'; // Change your shop-wide message here
}
}

删除产品档案中的类别产品计数

  正如您可能已经看到的,类别循环在类别名称旁边显示了产品计数。此代码将隐藏产品档案中的 Woocommerce 产品数量。

add_filter( 'woocommerce_subcategory_count_html', '__return_false' );

在Woocommerce销售徽章上显示折扣百分比

  默认情况下,Woocommerce 显示带有“销售”文本的徽章。如果您希望显示折扣百分比,请使用下面的代码。

add_action( 'woocommerce_sale_flash', 'sale_badge_percentage', 25 );
 
function sale_badge_percentage() {
   global $product;
   if ( ! $product->is_on_sale() ) return;
   if ( $product->is_type( 'simple' ) ) {
      $max_percentage = ( ( $product->get_regular_price() - $product->get_sale_price() ) / $product->get_regular_price() ) * 100;
   } elseif ( $product->is_type( 'variable' ) ) {
      $max_percentage = 0;
      foreach ( $product->get_children() as $child_id ) {
         $variation = wc_get_product( $child_id );
         $price = $variation->get_regular_price();
         $sale = $variation->get_sale_price();
         if ( $price != 0 && ! empty( $sale ) ) $percentage = ( $price - $sale ) / $price * 100;
         if ( $percentage > $max_percentage ) {
            $max_percentage = $percentage;
         }
      }
   }
   if ( $max_percentage > 0 ) echo "<span class='onsale'>-" . round($max_percentage) . "%</span>"; // If you would like to show -40% off then add text after % sign
}

如何为30天以内的Woocommerce最近产品显示“新”徽章

第 1 步:在下面添加代码片段

// New badge for recent products
add_action( 'woocommerce_before_shop_loop_item_title', 'new_badge', 3 );
          
function new_badge() {
   global $product;
   $newness_days = 30; // Number of days the badge is shown
   $created = strtotime( $product->get_date_created() );
   if ( ( time() - ( 60 * 60 * 24 * $newness_days ) ) < $created ) {
      echo '<span class="new-badge onsale">' . esc_html__( 'NEW', 'woocommerce' ) . '</span>';
   }
}

第 2 步:自定义您的徽章

  请注意,下面显示的 CSS 可能需要调整,这取决于您的主题。因此,请相应地调整它。

// “NEW” Badge for Woocommerce Recent Products that are less than 30 days old
.woocommerce ul.products li.product .new-badge.onsale {
	background: #ffcc00;
	top: 50px;
	z-index: 10;
	left: 0px;
	color: #000;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 0.9em;
	border-radius: 0px;
	min-width: 60px;
	padding-left: 19px !important;
}
span.new-badge.onsale:after {
	border: 5px solid #ffcc00;
border-color: transparent transparent #ffcc00 #ffcc00;
	border-width: 9px 6px;
	position: absolute;
	right: -10px;
	bottom: 0;
	content: '';
}
span.new-badge.onsale:before {
border: 5px solid #ffcc00;
    border-color: #ffcc00 transparent transparent #ffcc00;
    border-width: 9px 6px;
    position: absolute;
    right: -10px;
    top: 0;
    content: '';
}

  如果您想将其显示为垂直丝带,请添加这段 CSS。

span.new-badge.onsale {
min-width: 60px;
-moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

  推荐:YITH WooCommerce Badge Management Premium徽章管理插件

通过选中复选框来显示自定义产品徽章

  接下来,让我们在单个产品编辑页面添加一个复选框。如果您选中此选项,则标题下方的单个产品页面上会显示“免运费”文本。请参阅下面的这些屏幕截图,您将看到它如何为我们将在下一章中创建的徽章显示它。

  如果您想更改徽章中显示的文本,只需在第 34 行中修改它。另外,相应地更改第 7 行和第 9 行中的文本。现在,让我们通过选中复选框来显示自定义产品徽章。

// Step 1: Add checkbox 

add_action( 'woocommerce_product_options_general_product_data', 'checkbox_badge' );        
  
function checkbox_badge() {           
woocommerce_wp_checkbox( array( 
'id' => 'checkbox_badge', 
'class' => '', 
'label' => 'Display free shipping badge'
) 
);      
}

// Step 2: Save checkbox selection
  
add_action( 'save_post', 'save_checkbox_badge_selection' );
  
function save_checkbox_badge_selection( $product_id ) {
    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE )
        return;
    if ( isset( $_POST['checkbox_badge'] ) ) {
            update_post_meta( $product_id, 'checkbox_badge', $_POST['checkbox_badge'] );
    } else delete_post_meta( $product_id, 'checkbox_badge' );
}

// Step 3: Display custom badge at single product page
  
add_action( 'woocommerce_single_product_summary', 'display_checkbox_badge', 7 );
  
function display_checkbox_badge() {
    global $product;     
    if ( get_post_meta( $product->get_id(), 'checkbox_badge', true ) ) {
        echo '
<div class="custom-badge-1">Free shipping</div>'; // Change this text if needed
    }
}

  产品徽章的自定义 CSS。

/* Display custom product badges with checking a checkbox */
.custom-badge-1 {
  font-size: 13px;
	color: #fff;
	font-weight: 600;
	background: #E54C60;
	border: 2px solid #E54C60;
	text-align: center;
	padding: 7px;
	display: inline;
}
.entry-summary .price {
	margin-top: 1em;
}

在Woocommerce存档页面上显示Woocommerce库存数量和库存状态?

  有时需要在 Woocommerce arhcive 页面上显示 Woocommerce 库存数量和库存状态。因此,这个片段将为您提供帮助。

  它将显示 Woocommerce 库存数量和库存状态,如下所示:

  • 库存 25 件
  • 缺货
  • 有存货
  • 缺货时可用
  • 对于可变产品,它可能是“有库存(某些商品)”
//* Enqueue scripts
add_action( 'wp_enqueue_scripts', 'wpsh_stock_status_archive', 11 );
function wpsh_stock_status_archive() {

	// Activate clip styles
	wp_enqueue_style(  'wpsh-stock-status-archive-style', 
						plugins_url( 'clip-style.css', __FILE__ ), array(),
						'1.0.0' 
	);
}

//* Add stock status to archive pages
add_action( 'woocommerce_after_shop_loop_item', 'wpsh_add_stock_status_archive', 3 );
function wpsh_add_stock_status_archive() {

    global $product;
	$availability = $append = null;

	// Add status for single products
	if( $product->is_type( 'simple' ) ) {

		$availability = $product->get_availability();
		$class = $availability[ 'class' ];
		$output = $availability[ 'availability' ];
	}

	// Add status for variable products
	elseif( $product->is_type( 'variable' ) ) {

		$status = array();

		// Get status class for each variation
		foreach ( $product->get_children() as $child_id ) {
			
				$variation = $product->get_child( $child_id );
				$availability = $variation->get_availability();
				
				// Abandon if stock management is disabled on any variation
				if( ! array_filter( $availability ) )
					return;

				$status[] = $availability[ 'class' ];
		}

		/**
		 * Compile final output and class based on
		 * availability classes set by WooCommerce
		 */
		if( in_array( 'in-stock', $status ) ) {
			$output = __( 'In stock', 'wp-clips' );
			$class = 'in-stock';
		}
		elseif( in_array( 'available-on-backorder', $status ) ) {
			$output = __( 'Available on backorder', 'wp-clips' );
			$class = 'available-on-backorder';
		}
		elseif( in_array( 'out-of-stock', $status ) ) {
			$output = __( 'Out of stock', 'wp-clips' );
			$class = 'out-of-stock';
		}

		// Append output if some items out of stock or available on backorder
		if( ( in_array( 'available-on-backorder', $status ) && $class == 'in-stock' ) ||
			( in_array( 'out-of-stock', $status ) && $class != 'out-of-stock' ) )
			$append = ' ' . __( '(some items)', 'wp-clips' );
	}

	// Output only if set 
	if( isset( $availability ) ){
		echo '<span class="archive-stock ' . esc_attr( $class ) . '">' . esc_html( $output ) . esc_html( $append ) . '</span>';	
	}
}

  与其他片段一样,您可以使用这段 CSS 对其进行自定义。

/* Display Woocommerce stock amount and stock status on Woocommerce archive pages */
.archive-stock  {
	font-size: 13px;
	margin: 5px 0px 10px 0px;
}

产品缺货时更改Woocommerce添加到购物车按钮文本

  有些人对延期交货和不同的 Woocommerce 库存状态感到困惑。这会导致问题,客户没有意识到该产品有缺货(这意味着缺货),并且在知道它将很快发货的情况下订购了该产品。

  因此,您可能只想更改缺货产品的 Woocommerce“添加到购物车”按钮文本。现在,如果将其与自定义字段(如上所示)结合起来,那么最终结果将如下所示:

  看起来不错,不是吗?因此,请使用此代码片段。

// changes Woocommerce Single product page add to cart button only text if product is in backorder
add_filter( 'woocommerce_product_single_add_to_cart_text', 'wc_ninja_change_backorder_button', 10, 2 );
function wc_ninja_change_backorder_button( $text, $product ){
	if ( $product->is_on_backorder( 1 ) ) {
		$text = __( 'Pre-order', 'woocommerce' );
	}
	return $text;
}

// changes Woocommerce category page add to cart button only text if product is in backorder
add_filter( 'woocommerce_product_add_to_cart_text', 'wc_ninja_change_backorder_button1', 10, 2 );
function wc_ninja_change_backorder_button1( $text, $product ){
    if ( $product->is_on_backorder( 1 ) ) {
        $text = __( 'Pre-order', 'woocommerce' );
    }
    return $text;
  }

如何创建和显示自定义产品字段?

  首先,我们创建一个新的 Woocommerce 单一产品自定义字段,并将其输出到所需的位置。最终结果将类似于下面的屏幕截图。

  因此,只需获取此代码并相应地使用它即可。

// Add custom field to Woocommerce backend under General tab
add_action( 'woocommerce_product_options_general_product_data', 'wpsh_add_text_field' );
function wpsh_add_text_field() {
    woocommerce_wp_text_input( array(
        'id'            => '_shipping_time',
        'label'         => __( 'Shipping info', 'woocommerce' ),
        'description'   => __( 'This is a custom field, you can write here anything you want.', 'woocommerce' ),
        'desc_tip'      => 'true',
        'type'          => 'text'
    ) );
}


// Save custom field values
add_action( 'woocommerce_admin_process_product_object', 'wpsh_save_field', 10, 1 );
function wpsh_save_field( $product ) {
    if ( isset( $_POST['_shipping_time'] ) ) {        
        $product->update_meta_data( '_shipping_time', sanitize_text_field( $_POST['_shipping_time'] ) );
    }
}

// Display this custom field on Woocommerce single product pages
add_action( 'woocommerce_product_meta_end', 'wpsh_display_on_single_product_page', 10 );
function wpsh_display_on_single_product_page() {
    global $product;
    
    // Is a WC product
    if ( is_a( $product, 'WC_Product' ) ) {
        // Get meta
        $text = $product->get_meta( '_shipping_time' );
        // NOT empty
        if ( ! empty ( $text ) ) {
            echo '<div class="woocommerce-message">Estimated shipping time: ' . $text . '</div>';
        }
    }
}
// Display this custom field on Woocommerce archive pages
add_action( 'woocommerce_after_shop_loop_item', 'wpsh_display_on_archive_page', 10 );
function wpsh_display_on_archive_page() {
    global $product;
    // Is a WC product
    if ( is_a( $product, 'WC_Product' ) ) {
        // Get meta
        $text = $product->get_meta( '_shipping_time' );
        // NOT empty
        if ( ! empty ( $text ) ) {
            echo '<div class="custom-text">Estimated shipping time: ' . $text . '</div>';
        }
    }
}

  推荐:[最新版]Advanced Custom Fields Pro插件下载WordPress自定义字段插件

如何创建自定义选项卡?

  下面的这段代码创建了新的自定义 Woocommerce 单一产品选项卡,其中包含文本和联系表单。只需根据需要替换内容即可。

add_filter( 'woocommerce_product_tabs', 'custom_tab' );
function custom_tab( $tabs ) {	
	// Adds the new tab
	$tabs['form'] = array(
		'title' 	=> __( 'Send us an enquiry', 'woocommerce' ),
		'priority' 	=> 30,
		'callback' 	=> 'custom_tab_content'
	);
	return $tabs;
}
function custom_tab_content() {

	// The new tab content

	echo '<h4>Send us an enquiry</h4>';
	echo '<p>Lorem ipsum dolor sit amet consectetur adipiscing elit ultricies convallis volutpat, placerat proin scelerisque eget velit tellus at nibh risus. </p>';
	echo do_shortcode( '' );
}

如何显示“您已保存”促销价?

  看看下面的屏幕截图。这就是这些片段为您做的事情。

  因此,为了使其像这样工作,请使用此代码片段。请注意,下面的这个仅适用于简单的产品。对于可变产品,请查看下一个片段。

function you_save_text_for_product() {
	global $product;

	// works for Simple and Variable type
	$regular_price 	= get_post_meta( $product->get_id(), '_regular_price', true ); // 36.32
	$sale_price 	= get_post_meta( $product->get_id(), '_sale_price', true ); // 24.99
		
	if( !empty($sale_price) ) {
	
		$saved_amount 		= $regular_price - $sale_price;
		$currency_symbol 	= get_woocommerce_currency_symbol();

		$percentage = round( ( ( $regular_price - $sale_price ) / $regular_price ) * 100 );
		?>
			<p class="you_save_price">You save: <?php echo $currency_symbol .''. number_format($saved_amount, 2, '.', ''); ?></p>				
		<?php		
	} 
		
}
add_action( 'woocommerce_single_product_summary', 'you_save_text_for_product', 12 ); // hook priority

  如果您想自定义它的外观,请查看 you_save_price CCS 类。现在转到定制器 >> 其他 CSS 并添加这一小块 CSS 来对其进行定制。

.you_save_price {
	background: #f9f9f9;
	padding: 10px;
	border: 1px dashed #ddd;
	width: 150px;
	font-size: 14px;
	font-weight: 600;
	margin-top: 10px;
}

  现在,上面的代码仅显示简单产品的节省金额。如果您还想针对可变产品显示它,请添加这段代码。

// For product variations (on variable products)
add_filter( 'woocommerce_available_variation', 'variable_product_saving_amount', 10, 3 );
function variable_product_saving_amount( $data, $product, $variation ) {

    if( $variation->is_on_sale() ) {
        $saved_amount  = $data['display_regular_price'] - $data['display_price'];
        $percentage    = round( $saved_amount / $data['display_regular_price'] * 100 );

        $data['price_html'] .= '<p id="you_save_price">'. __("You Save") .': ' . wc_price($saved_amount) . ' ('.$percentage.'%)</p>';
    }
    return $data;
}

隐藏缺货产品的 Woocommerce 产品价格?

  下面的这段代码隐藏了缺货产品的 Woocommerce 产品价格

add_filter( 'woocommerce_get_price_html', 'wpsh_hide_price', 9999, 2 );
 
function wpsh_hide_price( $price, $product ) {
   if ( is_admin() ) return $price; // BAIL IF BACKEND
   if ( ! $product->is_in_stock() ) {
      $price = apply_filters( 'woocommerce_empty_price_html', '', $product );
   }
   return $price;
}

仅在 Woocommerce 产品缺货时显示联系表单?

  代码片段插件是一个免费插件,允许您在网站上运行 PHP/HTML/CSS/JavaScript 代码片段,而无需修改functions.php。该插件可以在这里找到。另一种选择是将代码粘贴到子主题的functions.php 文件中。

/* Show contact form instead of "Out Of Stock" message */

add_action('woocommerce_single_product_summary', 'out_of_stock_show_form', 20);
function out_of_stock_show_form() {
    global $product;
    if(!$product->is_in_stock( )) {
        echo  '<div class="your-form">';
        echo  'Unfortunately this product is out of stock.<br>Contact us for more information';
        echo  do_shortcode('[your-shortcode]'); // Replace with your own contact form shortcode
        echo  '</div>';
    }
}
 
/* This will show your contact form when the variation is out of stock */

add_filter( 'woocommerce_available_variation', 'variation_out_of_stock_show_form', 10, 3 );
function variation_out_of_stock_show_form( $data, $product, $variation ) {
    if( ! $data['is_in_stock'] )
    {
        $data['availability_html'] = '<div class="your-form">';
        $data['availability_html'] .= 'Unfortunately this product is out of stock.<br>Contact us for more information';
        $data['availability_html'] .= do_shortcode('[your-shortcode]'); // Replace with your own contact form shortcode
        $data['availability_html'] .= '</div>';
    }
    return $data;
}

  请注意包含 [your-shortcode] 的行。您应该在此处添加自己的联系表单短代码。

  推荐:Contact Form 7插件教程WordPress设置Contact Form表单插件

禁用(灰显)缺货变体选择?

  对于您的客户来说,仅选择可用的变体要容易得多。因此,我将向您展示如何禁用/灰显)缺货产品变体的选择。

add_filter( 'woocommerce_variation_is_active', 'disable_variations_out_of_stock', 10, 2 );
 
function disable_variations_out_of_stock( $is_active, $variation ) {
    if ( ! $variation->is_in_stock() ) return false;
    return $is_active;
}

向 WooCommerce 中的产品添加自定义库存状态?

  Woocommerce 的默认库存状态为“有货”、“缺货”和“缺货”。如果您想向 WooCommerce 中的产品添加自定义库存状态,请使用下面的代码片段。

  下面的这段代码向 Woocommerce 添加了四种额外的库存状态。

  • 预购
  • 14天内有货
  • 21天内到期库存
  • 31 天内到期库存

这就是最终结果。

  请注意,为了添加或删除自定义库存状态,您需要相应地删除一些行。请观看上面的视频,了解如何执行此操作(请参阅从 2:10 开始的视频)。

// Add custom stock status to products in WooCommerce
function filter_woocommerce_product_stock_status_options( $status ) {
    // Add new statuses
    $status['pre_order'] = __( 'Pre order', 'woocommerce' );
    $status['due_in_14'] = __( 'Due in stock in 14 days', 'woocommerce' );
  	$status['due_in_21'] = __( 'Due in stock in 21 days', 'woocommerce' );
    $status['due_in_31'] = __( 'Due in stock in 31 days', 'woocommerce' );
    return $status;
}
add_filter( 'woocommerce_product_stock_status_options', 'filter_woocommerce_product_stock_status_options', 10, 1 );

// Availability text
function filter_woocommerce_get_availability_text( $availability, $product ) {
    // Get stock status
    switch( $product->get_stock_status() ) {
        case 'pre_order':
            $availability = __( 'Pre order', 'woocommerce' );
        break;
        case 'due_in_14':
            $availability = __( 'Due in stock in 14 days', 'woocommerce' );
        break;
		case 'due_in_21':
            $availability = __( 'Due in stock in 21 days', 'woocommerce' );
        break;
		case 'due_in_31':
            $availability = __( 'Due in stock in 31 days', 'woocommerce' );
        break;
    }

    return $availability; 
}
add_filter( 'woocommerce_get_availability_text', 'filter_woocommerce_get_availability_text', 10, 2 );

// Availability CSS class
function filter_woocommerce_get_availability_class( $class, $product ) {
    // Get stock status
    switch( $product->get_stock_status() ) {
        case 'pre_order':
            $class = 'pre-order';
        break;
        case 'due_in_14':
            $class = 'due-in-14';
        break;
		case 'due_in_21':
            $class = 'due-in-21';
        break;
		case 'due_in_31':
            $class = 'due-in-31';
        break;
    }

    return $class;
}
add_filter( 'woocommerce_get_availability_class', 'filter_woocommerce_get_availability_class', 10, 2 );

// Admin stock html
function filter_woocommerce_admin_stock_html( $stock_html, $product ) {
    // Simple
    if ( $product->is_type( 'simple' ) ) {
        // Get stock status
        $product_stock_status = $product->get_stock_status();
    // Variable
    } elseif ( $product->is_type( 'variable' ) ) {
        foreach( $product->get_visible_children() as $variation_id ) {
            // Get product
            $variation = wc_get_product( $variation_id );
            
            // Get stock status
            $product_stock_status = $variation->get_stock_status();
            
            /*
            Currently the status of the last variant in the loop will be displayed.
            
            So from here you need to add your own logic, depending on what you expect from your custom stock status.
            
            By default, for the existing statuses. The status displayed on the admin products list table for variable products is determined as:
            
            - Product should be in stock if a child is in stock.
            - Product should be out of stock if all children are out of stock.
            - Product should be on backorder if all children are on backorder.
            - Product should be on backorder if at least one child is on backorder and the rest are out of stock.
            */
        }
    }
    
    // Stock status
    switch( $product_stock_status ) {
        case 'pre_order':
            $stock_html = '<mark class="pre-order" style="background:transparent none;color:#33ccff;font-weight:700;line-height:1;">' . __( 'Pre order', 'woocommerce' ) . '</mark>';
        break;
        case 'due_in_14':
            $stock_html = '<mark class="due-in-14" style="background:transparent none;color:#666;font-weight:700;line-height:1;">' . __( 'Due in stock in 14 days', 'woocommerce' ) . '</mark>';
        break;
		case 'due_in_21':
            $stock_html = '<mark class="due-in-21" style="background:transparent none;color:#2a2a2a;font-weight:700;line-height:1;">' . __( 'Due in stock in 21 days', 'woocommerce' ) . '</mark>';
        break;
		case 'due_in_31':
            $stock_html = '<mark class="due-in-31" style="background:transparent none;color:#2a2a2a;font-weight:700;line-height:1;">' . __( 'Due in stock in 31 days', 'woocommerce' ) . '</mark>';
        break;
    }
 
    return $stock_html;
}
add_filter( 'woocommerce_admin_stock_html', 'filter_woocommerce_admin_stock_html', 10, 2 );

删除 Woocommerce 评论选项卡?

add_filter( 'woocommerce_product_tabs', 'remove_review_tab', 98 );
function remove_review_tab( $tabs ) {
    unset( $tabs['reviews'] ); // Remove the reviews tab
    return $tabs;
}

  推荐:YITH WooCommerce Tab Manager Premium插件WordPress WooCommerce选项卡插件

为 Woocommerce 创建自定义订单状态?

  现在让我们看看如何为 Woocommerce 创建自定义订单状态。借助此代码片段,我将创建一个名为“进行中”的自定义状态,该状态显示在后端和前端订单页面上。

// Add custom Woocommerce order status
function register_in_progress_order_status() {
    register_post_status( 'wc-invoiced', array(
            'label' => _x( 'In-progress', 'Order Status', 'woocommerce' ),
            'public' => true,
            'exclude_from_search' => false,
            'show_in_all_admin_list' => true,
            'show_in_admin_status_list' => true,
            'label_count' => _n_noop( 'In-progress <span class="count">(%s)</span>', 'In-progress <span class="count">(%s)</span>', 'woocommerce' )
        )
    );
}

add_action( 'init', 'register_in_progress_order_status' );

function my_invoiced_order_status( $order_statuses ){
    $order_statuses['wc-invoiced'] = _x( 'In-progress', 'Order Status', 'woocommerce' );
    return $order_statuses;

}
add_filter( 'wc_order_statuses', 'my_invoiced_order_status' );

function show_in_bulk_actions() {
    global $post_type;

    if( 'shop_order' == $post_type ) {
        ?>
            <script type="text/javascript">
                jQuery(document).ready(function(){
                    jQuery('<option>').val('mark_invoiced').text('<?php _e( 'Change Status to In-progress','woocommerce' ); ?>').appendTo("select[name='action']");
                    jQuery('<option>').val('mark_invoiced').text('<?php _e( 'Change Status to In-progress','woocommerce' ); ?>').appendTo("select[name='action2']");
                });
            </script>
        <?php
    }
}
add_action( 'admin_footer', 'show_in_bulk_actions' );

在 Woocommerce 订单表中显示客户电话和电子邮件?

  看一下下面的屏幕截图,您会看到 Woocommerce 订单表中显示了客户电话和电子邮件。如果您想获得相同的结果,请使用下面的代码片段。

// Display customer phone and email in Woocommerce orders table
add_action( 'manage_shop_order_posts_custom_column' , 'wpsh_phone_and_email_column', 50, 2 );
function wpsh_phone_and_email_column( $column, $post_id ) {
    if ( $column == 'order_number' )
    {
        global $the_order;
 // Display customer phone in Woocommerce orders table
        if( $phone = $the_order->get_billing_phone() ){
            $phone_wp_dashicon = '<span class="dashicons dashicons-phone"></span> ';
            echo '<br><a href="tel:'.$phone.'">' . $phone_wp_dashicon . $phone.'</a></strong>';
        }
	 // Display customer email in Woocommerce orders table
	          if( $email = $the_order->get_billing_email() ){
            echo '<br><strong><a href="mailto:'.$email.'">' . $email . '</a></strong>';
        }
    }
}

自动完成 Woocommerce 处理订单?

  为什么您需要自动完成 Woocommerce 处理订单?例如,如果您正在销售虚拟产品(课程等),并且您希望在付款后立即添加对其的访问权限。

// Autocomplete Woocommerce processing orders

add_filter( 'woocommerce_payment_complete_order_status', 'processing_orders_autocomplete', 9999 );
function processing_orders_autocomplete() {
   return 'completed';
}

自动完成所有 Woocommerce 订单?

  但是(只是“但是”)如果您想自动完成所有 Woocommerce 订单怎么办?那是埃文搁置命令吗?如果是这种情况,请使用下面的奶嘴。

// Auto Complete all WooCommerce orders.

add_action( 'woocommerce_thankyou', 'wpsh_complete_all_orders' );
function wpsh_complete_all_orders( $order_id ) { 
    if ( ! $order_id ) {
        return;
    }
    $order = wc_get_order( $order_id );
    $order->update_status( 'completed' );
}

将“购买的产品”选项卡添加到 Woocommerce 我的帐户页面?

  现在,让我们将“购买的产品”选项卡添加到 Woocommerce 我的帐户页面(参见上面的屏幕截图)。此选项卡在单独的选项卡中显示您最近购买的产品。

// Add Purchased products tab to Woocommerce my account page

// here we hook the My Account menu links and add our custom one
add_filter( 'woocommerce_account_menu_items', 'wpsh_purchased_products', 40 );
function wpsh_purchased_products( $menu_links ){

// Set 5 in this line to something else if you would like to move the position of the tab
	return array_slice( $menu_links, 0, 5, true )
	+ array( 'purchased-products' => 'Purchased Products' )
	+ array_slice( $menu_links, 2, NULL, true );

}

add_action( 'init', 'wpsh_purchased_products_endpoint' );
function wpsh_purchased_products_endpoint() {
	add_rewrite_endpoint( 'purchased-products', EP_PAGES );
}

// Add purchased porducts as a tab content
add_action( 'woocommerce_account_purchased-products_endpoint', 'wpsh_purchased_products_content' );
function wpsh_purchased_products_content() {

	global $wpdb;

	// Purchased products are sorted by date
	$purchased_products_ids = $wpdb->get_col( 
		$wpdb->prepare(
			"
			SELECT      itemmeta.meta_value
			FROM        " . $wpdb->prefix . "woocommerce_order_itemmeta itemmeta
			INNER JOIN  " . $wpdb->prefix . "woocommerce_order_items items
			            ON itemmeta.order_item_id = items.order_item_id
			INNER JOIN  $wpdb->posts orders
			            ON orders.ID = items.order_id
			INNER JOIN  $wpdb->postmeta ordermeta
			            ON orders.ID = ordermeta.post_id
			WHERE       itemmeta.meta_key = '_product_id'
			            AND ordermeta.meta_key = '_customer_user'
			            AND ordermeta.meta_value = %s
			ORDER BY    orders.post_date DESC
			",
			get_current_user_id()
		)
	);

	// Don’t display duplicate products
	$purchased_products_ids = array_unique( $purchased_products_ids );
	if( ! empty( $purchased_products_ids ) ) {
	  
	 echo '<div class="woocommerce-message">Purchased products</div>';
	  
		$purchased_products = new WP_Query( array(
			'post_type' => 'product',
			'post_status' => 'publish',
			'post__in' => $purchased_products_ids,
			'orderby' => 'post__in',
			'posts_per_page' => -1,
		) );
	
		woocommerce_product_loop_start();

		while ( $purchased_products->have_posts() ) : $purchased_products->the_post();

			wc_get_template_part( 'content', 'product' );

		endwhile;

		woocommerce_product_loop_end();

		woocommerce_reset_loop();
		wp_reset_postdata();

	} else {
	  // Change this text if needed)
		echo 'Unfortunately you have no purchases yet';
	}
}

  推荐:[最新版]WP Rocket插件下载WordPress缓存插件

将“再次订购”按钮添加到 Woocommerce 我的帐户页面?

  如上所述,我们将在 Woocommerce 我的帐户页面添加“再次订购”按钮。使用下面的代码片段。

// Add "Order again" button to Woocommerce my account page
add_filter( 'woocommerce_my_account_my_orders_actions', 'wpsh_order_again_button', 9999, 2 );
    
function wpsh_order_again_button( $actions, $order ) {
    if ( $order->has_status( 'completed' ) ) {
        $actions['order-again'] = array(
            'url' => wp_nonce_url( add_query_arg( 'order_again', $order->get_id(), wc_get_cart_url() ), 'woocommerce-order_again' ),
            'name' => __( 'Order again', 'woocommerce' ),
        );
    }
    return $actions;
}

将“取消”按钮添加到 Woocommerce 我的帐户页面

  看看这里的截图。如您所见,有两个自定义按钮(“取消”和“再次订购”按钮)。因此,如果您想将“取消”按钮添加到 Woocommerce 我的帐户页面,请使用下面的代码片段。

// Add "Cancel" button to Woocommerce my account page

add_filter( 'woocommerce_valid_order_statuses_for_cancel', 'wpsh_add_cancel_button', 20, 2 );
function wpsh_add_cancel_button( $statuses, $order = '' ){

    // Set HERE the order statuses where you want the cancel button to appear
    $custom_statuses    = array( 'pending', 'processing', 'on-hold', 'failed' );

    // Set HERE the delay (in days)
    $duration = 3; // 3 days

    // UPDATE: Get the order ID and the WC_Order object
    if( ! is_object( $order ) && isset($_GET['order_id']) )
        $order = wc_get_order( absint( $_GET['order_id'] ) );

    $delay = $duration*24*60*60; // (duration in seconds)
    $date_created_time  = strtotime($order->get_date_created()); // Creation date time stamp
    $date_modified_time = strtotime($order->get_date_modified()); // Modified date time stamp
    $now = strtotime("now"); // Now  time stamp

    // Using Creation date time stamp
    if ( ( $date_created_time + $delay ) >= $now ) return $custom_statuses;
    else return $statuses;
}

添加 Woocommerce 产品 ID 列

  接下来,让我们进一步自定义 Woocommerce 管理仪表板。有时您可能需要直观地查看 Woocommerce 产品 ID 列。这段代码将为您提供帮助。

// Add Woocommerce produc ID column

function woo_product_extra_columns($columns)
{
	$newcolumns = array(
		"cb"       		=> "<input type  = \"checkbox\" />",
		"product_ID"    => esc_html__('ID', 'woocommerce'),
	);
	$columns = array_merge($newcolumns, $columns);
	
	return $columns;
}
add_filter("manage_edit-product_columns", "woo_product_extra_columns");

function woo_product_extra_columns_content($column)
{
	global $post;
	
	$product_id = $post->ID;
	switch ($column)
	{
		case "product_ID":
			echo $product_id;
		break;		
	}
}
add_action("manage_posts_custom_column",  "woo_product_extra_columns_content");

// Adjust column size
add_action('admin_head', 'my_column_width');
function my_column_width() {
    echo '<style type="text/css">';
    echo '.column-product_ID { width:40px; }';
    echo '</style>';
}

  推荐:如何减少DNS查找来加速WordPress网站

总结

  以上是晓得博客为你介绍的24个简单实用的Woocommerce提示技巧的全部内容,希望它对您在自己的WordPress建站和电子商务网站上工作时有所帮助。如有问题可联系我们。

  推荐:WP Staging Pro插件教程WordPress备份复制迁移插件

  推荐:Woocommerce建站


晓得博客,版权所有丨如未注明,均为原创
晓得博客 » 24个简单实用的Woocommerce提示技巧

转载请保留链接:https://www.pythonthree.com/simple-woocommerce-hacks/

滚动至顶部