Additional button in Woocommerce shop page and archives - php

I'd like to add a button next to "Add to Cart" on the product page that adds "-sample" to the product URL when clicked.
Example:
You're viewing Product 1's page and the URL is "http://www.example.com/shop/product-1/"
When you click on the button, it adds "-sample" to the URL
"http://www.example.com/shop/product-1-sample/"
How can I achieve this?
Thanks

For woocommerce 3+ (only):
In woocommerce 3 you will use woocommerce_after_shop_loop_item action hook instead, as the hook woocommerce_after_add_to_cart_button will not work anymore.
add_action( 'woocommerce_after_add_to_cart_button', 'add_custom_button', 10, 0 );
function add_custom_button() {
global $product;
$product_link = $product->get_permalink();
$sample_link = substr($product_link, 0, -1) . '-sample/';
echo '<a class="button alt btn-sample" href="' . esc_url( $sample_link ) .'">' . __( "Get a sample", "my_theme_slug" ) . '</a>';
}
Code goes on function.php file of your active child theme (or active theme). Tested and works.
Before woocommerce 3:
This is possible using hook woocommerce_after_add_to_cart_button to add your additional button on product pages, using this custom function:
add_action( 'woocommerce_after_add_to_cart_button', 'add_custom_button', 10, 0 );
function add_custom_button() {
global $product;
$product_link = get_permalink( get_the_id() );
$sample_link = substr($product_link, 0, -1) . '-sample/';
echo '<a class="button alt btn-sample" href="' . esc_url( $sample_link ) .'">' . __( "Get a sample", "my_theme_slug" ) . '</a>';
}
This code goes on function.php file of your active child theme or theme.
This code is tested and fully functional.
Based on this: Add a button after add to cart and redirect it to some custom link in WooCommerce
And this: PHP - How to remove all specific characters at the end of a string?

It's been a long time since the original question, but here's a recent update that works for me, WooCommerce 6.3.1:
/* WooCommerce customization */
add_action( 'woocommerce_after_shop_loop_item', 'custom_select_link', 11 );
function custom_select_link() {
global $product;
// Custom "Select" button.
echo '<a class="custom-button" href="' . esc_url( get_permalink( $product->id ) ) . '"><button class="custom-button"> </button></a>';
}
This answer cites an answer in wordpress.stackexchange.

Related

Change Button Link depending of site in Woocommerce Template

for some reasons I want to change the links from “add to cart” buttons. So when on archive-product.php the link of this button should NOT got to the add-to-cart page but to the single-product page. (single-product.php)
When on single-product.php the button should link to another custom page I’ll define but also not to the add-to-cart page. (Which I don’t need for this use-case)
I realize, that this must be a conditional filter in functions.php – but I have no clue of how to make this.
I managed to change the Button texts depending on the page I am. Like:
function woocommerce_custom_single_add_to_cart_text() {
return __( 'Produkt verhindern', 'woocommerce' );
}
add_filter( 'woocommerce_product_add_to_cart_text', 'woocommerce_custom_product_add_to_cart_text' );
function woocommerce_custom_product_add_to_cart_text() {
return __( 'Mehr erfahren', 'woocommerce' );
}
To modify add to cart link to single product link in Archive page, please refer below code:
add_filter( 'woocommerce_loop_add_to_cart_link', 'replacing_add_to_cart_button', 10, 2 );
function replacing_add_to_cart_button( $button, $product ) {
$button_text = __("Add to cart", "woocommerce");
$button = '<a class="button" href="' . $product->get_permalink() . '">' . $button_text . '</a>';
return $button;
}
To modify add to cart link to global another redirect link then below is the code:
remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30);
add_action('woocommerce_single_product_summary', 'custom_single_add_to_cart', 30);
function custom_single_add_to_cart()
{
$button_text = __("Add to cart", "woocommerce");
echo '<a class="button" href="global_link_for_all_products">' . $button_text . '</a>';
}

