在WooCommerce中，我想在我的自定义添加到卡片按钮上启用Ajax。您可以在我的网站here上查看。任何帮助表示赞赏。
以下是我的代码，它使用短代码从产品类别创建产品链接：
function woo_category_design_caa1( $atts ) {
$category_id = $atts['category'];
if(class_exists('WooCommerce')){
$args = array(
'post_type' => 'product',
'post_status' => 'publish',
'posts_per_page' => -1,
'tax_query' => array(
array(
'taxonomy' => 'product_cat',
'field' => 'term_id', //This is optional, as it defaults to 'term_id'
'terms' => $category_id,
'operator' => 'IN' // Possible values are 'IN', 'NOT IN', 'AND'.
)
)
);
if( $term = get_term_by('id', $category_id, 'product_cat')){
$cat_name = $term->name;
}
$products_list = new WP_Query($args);
if($products_list->have_posts()){
$tableHtml = '';
$tableHtml .= '<div class="menu1">';
$tableHtml .= "<div class='heading-menu' id='a" . $category_id . "'>".$cat_name."</div>";
$tableHtml .= '<ul>';
while($products_list->have_posts()){
$products_list->the_post();
$_product = wc_get_product(get_the_ID());
if($_product->is_type( 'variable' )){
$args = array(
'post_type' => 'product_variation',
'post_status' => array( 'private', 'publish' ),
'numberposts' => -1,
'orderby' => 'menu_order',
'order' => 'asc',
'post_parent' => get_the_ID() // $post->ID
);
$variations = get_posts( $args );
$price ='';
$var_title = '';
$link_1 = '';
foreach($variations as $variation){
$var_title = $var_title . "/" . $variation->post_title;
//$price = $price . "/" . get_post_meta($variation->ID, '_regular_price', true);
$price = $price . '<a class="btn-link-atc" href="/order-online/?add-to-cart='.get_the_ID().'&variation_id='.$variation->ID.'"> ' . $variation->post_title .' ₹ '. get_post_meta($variation->ID, '_regular_price', true) . ' </a>';
}
}else{
$price = '<a class="btn-link-atc" href="/order-online/?add-to-cart='.get_the_ID().'">Add To Cart ₹ '.get_post_meta(get_the_ID(), '_regular_price', true).'</a>';
//$price = get_post_meta(get_the_ID(), '_regular_price', true);
}
$tableHtml .= '<li>
<div class="title">'.get_the_title().'</div><span>'.$price.'</span></li>';
}
$tableHtml .= '</ul>';
$tableHtml .= '</div>';
return $tableHtml;
//return ' ';
}
else {
return "Nothing Found.";
}
}
else {
return "Problem fetching data !";
}
}
add_shortcode('woo_products_from_category_type1', 'woo_category_design_caa1');
答案 0 :(得分：1)
更新...您的代码有很多小错误，我已经完全重新审视它以启用Ajax添加到购物车功能，即使在产品变化上（这不是那么简单）。
我已将您的短代码从[woo_category_design_caa1]重命名为[products_from_cat] ...您的功能名称保持不变。
以下是启用了Ajax添加到购物车的正确功能代码：
if( ! function_exists('woo_category_design_caa1') && class_exists('WooCommerce') ) {
function woo_category_design_caa1( $atts ) {
// Shortcode attributes
$atts = shortcode_atts( array(
'category' => '', // <= Set the default product category ID
), $atts, 'products_from_cat' );
$products = new WP_Query( array(
'post_type' => 'product',
'post_status' => 'publish',
'posts_per_page' => -1,
'tax_query' => array( array(
'taxonomy' => 'product_cat',
'field' => 'term_id',
'terms' => $atts['category'],
'operator' => 'IN',
) )
) );
if($products->have_posts()):
$term_name = get_term( $atts['category'], 'product_cat')->name; // The product category Name
$output = '<div class="menu1">
<div class="heading-menu" id="a' . $atts["category"] . '">'.$term_name.'</div>
<ul>';
while( $products->have_posts() ): $products->the_post();
$product = wc_get_product($products->post->ID); // The WC_Product object (instance)
$type = $product->get_type();
if( $product->is_type( 'variable' ) && $product->is_in_stock() ){
$variations_ids = $product->get_visible_children(); // Get the variations IDs
$class = 'btn-link-atc';
$buttons = array();
foreach( $variations_ids as $variation_id ){
$variation = wc_get_product($variation_id); // The WC_Product_Variation object (instance)
// Get the variation attributes
$variation_attributes = $variation->get_attributes();
$attributes = array();
foreach( $variation_attributes as $taxonomy => $term_slug ){
$attributes[] = get_term_by( 'slug', $term_slug, $taxonomy )->name;
}
$attributes = ' - ' . implode( ' - ', $attributes );
// Get the correct button classes
$class = implode( ' ', array_filter( array(
'btn-link-atc',
'button',
'product_type_' . $variation->get_type(),
$product->is_purchasable() && $variation->is_in_stock() ? 'add_to_cart_button' : '',
$variation->supports( 'ajax_add_to_cart' ) ? 'ajax_add_to_cart' : '',
) ) );
$price = $variation->get_price();
if($variation->is_in_stock()){
$buttons[] = sprintf( '<a rel="nofollow" href="%s" data-quantity="1" data-product_id="%s" data-product_sku="%s" class="%s">%s</a>',
esc_url( $variation->add_to_cart_url() ),
esc_attr( $variation->get_id() ),
esc_attr( empty( $variation->get_sku() ) ? $product->get_sku() : $variation->get_sku() ),
esc_attr( isset( $class ) ? $class : 'btn-link-atc button' ),
esc_html( $variation->add_to_cart_text() ) . $attributes . ' - ' . wc_price($price)
);
}
}
$add_to_cart = implode(' <br />', $buttons);
} elseif( ! $product->is_type( 'variable' ) && $product->is_in_stock() ){
$class = implode( ' ', array_filter( array(
'btn-link-atc',
'button',
'product_type_' . $product->get_type(),
$product->is_purchasable() && $product->is_in_stock() ? 'add_to_cart_button' : '',
$product->supports( 'ajax_add_to_cart' ) ? 'ajax_add_to_cart' : '',
) ) );
$price = $product->get_price();
$add_to_cart = sprintf( '<a rel="nofollow" href="%s" data-quantity="1" data-product_id="%s" data-product_sku="%s" class="%s">%s</a>',
esc_url( $product->add_to_cart_url() ),
esc_attr( $product->get_id() ),
esc_attr( $product->get_sku() ),
esc_attr( isset( $class ) ? $class : 'btn-link-atc button' ),
esc_html( $product->add_to_cart_text() ) . ' - ' . wc_price($price)
);
}
$output .= '<li><div class="title">'.$product->get_title().'</div><span>'.$add_to_cart.'</span></li>';
endwhile;
$output .= '</ul>
</div>';
wp_reset_postdata();
wp_reset_query();
return $output;
else:
return "Nothing Found.";
endif;
}
add_shortcode('products_from_cat', 'woo_category_design_caa1');
}
此代码位于您的活动子主题（或主题）的function.php文件中。 经过测试和工作。
每次将产品添加到购物车时，它都会显示一个＆＃34;查看购物车＆＃34;按钮...您可以使用以下CSS规则隐藏它：
a.added_to_cart.wc-forward {
display:none;
}