Archived topic
Woocommerce product page 1 column
3 replies · Started by Daniel on January 4, 2022
Hello,
In woocommerce, it's possible to modify the template of the product page , and that everything appears in one column?
We need you to get out first title + price to appear first, then the images and lastly a brief description, purchase button, etc.
Thanks!
Hi there,
so GP doesn't interfere with Woocommerce templates, which is handy as it means you can use Woo hooks to move stuff around.
First off this handy guide shows where the hooks are and what functions are loaded on the single product:
https://www.businessbloomer.com/woocommerce-visual-hook-guide-single-product-page/
Now we can then:
1. Add the following PHP Snippet to unhook the woocommerce_show_product_images function and add it back in below the price:
remove_action( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_images', 20 );
add_action( 'woocommerce_single_product_summary', 'woocommerce_show_product_images', 11 );
How to Add PHP: https://docs.generatepress.com/article/adding-php/
2. Then its just a little CSS to make sure the Image fills the content width:
.woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
float: none;
width: 100%;
}
Yeah, it works! thanks :)
Awesome - glad to hear that