Add a custom linked text under WooCommerce single product meta, above share buttons

How to add "contact us" text under the tag or above the share button on a single product page
I have added another text below the price of the product, it works
add_action( 'woocommerce_before_add_to_cart_form', 'bbloomer_show_return_policy', 20 );
function bbloomer_show_return_policy() {
echo '<p class="rtrn"> See Our License Here!
<br /></p>';
}
if to add text below the tag or above the share button it doesn't work
add_action ( 'woocommerce_after_add_to_cart_button' , 'bbloomer_after_add_to_cart_btn' ) ;
function bbloomer_after_add_to_cart_btn ( ) {
echo '<p class="rtrn"> Contact us Here!
<br /></p>';
}
How to add “contact us” text under the tag or above the share button use the following:
add_action( 'woocommerce_single_product_summary', 'custom_single_product_summary', 45 );
function custom_single_product_summary() {
printf( '<p class="rtrn">%s %s <br /></p>',
__( "Contact us", "woocommerce" ),
home_url( '/contact-us/' ),
__( "Here!", "woocommerce") );
}
Code goes in functions.php file of your active child theme (or active theme). Tested and works.
Try this,
This code is worked for me. Hope this will helps you.
//Add DIV end element after shop loop item
add_action('woocommerce_after_shop_loop_item', 'action_woocommerce_after_shop_loop_item', 10, 0);
function action_woocommerce_after_shop_loop_item( ) {
echo "</a>";
};
//Add DIV start element before shop loop item
add_action('woocommerce_before_shop_loop_item', 'action_woocommerce_before_shop_loop_item', 10, 0);
function action_woocommerce_before_shop_loop_item( ) {
echo "<p class="rtrn">See Our License <a href="mysite.com/license/" target="_blank"> Here!";
};

Woocommerce open product link in new tab after "endless scroll" with ajax

I have managed to get all product links on my Woocommerce site to open in a new tab, however, I am using endless scroll with ajax for loading more products and the products that get loaded via endless scroll does not open in a new tab when clicking on them.
Here is my current code for opening products in a new tab;
remove_action( 'woocommerce_before_shop_loop_item','woocommerce_template_loop_product_link_open', 10 );
add_action ( 'woocommerce_before_shop_loop_item', 'chr_function_open_new_tab', 10 );
function chr_function_open_new_tab() {
echo '<a target="_blank" href="' . get_the_permalink() . '" class="woocommerce-LoopProduct-link">';
}
Any help with this is highly appreciated.
Thanks in advance!
I think that your remove_action cannot take an action. That's why it gives a trouble. So try this code:
add_action('init',function(){ remove_action( 'woocommerce_before_shop_loop_item', 'woocommerce_template_loop_product_link_open', 10 ); } ,0);
function chr_function_open_new_tab() {
echo '<a target="_blank" href="' . get_the_permalink() . '" class="woocommerce-LoopProduct-link">';
}
Second Other Solution, you can do it with simple jQuery
add_action('wp_footer',function(){
if ( has_term( 'stone', 'product_cat' ) ) {
echo '<script>
//for existing content
jQuery(".woocommerce-LoopProduct-link").attr("target","_blank");
//for content part which comes from AJAX
jQuery( document ).ajaxComplete(function() {
jQuery(".woocommerce-LoopProduct-link").attr("target","_blank");
});
</script>';
}
});
Instead try to use this dedicated filter hook for add to cart button:
// Change loop add to cart ajax button to a linked button to single product pages
add_filter( 'woocommerce_loop_add_to_cart_link', 'replace_loop_add_to_cart', 20, 2 );
function replace_loop_add_to_cart( $html, $product ) {
$link = $product->get_permalink();
$text = __("Read More", "woocommerce");
return '' . $text . '';
}
And here for the product link:
add_filter( 'woocommerce_before_shop_loop_item', 'replace_template_loop_product_link_open', 1 );
function replace_loop_product_link() {
remove_action( 'woocommerce_before_shop_loop_item','woocommerce_template_loop_product_link_open', 10 );
add_action ( 'woocommerce_before_shop_loop_item', 'new_loop_product_link_open', 10 );
}
function new_loop_product_link_open() {
global $product;
echo '<a href="' . esc_url( $product->get_permalink() ) . '" target="_blank" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">';
}
Code goes in function.php file of your active child theme (or active theme). Tested and works.
But in your case, it could not work as expected, depending on how your custom ajax functionality is implemented. As the problem remains for products loaded via ajax, the target="_blank" need to be implemented in the corresponding script too.
At this point nobody can help you more as we can't guess how this functionality is built.

