How to add "show details" button near the cart button in Woocommerce - wordpress

I want to add additional button in woocommerce single product. In which file I need to make changes?
Example on screen:
enter image description here

Try this code,
function wc_shop_demo_button() {
echo '<a class="button demo_button" style="padding-right: 0.75em;padding-left: 0.75em;margin-left: 8px; background-color: #0ebc30;" href="'.get_field( "url_demo" ).'" target="_blank">Show Details</a>';
}
add_action( 'woocommerce_after_shop_loop_item', 'wc_shop_demo_button', 20 );
add_action( 'woocommerce_after_add_to_cart_button', 'wc_shop_demo_button', 20 );
Hope this will helps you. For more details visit,
how to add button after woocommerce shop loop item

First of all, create a Custom Field using Advanced Custom Fields plugin for Woocommerce Product Page.
For creating a custom field using the ACF plugin, refer to the below article.
https://wpmayor.com/woocommerce-custom-fields-how-to-create-and-display-them/
To display the Custom Button in the frontend of the website, add the below code in functions.php file.
function rf_custom_product_button() {
echo '<a class="button custom_button" href="'.get_field( "custom_button" ).'" target="_blank">Click Here</a>';
}
add_action( 'woocommerce_after_add_to_cart_button', 'rf_custom_product_button', 20 );
add_action( 'woocommerce_after_shop_loop_item', 'rf_custom_product_button', 20 );
In the above code, Change the "custom_button" to the name of the field which you create using ACF.

Related

Generate PDF file on product page woocommerce

I using wordpress and woocommerce plugin and added custom html button on product page. I did it in function.php file. How can i get PDF file with photo content from every product page after click on my button?
add_action( 'woocommerce_after_single_product_summary', 'custom_button_on_product_page' );
function custom_button_on_product_page() {
global $product;
echo '<button class="send_button">SEND PDF</button>';
}
function enqueue_jspdf() {
wp_enqueue_script( 'jspdf', 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js', array(), '2.5.1', true );
}
add_action( 'wp_enqueue_scripts', 'enqueue_jspdf' );
How can i do it? Help please. I tried add jsPDF library in function.php too and paste javascript code in code snippet. But i don't now how to hook on my code to photo content in product page. Great thanks for your answers

Add a shortcode above the WooCommerce product short description

I am trying to add a shortcode to all my woocommerce single product pages. I want the shortcode to appear above the short description.
I have found this code and added it to functions.php, but I can see that it adds the shortcode below the short description (and above the add to cart button).
add_filter('woocommerce_short_description','ts_add_text_short_descr');
function ts_add_text_short_descr($description){
$text = do_shortcode('[my-shortcode]');
return $description.$text;
}
I would be very gratefull for some help :)
function customShortcodeBeforeShortDescription( $post_excerpt )
{
echo do_shortcode('[wpqr-code]');
}
add_filter('woocommerce_short_description','customShortcodeBeforeShortDescription', 10, 1);
You can use the woocommerce_single_product_summary action hook. try the below code. The code will go in your active theme functions.php file.
function add_shortcode_before_short_description(){
echo do_shortcode( '[wpqr-code]' );
}
add_action( 'woocommerce_single_product_summary', 'add_shortcode_before_short_description', 15, 1 );
Tested and works

Show custom text block on product page only if a product is out of stock with backorder enabled

i have a wordpress site with woocommerce and flatsome theme. The theme give the possibility to add easily a custom html text before or after the add to cart button.
I would like that the html text show up only for out of stock with backorder enabled products, for single and variables products.
the theme have this code
// Add HTML after Add to Cart button
function flatsome_after_add_to_cart_html(){
echo do_shortcode(get_theme_mod('html_after_add_to_cart'));
}
add_action( 'woocommerce_single_product_summary', 'flatsome_after_add_to_cart_html', 30);
any help is appreciated
You can likely do that with just an additional couple of checks in your function. Before echoing the content - check the $product like this:
function flatsome_after_add_to_cart_html(){
global $product;
if( ! $product->is_in_stock() && $product->backorders_allowed() ){
echo do_shortcode(get_theme_mod('html_after_add_to_cart'));
}
}
add_action( 'woocommerce_single_product_summary', 'flatsome_after_add_to_cart_html', 30);

