WooCommerce main product image - wordpress

I want to make a simple change to WooCommerce default template. Currently, the gallery displays on the left side just under the main image. I want it to display on the right side just under the short blurb description. I managed to do this by adding the following code to the functions.php file:
/*Relocate Product Gallery*/
remove_action( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_images', 20 );
add_action( 'woocommerce_before_single_product_summary', 'woocommerce-main-image', 20 );
add_action( 'woocommerce_single_product_summary', 'woocommerce_show_product_thumbnails', 100 );
The first line removes the group of images (main and gallery) from the left side.
The last line puts just the gallery exactly where I want it.
The middle line is the issue. I want just the main product image to appear where it should, but instead it's throwing an error. Am I using the wrong vaiable name to call just the main product image?

The short answer is that there is no function called woocommerce_main_image - you should be using woocommerce_show_product_images instead. If you check wc-template-hooks.php you'll see that it's hooked by default:
add_action( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_images', 20 );
What's not clear is why it's not already showing - perhaps your template isn't calling the woocommerce_before_single_product_summary action.
You say you want to display the main image separately from the thumbnails; I'm going to give you the long-winded explanation as to how it all works so that you have a better understanding:
Have a peek at wc-template-functions.php - you'll find that the woocommerce_show_product_images() includes the product-image.php file via this line:
// wc-template-functions.php:716
wc_get_template( 'single-product/product-image.php' ); // Includes product-image.php
This displays the main image and has a hook for displaying the thumbnails:
// product-image.php:43
do_action( 'woocommerce_product_thumbnails' ); // woocommerce_show_product_thumbnails() is hooked to this
You can either create your own copy of product-image.php to override and remove the do_action() OR you can unhook the function that is actually displaying the thumbnails using remove_action(). If you look in wc-template-hooks.php again you'll see:
// wc-template-hooks.php:108
// This hooks the function to the action
add_action( 'woocommerce_product_thumbnails', 'woocommerce_show_product_thumbnails', 20 );
That's what's hooking in the function to the action. You can remove this by putting...
// This unhooks the function from the action
remove_action( 'woocommerce_product_thumbnails', 'woocommerce_show_product_thumbnails' );
... into your theme functions.php file. To display the thumbnails in a different location you can simply use either the woocommerce_show_product_thumbnails() function or wc_get_template( 'single-product/product-thumbnails.php' ) in your template; the former is simply a wrapper function for the latter.
Hopefully that's a clear enough explanation for you to figure the rest out. Good luck.

Thank you! Accomplished.
/*---Move Product Gallery*/
remove_action( 'woocommerce_product_thumbnails', 'woocommerce_show_product_thumbnails', 20 );
add_action( 'woocommerce_single_product_summary', 'woocommerce_show_product_thumbnails', 100 );

Related

remove_action hook not working to remove credit card fields from donation form GiveWP

I have used below action hook to hide fields but it is not working.
remove_action( 'give_cc_form', 'give_get_cc_form' );
can anyone help me to figure out this issue
I am using GiveWP plugin for donation in WordPress site.
GiveWP has a pretty expansive snippet library, and one example shows how you can remove and rearrange fields. This is probably the best place to start from:
https://github.com/impress-org/givewp-snippet-library/blob/master/form-customizations/customize-fieldset-order.php
function give_remove_fieldsets() {
remove_action( 'give_cc_form', 'give_get_cc_form' );
}
add_action( 'init', 'give_remove_fieldsets' );
this actually worked for me
Make sure to run it at init, and you need to add the same priority used in the add_action, if none it uses 10 and the priority can be left blank
add_action('init','remove_actions');
function remove_actions() {
remove_action( 'give_cc_form', 'give_get_cc_form', 1 ); // Replace the priority with the correct one
}

Woocommerce how to remove Variation select list and show it in a custom hook

In a Woocommerce Product Page I need to remove the Variation Select Lists from the default placement and show them y my custom hook:
"flatsome_custom_single_product_3"
How can I do this?
I tried with this, but not working.
remove_action( 'woocommerce_single_variation', 'woocommerce_single_variation', 10 );
add_action( 'flatsome_custom_single_product_3', 'woocommerce_single_variation', 10 );
Take a look at this capture to see what I mean:
You could first remove the default variation and then add your own using the following hook:
remove_action('woocommerce_variable_add_to_cart', 'woocommerce_variable_add_to_cart', 30);
add_action('woocommerce_variable_add_to_cart', 'custom_variable_div', 15);
add_action('woocommerce_variable_add_to_cart', 'woocommerce_single_variation_add_to_cart_button', 20);
function custom_variable_div(){
# Make up your own stuff
}
I've tested it and it works seamlessly fine!

WP Genesis Framework - Remove post_content and restructure entry

I'm creating a Wordpress theme with Genesis.
1.In homepage and archive page, I want display only featured image and post title. How could I remove post_content in hompage and archive page only. This link: http://my.studiopress.com/snippets/entry-content/ remove all content including when I view the post.
By default, Genesis display title -> post_info ->featured image -> post_content in the archive page. How could I restructure it. I would to display featured image fist ->title->post_info
Thanks
1. Hiding the Entry Content from Home & Archive Pages in Genesis:
You are on right track with entry_content hook via remove_action however as you want to happen it only on Homepage or Archive pages, you need to wrap that genesis code in WordPress's template tags i.e
<?php
if (is_front_page() || is_home() || is_archive() ) {
//* Remove the post content (requires HTML5 theme support)
remove_action( 'genesis_entry_content', 'genesis_do_post_content' );
}
?>
2. Changing the Order of Entry Parts in Genesis Framework
You can change order by changing Hooks or if hook is same then WordPress's hook priority value. Default value is 10 , higher the value, lower the hook placement.
For Example Entry Info and Entry Title are added this way:
add_action( 'genesis_entry_header', 'genesis_do_post_title' );
add_action( 'genesis_entry_header', 'genesis_post_info', 12 );
As you can see title's hook is default 10, and info is set to 12.
If I wanted to move post info up, I could simple remove title from 10, and add back at 14 e.g.
remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
add_action( 'genesis_entry_header', 'genesis_do_post_title', 14 );
Now you can do change something from lower hook to above. Like in case of image, it is added at this hook:
add_action( 'genesis_entry_content', 'genesis_do_post_image', 8 );
As genesis_entry_content hook is way lower than genesis_entry_header, you can remove this image from here and move to genesis_entry_header or different hook e.g.
remove_action( 'genesis_entry_content', 'genesis_do_post_image', 8 );
add_action( 'genesis_entry_header', 'genesis_do_post_image', 8 );
Above code removes Post image from the content section and then adds back to header section above the title.
See this visual guide for order of different genesis hooks: https://genesistutorials.com/visual-hook-guide/

I need a custom wc-template-functions.php file

I am trying to change the layout of my single product page. For this i need to change the file wc-template-functions.php (found in plugins/woocommerce/includes).
I know for changing the template files i have to copy the folder into my theme and rename it to "woocommerce" but how does it work for a file in the folder includes?
If you take a look at the template for the single product page, specifically content-single.php you will see that the product images are attached to the woocommerce_before_single_product_summary hook.
To remove them you would need to use remove_action() and then to place them somewhere else you attach them to a different hook via add_action():
function so_31406339_move_images(){
remove_action( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_images ', 20 );
// for example, to move them to the very bottom of the page:
add_action( 'woocommerce_after_single_product_summary', 'woocommerce_show_product_images ', 30 );
}
add_action( 'woocommerce_before_single_product', 'so_31406339_move_images' );

Woocommerce - How to remove the Add to Cart Button on product listing

I'm wanting to remove the Add to Cart Button on the product listing pages. The only place I want it to appear is the individual product page. Can anyone suggest on where I can find to remove this? I haven't been able to get any help from the documentation.
At the moment the button appears under every listing.
I don't know how to do it from WooCommerce but with following code it is possible, just make sure that these PHP code should execute, so, put it at suitable place in PHP file where some PHP codes are executing, best place would be any wordpress plugin's base file, be careful while updating that plugin as these code will get lost after updating.
add_action( 'woocommerce_after_shop_loop_item', 'remove_add_to_cart_buttons', 1 );
function remove_add_to_cart_buttons() {
remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart' );
}
We have found the answer by coding a little bit, in wordpress:
function remove_loop_button(){
remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
}
add_action('init','remove_loop_button');
here: https://www.igniweb.com/remove-add-to-cart-button-wordpress/
You can remove the add to cart button from product pages by adding this in woocommerce.php (located wp-content/plugins/woocommerce)
function Wp() {
remove_action( 'woocommerce_after_shop_loop_item',
'woocommerce_template_loop_add_to_cart');
remove_action( 'woocommerce_single_product_summary',
'woocommerce_template_single_add_to_cart');
return WooCommerce::instance();
}
After adding this code, reload the page and you will see that the button has been hidden.
You can also remove the add to cart button from specific Product pages using this code in functions.php (located in the theme folder):
add_filter('woocommerce_is_purchasable', 'wp_specific_product');
function wp_specific_product($purchaseable_product_wp, $product)
{
return ($product->id == specific_product_id (512) ? false :
$purchaseable_product_wp);
}
For reference you can see
https://wpitech.com/hide-disable-add-to-cart-button-in-woocommerce-store/

Resources