How can I add the counter beside the cart button on my products page (not the details product page), and it would appear like in the picture bellow
Can someone tell me which plugin should I use or any other suggestion?
Thank you in advanced!
To display quantity input fields for simple products within your shop archive pages, you can add the following code to your active theme’s functions.php file.
/**
* Code should be placed in your theme functions.php file.
*/
add_filter( 'woocommerce_loop_add_to_cart_link', 'quantity_inputs_for_woocommerce_loop_add_to_cart_link', 10, 2 );
function quantity_inputs_for_woocommerce_loop_add_to_cart_link( $html, $product ) {
if ( $product && $product->is_type( 'simple' ) && $product->is_purchasable() && $product->is_in_stock() && ! $product->is_sold_individually() ) {
$html = '<form action="' . esc_url( $product->add_to_cart_url() ) . '" class="cart" method="post" enctype="multipart/form-data">';
$html .= woocommerce_quantity_input( array(), $product, false );
$html .= '<button type="submit" class="button alt">' . esc_html( $product->add_to_cart_text() ) . '</button>';
$html .= '</form>';
}
return $html;
}
I've used this for a project I was working on not too long ago. This does what you need and is quite easy to follow: https://gist.github.com/JeroenSormani/a3325bdbca57f59690c1#file-woocommerce-archive-page-quantity-field-php
So you simply add this to functions.php and refresh... You may need to do:
.archive .quantity {
display: inline-block;
}
so it displays correctly.
Related
I am trying to display the add to cart button and variables dropdown / price inside a custom theme, built on Genesis.
I have created some code so that if the product is a simple product, it displays a custom form with the add to cart/quantity buttons inside the header (in functions.php > is_product()).
This works fine. What I'm now trying to do is display a similar form if it's a variable product, but obviously display the variable product dropdowns and add to cart/price, etc as they would default show in Woocommerce, but displaying it in the header, outside the loop.
I have this code:
$product_id = get_the_id();
$product = wc_get_product( $product_id );
<?php
if( $product->is_type( 'simple' ) ):
$html = '<form action="' . esc_url( $product->add_to_cart_url() ) . '" class="cart" method="post" enctype="multipart/form-data">';
$html .= woocommerce_quantity_input( array(), $product, false );
$html .= '<button type="submit" class="button alt">' . esc_html( $product->add_to_cart_text() ) . '</button>';
$html .= '</form>';
echo $html;
elseif ($product->is_type('variable')) :
woocommerce_variable_add_to_cart();
endif; ?>
I think woocommerce_variable_add_to_cart() should display the add to cart template for variables out of the box, but I'm getting an error:
Fatal error: Uncaught Error: Call to a member function get_children() on string in /wp-content/plugins/woocommerce/includes/wc-template-functions.php on line 1733
Do I need to pass $product into it somehow?
Now I have links like
<a href="/////" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">
And I need
<a href="/////" class="woocommerce-LoopProduct-link woocommerce-loop-product__link out-of-stock">
You can use the action hook - woocommerce_before_shop_loop_item to modify the link and add your own CSS class.
The following code should work -
if ( ! function_exists( 'custom_woocommerce_template_loop_product_link_open' ) ) {
/**
* Insert the opening anchor tag for products in the loop.
*/
function custom_woocommerce_template_loop_product_link_open() {
global $product;
$link = apply_filters( 'woocommerce_loop_product_link', get_the_permalink(), $product );
if ( ! $product->is_in_stock() ) {
$outOfStock = "out-of-stock";
}
echo '<a href="' . esc_url( $link ) . '" class="woocommerce-LoopProduct-link woocommerce-loop-product__link ' . $outOfStock .'">';
}
}
add_action( 'woocommerce_before_shop_loop_item', 'custom_woocommerce_template_loop_product_link_open', 10 );
You can add this code to your themes functions.php file or use a code snippets plugin.
Is it possible to check if the product is in the cart, and then show (+ or -)? And if it is not in the basket showing Add to basket button.
I use the following line of codes, But it shows both plus and minus and add to cart button.
add_filter( 'woocommerce_loop_add_to_cart_link', 'quantity_inputs_for_woocommerce_loop_add_to_cart_link', 10, 2 );
function quantity_inputs_for_woocommerce_loop_add_to_cart_link( $html, $product ) {
if ( $product && $product->is_type( 'simple' ) && $product->is_purchasable() && $product->is_in_stock() && ! $product->is_sold_individually() ) {
$html = '<form action="' . esc_url( $product->add_to_cart_url() ) . '" class="cart" method="post" enctype="multipart/form-data">';
$html .= woocommerce_quantity_input( array(), $product, false );
$html .= '<button type="submit" class="button alt">' . esc_html( $product->add_to_cart_text() ) . '</button>';
$html .= '</form>';
}
return $html;
}
I am looking for a solution to only show add to cart button. if it is in the cart then show plus and minus.
I have a custom product list on a specific category page.
It looks like this:
Product list category page with missing quantity selection and add to cart button at end.
I have been using the below in functions.php and it has worked fine. Since the last update of WooCommerce it no longer works. The add to cart buttons and quantity fields are not showing anymore.
I get no errors and the fields where the qty and button html goes are blank when I check the html for the page.
add_filter( 'woocommerce_loop_add_to_cart_link', 'quantity_inputs_for_woocommerce_loop_add_to_cart_link', 10, 2 );
function quantity_inputs_for_woocommerce_loop_add_to_cart_link( $html, $product ) {
$term_id = get_queried_object()->term_id;
$post_id = 'product_cat_'.$term_id;
$wk_cat_value = get_term_meta($term_id, 'wh_meta_cat_template', true);
// Only for this product category
if ($wk_cat_value == 1 && is_product_category())
{
if ( $product && $product->is_type( 'simple' ) && $product->is_purchasable() && $product->is_in_stock() && ! $product->is_sold_individually() )
{
$html = '<form action="' . esc_url( $product->add_to_cart_url() ) . '" class="cart" method="post" enctype="multipart/form-data">';
$html .= woocommerce_quantity_input( array(), $product, false );
$html .= '<button type="submit" class="button alt">' . esc_html( $product->add_to_cart_text() ) . '</button>';
$html .= '</form>';
}
return $html;
}
}
This line is a checkbox I added to the category page to specify if the current category is to use the custom template:
$wk_cat_value = get_term_meta($term_id, 'wh_meta_cat_template', true);
Template version Woocommerce files were 2.0.0.
Updated versions are 3.4.0.
Any suggestions greatly appreciated.
Found a solution:
function wk_add_to_cart() {
$term_id = get_queried_object()->term_id;
$post_id = 'product_cat_'.$term_id;
// $wk_cat_value is a flag added to this specific category to decide whether or not the add to cart should be added
$wk_cat_value = get_term_meta($term_id, 'wh_meta_cat_template', true);
global $product;
if ($wk_cat_value == 1 && is_product_category()) {
if ( $product && $product->is_type( 'simple' ) && $product->is_purchasable() && $product->is_in_stock() && ! $product->is_sold_individually() ) {
echo '<form action="' . esc_url( $product->add_to_cart_url() ) . '" class="cart" method="post" enctype="multipart/form-data">';
echo woocommerce_quantity_input( array(), $product, false );
echo '<button type="submit" class="button alt">' . esc_html( $product->add_to_cart_text() ) . '</button>';
echo '</form>';
}
}
}
add_action('woocommerce_after_shop_loop_item','wk_add_to_cart');
Hope that helps.
I am using Woocommerce Product Add-on plugin to allow visitor to select multiple options on simple product. As the product is simple product Woocommerce display an Add to cart button on products page view instead of Choose option button linking on Product detail page where visitor can choose options.
I am looking to create a function that will display Choose option button on product by ID.
Here is my starting code.
add_filter( 'woocommerce_loop_add_to_cart_link', 'change_product_button' );
function change_product_button() {
global $product;
$id = $product->id;
if ($id == 91){
echo '' . __('View Product', 'woocommerce') . '';
} else {
// display usual add to cart button
}
}
Or maybe we can force product by id as non purchasable to simulate a variable product.
This is a working solution
add_filter( 'woocommerce_loop_add_to_cart_link', 'change_product_button', 10, 2 );
function change_product_button($html, $product) {
$values = array(190, 91);
$id = $product->id;
if(in_array($id, $values)){
$html= '' . __('Choose an option', 'woocommerce') . '';
} else {
$html = '<form action="' . esc_url( $product->add_to_cart_url() ) . '" class="cart" method="post" enctype="multipart/form-data">';
$html .= woocommerce_quantity_input( array(), $product, false );
$html .= '<button type="submit" class="button alt">' . esc_html( $product->add_to_cart_text() ) . '</button>';
$html .= '</form>';
}
return $html;
}