Woocommerce添加到购物车链接Ajax在其他帖子或页面中启用

时间:2018-03-03 19:07:08

标签: php ajax wordpress woocommerce shortcode

在Woocommerce中,我想在WordPress网站(非产品页面)的简单页面上创建添加到购物车链接。

所以我尝试了这段代码(其中123是产品ID)

import numpy as np
import cv2 


img= cv2.imread("C:\\Users\Stefan_Cepa\\Desktop\\dataset2\\set\\A6.png")

hsv = cv2.cvtColor(img, cv2.COLOR_BGR2HSV)

lower_range = np.array([30,150,150])
upper_range = np.array([255,255,180])

mask = cv2.inRange(hsv, lower_range, upper_range)
output = cv2.bitwise_and(img, img, mask = mask)
cv2.imshow("images", np.hstack([img, output]))
cv2.imshow('mask', mask)

while(True):
    k = cv2.waitKey(5) & 0xFF
    if k == 27:
        break

cv2.destroyAllWindows()

我已在档案页面上启用了AJAX添加到购物车Woocommerce选项设置。

但它不起作用,并且我的自定义“添加到购物车”链接未启用Ajax功能。

如何在自定义链接上启用ajax add-to-cart(在除了woocommerce之外的其他页面中)

3 个答案:

答案 0 :(得分:5)

要在自定义添加到购物车按钮中启用ajax,至少有3种方式:

  1. 一个简单的HTML Ajax添加到购物车链接:

    <a rel="nofollow" href="/?add-to-cart=37" data-quantity="1" data-product_id="123" data-product_sku="" class="add_to_cart_button ajax_add_to_cart">Add to cart</a>
    
  2. 使用Woocommerce现有[add_to_cart id='123']短代码 (与上述用法相同)
    enter image description here enter image description here

  3. 最可自定义:自定义短代码,不含价格 (可自定义按钮文字,其他课程,数量和许多其他可能性)

    if( ! function_exists('custom_ajax_add_to_cart_button') && class_exists('WooCommerce') ) {
        function custom_ajax_add_to_cart_button( $atts ) {
            // Shortcode attributes
            $atts = shortcode_atts( array(
                'id' => '0', // Product ID
                'qty' => '1', // Product quantity
                'text' => '', // Text of the button
                'class' => '', // Additional classes
            ), $atts, 'ajax_add_to_cart' );
    
            if( esc_attr( $atts['id'] ) == 0 ) return; // Exit when no Product ID
    
            if( get_post_type( esc_attr( $atts['id'] ) ) != 'product' ) return; // Exit if not a Product
    
            $product = wc_get_product( esc_attr( $atts['id'] ) );
    
            if ( ! $product ) return; // Exit when if not a valid Product
    
            $classes = implode( ' ', array_filter( array(
                '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' : '',
            ) ) ).' '.$atts['class'];
    
            $add_to_cart_button = sprintf( '<a rel="nofollow" href="%s" %s %s %s class="%s">%s</a>',
                esc_url( $product->add_to_cart_url() ),
                'data-quantity="' . esc_attr( $atts['qty'] ) .'"',
                'data-product_id="' . esc_attr( $atts['id'] ) .'"',
                'data-product_sku="' . esc_attr( $product->get_sku() ) .'"',
                esc_attr( isset( $classes ) ? $classes : 'button' ),
                esc_html( empty( esc_attr( $atts['text'] ) ) ? $product->add_to_cart_text() : esc_attr( $atts['text'] ) )
            );
    
            return $add_to_cart_button;
        }
        add_shortcode('ajax_add_to_cart', 'custom_ajax_add_to_cart_button');
    }
    

    此代码在您的活动子主题(或主题)的function.php文件中。经过测试并正常工作。

    USAGE:

    在帖子和页面文本编辑器中:

    [ajax_add_to_cart id='123' text='Buy']
    

    在PHP文件或模板中:

    echo do_shortcode( "[ajax_add_to_cart id='123' text='Buy']" );
    

    在php页面上插入HTML代码:

    <?php echo do_shortcode( "[ajax_add_to_cart id='123' text='Buy']" ); ?>
    

    enter image description here enter image description here

      

    隐藏Ajax&#34;查看购物车&#34;

      对于自定义短代码,隐藏Ajax&#34;查看购物车&#34;行为,您可以在 return $add_to_cart_button;之前添加代码:

    $style = '<style>a.added_to_cart.wc-forward { display:none !important; }</style>';
    
    $add_to_cart_button = $style . $add_to_cart_button ;
    

答案 1 :(得分:2)

我建议你使用[add_to_cart]短代码。

使用默认参数最简单:

[add_to_cart id="123" /]

禁用默认样式并隐藏价格:

[add_to_cart id="123" style="" show_price="false" /]

查看一些示例输出 Sample output

答案 2 :(得分:0)

我将此用于我的插件,并且工作正常:

function wsb_add_to_cart_button( ) {
    global $product;

    $classes = implode( ' ',  array(
        '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' : '',
    )  );

    return apply_filters( 'woocommerce_loop_add_to_cart_link',
        sprintf( '<a href="%s" rel="nofollow" data-product_id="%s" data-product_sku="%s" data-quantity="%s" class="button %s product_type_%s">%s</a>',
            esc_url( $product->add_to_cart_url() ),
            esc_attr( $product->get_id() ),
            esc_attr( $product->get_sku() ),
            esc_attr( isset( $quantity ) ? $quantity : 1 ),
            esc_attr( isset( $classes ) ? $classes : 'button' ),
            esc_attr( $product->get_type() ),
            esc_html( $product->add_to_cart_text() )
        ),
    $product );
} 

用于显示按钮:

<?php echo wsb_add_to_cart_button(); ?>