Change woocommerce cart link in menu [duplicate]

On Woocommerce, how can we change the URLs on "View cart" and "Checkout" links on the drop down menu that show up on hover over the shopping cart icon on the the home page?
I have the "cart" and "checkout" pages setup but they are not linked to these.
I can view these pages directly with urls. http://mysite/cart and http://mysite/checkout
It seems that there is a problem somewhere with your theme (or in a plugin), as the minicart button links always point to the right cart and checkout pages.
The minicart buttons are hooked in woocommerce_widget_shopping_cart_buttons action hook (in the cart/mini-cart.php WooCommerce template). You will find the details HERE on includes/wc-template-hooks.php core file. It calls 2 functions that are displaying the buttons.
First you should try to refresh WordPress Permalinks, going on WP Settings > Permalinks:
Just at the end of the page click on "save". Empty your cart, and try it again to see if it changes something.
In the code below I remove first the original buttons and I replace them by the same ones where the links are customized. For each you can change the link to feet your needs (I have added in the links ?id=1 (at the end) just for testing purpose, to check changes):
add_action( 'woocommerce_widget_shopping_cart_buttons', function(){
// Removing Buttons
remove_action( 'woocommerce_widget_shopping_cart_buttons', 'woocommerce_widget_shopping_cart_button_view_cart', 10 );
remove_action( 'woocommerce_widget_shopping_cart_buttons', 'woocommerce_widget_shopping_cart_proceed_to_checkout', 20 );
// Adding customized Buttons
add_action( 'woocommerce_widget_shopping_cart_buttons', 'custom_widget_shopping_cart_button_view_cart', 10 );
add_action( 'woocommerce_widget_shopping_cart_buttons', 'custom_widget_shopping_cart_proceed_to_checkout', 20 );
}, 1 );
// Custom cart button
function custom_widget_shopping_cart_button_view_cart() {
$original_link = wc_get_cart_url();
$custom_link = home_url( '/cart/?id=1' ); // HERE replacing cart link
echo '' . esc_html__( 'View cart', 'woocommerce' ) . '';
}
// Custom Checkout button
function custom_widget_shopping_cart_proceed_to_checkout() {
$original_link = wc_get_checkout_url();
$custom_link = home_url( '/checkout/?id=1' ); // HERE replacing checkout link
echo '' . esc_html__( 'Checkout', 'woocommerce' ) . '';
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
All code is tested on Woocommerce 3+ and works.

Custom Button in WooCommerce add order admin page

I want to add a custom button in the page where admin can manually create new order (Admin Order page).
Admin -> Woocommerce -> order -> Add order
After i add product and when clicked edit button can i show a custom button near to Add Meta button ? I cannot find a hook to use.
add_action( 'woocommerce_after_order_itemmeta', 'editable_order_meta_general' );
function editable_order_meta_general(){
?>
<button class="add_values button"><?php _e( 'Add Custom', 'woocommerce' ); ?></button>
<?php
}
I have added the above code. I got the result but the button is displayed soon after i add the product. I only want the button to display when i click edit button.
This is my error
This is my requirement.
#UPDATE
When i added the following code, it worked. Is it the right way ? Since woocommerce button in the same field is set display:none; initially .
add_action( 'woocommerce_after_order_itemmeta', 'editable_order_meta_general' );
function editable_order_meta_general(){
?>
<div class="edit" style="display: none;">
<button class="add_values button"><?php _e( 'Add Custom', 'woocommerce' ); ?></button>
</div>
<?php
}
#Answer
As mentioned by Loiz in comment, there is no hook in WooCommerce to achieve this requirement. Have to change logic or something else.
The hook you're looking for is woocommerce_order_item_add_action_buttons()
I found this tutorial: https://hungred.com/how-to/woocommerce-hook-custom-button-admin-order-page/
Hope that helps

Resources