Archived topic
Ajax add to cart for custom buttons ob product single pages
3 replies · Started by nik9 on November 24, 2021
Hello, I create this code below to add directly 6 or 12 items to the cart. It's working 100%. But we just noticed, that this buttons not work as the one provided from WooCommerce/GP on product single pages to add to cart. How can I make sure that the custom added button also work the same way that the page does not reloead/refresh after klick the button?
add_action( 'woocommerce_after_add_to_cart_button', 'additional_simple_add_to_cart', 20 );
function additional_simple_add_to_cart() {
global $product;
// Only for simple product type
if( ! $product->is_type('simple') ) return;
// Only for products from category "bier" AND/OR "Cider"
if ( has_term( array('bier', 'cider', 'getraenke'), 'product_cat', $product->get_id() ) ) {
// Open parent layout wrapper
echo '<div class="flex-container-pack-wrapper">';
// Open child left layout wrapper
echo '<div class="flex-container-pack-child left">';
// Only display when more than 6 are available
if( $product->get_stock_quantity() >= 6 ) {
$href = '?add-to-cart=' . esc_attr( $product->get_id() ) . '&quantity=6';
$class = 'single_add_to_cart_button-6 button alt';
$style = 'display: inline-block; margin-top: 12px;';
$button_text = __( "6er Pack", "woocommerce" );
// Output add to cart button
echo '<a rel="no-follow" href="'.$href.'" class="'.$class.'" style="'.$style.'">'.$button_text.'</a>';
}
else {
echo '<a class="single_sold_out_button button alt disabled ">6er Pack<p class="pack_soldout">(Ausverkauft)</p></a>';
}
// Close child left layout wrapper
echo '</div>';
// Open child right layout wrapper
echo '<div class="flex-container-pack-child right">';
// Only display when more than 12 are available
if( $product->get_stock_quantity() >= 12 ) {
$href = '?add-to-cart=' . esc_attr( $product->get_id() ) . '&quantity=12';
$class = 'single_add_to_cart_button-12 button alt';
$style = 'display: inline-block; margin-top: 12px;';
$button_text = __( "12er Pack", "woocommerce" );
// Output add to cart button
echo '<a rel="no-follow" href="'.$href.'" class="'.$class.'" style="'.$style.'">'.$button_text.'</a>';
}
else {
echo '<a class="single_sold_out_button button alt disabled ">12er Pack<p class="pack_soldout">(Ausverkauft)</p></a>';
}
// Close child right layout wrapper
echo '</div>';
// Close parent layout wrapper
echo '</div>';
// Open wrapper shipping info
echo '<div class="container_pack_wrapper_shipping_ino">';
// Output Info text for "bier" or "cider" products
//echo '<p class="shipping_info">Wähle 6, 9-12 oder 24 Biere einer Brauerei aus.</p>';
//echo '<p class="shipping_info_extra">*Spezial Angebote z.B Probierpakete sind von dieser Beschränkung ausgeschlossen.</p>';
// Tsting link to vendor
global $product;
$seller = get_post_field( 'post_author', $product->get_id());
$author = get_user_by( 'id', $seller );
$vendor = dokan()->vendor->get( $seller );
$store_info = dokan_get_store_info( $author->ID );
if ( !empty( $store_info['store_name'] ) ) {
// Output Info text for "bier" or "cider" products
echo '<p class="shipping_info">Wähle 6, 9-12 oder 24 Biere einer Brauerei aus.</p>';
// Output Vendor link
printf( '<i class="fas fa-angle-double-right pack"></i><a class="vendor_pack_info" href="%s">Mehr von %s</a>', $vendor->get_shop_url(), $vendor->get_shop_name() );
// Output shipping Info
echo '<p class="shipping_info_extra">*Spezial Angebote z.B Probierpakete sind von dieser Beschränkung ausgeschlossen. Versand wird je Brauerei berechnet.</p>';
}
// Close wrapper shipping info
echo '</div>';
}
}
Thanks David, But it does not work when I try to follow the input there. This is the button call... I tried to use css ajax class but does not work. Also adding a script does not work. What would be the best to work with GP?
// Output add to cart button
echo '<a rel="no-follow" href="'.$href.'" class="'.$class.'" style="'.$style.'">'.$button_text.'</a>';
Cheers
GP doesn't come into play here. Its a 100% Woocommerce thing. If that method using the ajax class and the required data-attributes doesn't work then i am afraid it will need custom development which is out of our scope.