Change wc_empty_cart_message function in WooCommerce 3.1

I've been trying to change my layout for the empty-cart message. I've removed the action, and try to replace it.
I'd like to change the htm structure output from:
<p class="empty-cart"></p>
to:
<div class="col-12 offset-md-1 col-md-10"><p class="empty-cart"></p></div>
My actual code (in functions.php file of my theme):
/** Change the output for empty-cart within a div */
remove_action( 'wc_empty_cart_message', 'wc_empty_cart_message', 10 );
add_action( 'wc_empty_cart_message', 'wc_empty_cart_message', 10 );
function custom_wc_empty_cart_message() {
echo '<div class="col-12 offset-md-1 col-md-10"><p class="cart-empty">'
. wp_kses_post( apply_filters( 'wc_empty_cart_message', __( 'Your cart is currently empty.', 'woocommerce' ) ) ) . '</p></div>';
}
But this code doesn't work. Does anyone has a suggestions on how to make this work?
Here below is the correct way to make it work:
remove_action( 'woocommerce_cart_is_empty', 'wc_empty_cart_message', 10 );
add_action( 'woocommerce_cart_is_empty', 'custom_empty_cart_message', 10 );
function custom_empty_cart_message() {
$html = '<div class="col-12 offset-md-1 col-md-10"><p class="cart-empty">';
$html .= wp_kses_post( apply_filters( 'wc_empty_cart_message', __( 'Your cart is currently empty.', 'woocommerce' ) ) );
echo $html . '</p></div>';
}
Code goes in function.php file of your active child theme (or active theme). Tested and works.
To remove empty cart message use just:
remove_action( 'woocommerce_cart_is_empty', 'wc_empty_cart_message', 10 );

products "read more" button is not working in woocommerce store

I recently added code snippet to my functions.php child theme file which task is to echo a "Read More" button under all products which leads the user to the click product page. The product-id link is not working. Here is the code:
/*-ADD NEW BUTTON THAT LINKS TO PRODUCT PAGE FOR EACH PRODUCT */
add_action('woocommerce_after_shop_loop_item','replace_add_to_cart');
function replace_add_to_cart() {
global $product;
$link = $product->get_permalink();
echo do_shortcode('<br><button link="' . esc_attr($link) . '">Read more</button>');
}
Right now, It just shows a button text(without class) which does not redirect to any product link. I want to add the primary button to it as well.
There is many different errors in your code and your question is not so clear. So you can:
1) To add an additional button (below existing add-to-cart button):
add_action('woocommerce_after_shop_loop_item', 'replace_add_to_cart' );
function replace_add_to_cart() {
global $product;
echo '<br><a class="button" href="' . esc_attr( $product->get_permalink() ) . '">' . __( "Read more" ) . '</a>';
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
Tested and works.
2) Replace add to cart button using the woocommerce_loop_add_to_cart_link filter hook this way:
add_filter( 'woocommerce_loop_add_to_cart_link', 'replace_loop_add_to_cart_button', 10, 2 );
function replace_loop_add_to_cart_button( $button, $product ) {
return '<a class="button" href="' . $product->get_permalink() . '">' . __( "Read more" ) . '</a>';
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
Tested and works.

Categories