I am learning more and more php as i go along. I sorta get the gist of how php hooks work (actions, filters)
I was attempting to add a filter to my child functions page:
add_filter('woocommerce_booking_single_check_availability_text', 'wc_change_button_text');
function wc_change_button_text() {
return __( 'Add to cart', 'woocommerce' );
}
You could use WooCommerce filter hooks to change these, but I wouldn't recommend it because it'll take too long and create code bloat.
Here's what I would recommend: https://wordpress.org/plugins/woocommerce-multilingual/
I'm sure you may have already found a solution, but for anyone else that stumbles across this post, simply add this snippet to your child theme's functions file.
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 = __("Change Text Here", "woocommerce");
$button = '<a class="book-now button" href="' . $product->get_permalink() . '">' . $button_text . '</a>';
return $button;
}
Tested and works 5.4.1
Related
I have used following shortcodes in the Home page to display set of products :-
[products limit="15" orderby="menu_order" columns="5" category="shirt, shoe"]
However when any product image is clicked on the Home page, the specific link is opened on the same tab. I would like to open that link in a separate tab. How to achieve this?
Thanks!
Note: I am using Oceanwp as my active theme
Funny, i just had the same issue few days ago. Here's how i've solved it:
if ( ! function_exists( 'woocommerce_template_loop_product_link_open' ) ) {
/**
* Insert the opening anchor tag for products in the loop.
*/
function woocommerce_template_loop_product_link_open() {
global $product;
$link = apply_filters( 'woocommerce_loop_product_link', get_the_permalink(), $product );
echo '<a href="' . esc_url($link) . '" class="woocommerce-LoopProduct-link woocommerce-loop-product__link" target="_blank">';
}
}
Tested and works. You can just paste this into your functions.php or if you've made a custom plugin just include this at the very beginning.
You might need to add "is_home()" or "is_front_page()" to make it hit just the home page and not the whole site
Since I am using Oceanwp theme, I have to modify in different places than what is suggested by #Diego. But his answer gives me the clue for finding the solution.
This is the modification I did to make it work for Oceanwp.
if ( ! function_exists( 'ocean_woo_img_link_open' ) ) {
function ocean_woo_img_link_open() {
global $product;
$woo_img_link = get_the_permalink( $product->get_id() );
echo '<a href="' . esc_url( $woo_img_link ) . '" class="woocommerce-LoopProduct-link" target="_blank" >';
}
}
I have this piece of code which I use for my checkout/order button. Which is pretty convenient, I can style the button and add custom text and classes. I know this won't work with translated content but that is of no importance here because the website is and will stay in only 1 language.
// Filter for adding extra custom line to order button
add_filter('woocommerce_order_button_html', 'mbm_custom_button_html');
function mbm_custom_button_html($button_html)
{
$button_html = '<button type="submit" class="button alt" name="woocommerce_checkout_place_order" id="place_order">Lidmaatschap starten<br /><span class="extra-text-checkout-button">Betaal pas na gratis proefperiode</span></button>';
return $button_html;
}
I was wondering can I also use the same method for the add to cart button? But then something like add_filter('woocommerce_add_to_cart_button_html', 'mbm_custom_atc_button_html');
I tried to search it in the docs but could not find my answer.
For "Add to Cart" part, you may try this hooks: woocommerce_loop_add_to_cart_link and woocommerce_product_single_add_to_cart_text.
I believe, the first one provides a better solution for you. You may check the detailed usage via: https://stackoverflow.com/a/56179393/11003615 and http://hookr.io/filters/woocommerce_loop_add_to_cart_link/
Hope those helps. Best regards.
for loop page
add_filter('woocommerce_product_add_to_cart_text', 'custom_woocommerce_product_add_to_cart_text', 100);
for product single page
add_filter('woocommerce_product_single_add_to_cart_text', 'custom_woocommerce_product_add_to_cart_text', 100);
function custom_woocommerce_product_add_to_cart_text(){
return 'Add to catd 111';
}
There does not exists filter to change the 'ADD TO CART' button HTML.
If you need to do changes in HTML of 'ADD TO CART' button, you need to override the templates from plugin to your theme.
For example, for simple product 'ADD TO CART' button HTML, you need to override /plugins/woocommerce/templates/single-product/add-to-cart/simple.php to /theme/woocommerce/single-product/add-to-cart/simple.php and do changes in simple.php which is in a theme folder.
Add below code in your active theme's function.php
add_filter( 'woocommerce_order_button_html', 'ro_custom_cart_button_html' );
function ro_custom_cart_button_html( $button_html ) {
$order_button_text = 'Submit';
//add your html below where there is button tag
$button_html = '<button type="submit" class="button alt"
name="woocommerce_checkout_place_order" id="place_order" value="' . esc_attr(
$order_button_text ) . '" data-value="' . esc_attr( $order_button_text ) . '">' .
esc_html( $order_button_text ) . '</button>';
$button_html = str_replace( 'Place order', 'Submit', $button_html );
return $button_html;
}
Tested and works well
After updating plugins, my "Read more" button on posts changed it's name. In Latvian language it was "Lasīt vairāk", while in Russian "Читать дальше". It's just in plain English. The image of how it looks now is via this link. Plugin updates basically wiped out the padding and the name of the button.
Tried modifying functions.php with
// Replaces the excerpt "Read More" text by a link
function modify_read_more_link() {
return '<a class="read-article" href="' . get_permalink() . '">Your Read
More Link Text</a>';
}
add_filter( 'the_content_more_link', 'modify_read_more_link' );
// Replaces the excerpt "Read More" text by a link
function new_excerpt_more($more) {
global $post;
return '<a class="read-article" href="'. get_permalink($post->ID) . '">
Read the full article...</a>';
}
add_filter('excerpt_more', 'new_excerpt_more');
Tried loco translate and modifying internal translations of Elementor-related plugins. The closest I could get is that the elements is named "eael-post-elements-readmore-btn". Styling the element with CSS doesn't do anything. Padding or margin do not work. It's locked. Can anyone provide a hint?
The button should be in Latvian and Russian language, not in English.
PS. Figured that it is Elementor posts plugin related overriding functions.php and translators as well. At this moment, can't figure how to CSS this thing. Stays static.
Add this in functions.php:
function develop_custom_excerpt_more($more) {
global $post;
// edit here if you like
return '... <a class="excerpt-read-more" href="'. get_permalink( $post->ID ) . '" title="'. __( 'Read ', 'domain_name' ) . esc_attr( get_the_title( $post->ID ) ).'">'. __( 'Show more »', 'domain_name' ) .'</a>';
}
add_filter( 'excerpt_more', 'develop_custom_excerpt_more' );
Figured that it is Elementor posts plugin related overriding functions.php and translators as well. The eael-post-elements-readmore-btn was not changing in padding nor in margin because line-height which by default is set to 1 could not allow space for expansion.
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.
Building custom woocommerce template on top of storefront.
I want to replace/change some html for the individual item titles within the loop functionality for the category pages. The "add to cart" link, price, etc. are all located in woocommerce/templates/loop directory. None of the files in that directory appear contain the html for the product title for this functionality.
Where do I find this thing? I swear the most annoying thing about building on woocommerce is trying to find where all the pieces live...
woocommerce/includes/wc-template-functions.php
woocommerce_template_loop_product_title function
function woocommerce_template_loop_product_title() {
echo '<h3 class="woocommerce-loop-product__title">' . get_the_title() . '</h3>';
}
You need change the information in the file functions.php, preferably in the theme child file.
What you put there will normally be rewritten because it have priority.
Like Randy wrote it, this is a pluggable function you will find in
wp-content\plugins\woocommerce\includes\wc-template-functions.php
if ( ! function_exists( 'woocommerce_template_loop_product_title' ) ) {
/**
* Show the product title in the product loop. By default this is an H2.
*/
function woocommerce_template_loop_product_title() {
echo '<h2 class="' . esc_attr( apply_filters( 'woocommerce_product_loop_title_classes', 'woocommerce-loop-product__title' ) ) . '">' . get_the_title() . '</h2>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
}
To override it, just copy paste the code without the condition in the functions.php file of your child theme and modify it according to your needs.
Ex: Change h2 for h3
function woocommerce_template_loop_product_title() {
echo '<h3 class="' . esc_attr( apply_filters( 'woocommerce_product_loop_title_classes', 'woocommerce-loop-product__title' ) ) . '">' . get_the_title() . '</h3>';
}