1 Answer

Add shop page quantity field woocommerce [duplicate]

45 Views
  • 21
Votes
name franklin

A PHP Error was encountered

Severity: Notice

Message: Undefined index: userid

Filename: views/question.php

Line Number: 191

Backtrace:

File: /var/www/html/cnasolution/site/application/views/question.php
Line: 191
Function: _error_handler

File: /var/www/html/cnasolution/site/application/controllers/Questions.php
Line: 419
Function: view

File: /var/www/html/cnasolution/site/index.php
Line: 315
Function: require_once

Asked: Jul 15,2020 In: php
1 Answer
name franklin Punditsdkoslkdosdkoskdo
Asked: Jul 15,2020 In: php

Add shop page quantity field woocommerce [duplicate]

I am new to Woocommerce. I was trying to show the quantity box in the shop page. I have used the below code and it's working as expected: 

add_action( 'woocommerce_before_shop_loop', 'handsome_bearded_guy_select_variations' );  function handsome_bearded_guy_select_variations() { remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 ); add_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_single_add_to_cart', 30 ); }

But the problem is that ajax add to cart button got replaced with default one.

How can I enable back the ajax functionality on add to cart button with quantity field for Woocommerce archives pages?

To solve this problem, we have implemented measures to analyze the source code and how to write the source code. Thereby we have found the optimal solution to this problem. Maybe this answer is not suitable for you, but it will be a solution for you to solve your problem. To download and see the most accurate answer, please click the link below to see more. secretion.

Read More

Download script demo [LINK] [Origin]
Download script demo [LINK 2] [Onedrive] Download script demo [LINK 2] [Google drive]
php jquery ajax wordpress woocommerce
name
  • 18
Hans
Hans Added an answer on Jul 15,2020

Updated on May 2020

For WooCommerce versions from 3.2 to 4+, Optimized jQuery code and Removed a quantity bug.

The following custom function is hooked in woocommerce_loop_add_to_cart_link filter hook and adds a quantity input field to each product on WooCommerce archives pages and other product loops. We use here mostly the original WooCommerce code.

A bit of jQuery code is necessary to update the data-quantity attribute on the add to cart button when customer changes the quantity. Some styling might be needed, depending on your client wishes (and on your theme).

An additional section to hide the "View cart" button is located at the end.

The code:

add_filter( 'woocommerce_loop_add_to_cart_link', 'quantity_inputs_for_loop_ajax_add_to_cart', 10, 2 ); function quantity_inputs_for_loop_ajax_add_to_cart( $html, $product ) {     if ( $product && $product->is_type( 'simple' ) && $product->is_purchasable() && $product->is_in_stock() && ! $product->is_sold_individually() ) {         // Get the necessary classes         $class = 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' : '',         ) ) );          // Embedding the quantity field to Ajax add to cart button         $html = sprintf( '%s%s',             woocommerce_quantity_input( array(), $product, false ),             esc_url( $product->add_to_cart_url() ),             esc_attr( isset( $quantity ) ? $quantity : 1 ),             esc_attr( $product->get_id() ),             esc_attr( $product->get_sku() ),             esc_attr( isset( $class ) ? $class : 'button' ),             esc_html( $product->add_to_cart_text() )         );     }     return $html; }  add_action( 'wp_footer' , 'archives_quantity_fields_script' ); function archives_quantity_fields_script(){     ?>

Code goes in functions.php file of your active child theme (active theme).
Tested and works on WooCommerce version 4.1.1 and WordPress 4.5.1 on Storefront theme.

Hiding "View cart" button (when using Ajax add to cart):

1) You can add this CSS rule to the styles.css file located in your active theme:

a.added_to_cart.wc-forward {     display:none; }

2) You can use the following hoocked function (first option is the best way):

add_action( 'wp_head' , 'hide_ajax_view_cart_button' ); function hide_ajax_view_cart_button(){     if( is_shop() || is_product_category() || is_product_tag() ): ?>

Code goes in function.php file of your active child theme (active theme).

see demo
  • 18
Reply Report
name
  • 37
Royce hobert dorothy
Royce hobert dorothy Added an answer on Jul 15,2020

Does everything as above, without the "quantity bug".

The code:

add_filter( 'woocommerce_loop_add_to_cart_link', 'quantity_inputs_for_loop_ajax_add_to_cart', 10, 2 ); function quantity_inputs_for_loop_ajax_add_to_cart( $html, $product ) {     if ( $product && $product->is_type( 'simple' ) && $product->is_purchasable() && $product->is_in_stock() && ! $product->is_sold_individually() ) {         // Get the necessary classes         $class = 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' : '',         ) ) );          // Adding embeding 
 tag and the quantity field         $html = sprintf( '%s%s%s%s',         '',         woocommerce_quantity_input( array(), $product, false ),         esc_url( $product->add_to_cart_url() ),         esc_attr( isset( $quantity ) ? $quantity : 1 ),         esc_attr( $product->get_id() ),         esc_attr( $product->get_sku() ),         esc_attr( isset( $class ) ? $class : 'button' ),         esc_html( $product->add_to_cart_text() ),         '
'         );     }     return $html; }  add_action( 'wp_footer' , 'archives_quantity_fields_script' ); function archives_quantity_fields_script(){     //if( is_shop() || is_product_category() || is_product_tag() ): ?>

References:

@LoicTheAztec's entry above 11 Feb 2018.

@braciawrite's and @andrewmclagan's GitHub entries on 11 Dec 2015 and 15 Mar 2018 respectively.

https://gist.github.com/webaware/6260326

Note:

Code should perform the check when "add_to_cart" button is pressed, not on quantity change.

I've commented out the if and endif statements under function "archives_quantity_fields_script" as I am running this code on a custom page with WooCommerce products.

Hope this helps!

demo
  • 37
Reply Report


You may also like

Popular Questions

Trending Tags

javascript python json django ajax wordpress wordpress-theming jquery django-views

Related Questions

Powered By cnasolution.com