Have Price and Add To Basket button within the same

Hi there,

GP doesn't overwrite the Woo templates. Thankfully woo does provide some filters so you don't need to mess with the templates. An example of what you require is provided here - that also accounts for variable products:

https://stackoverflow.com/a/51584094

Note there is two add_filters at the top of the code.
The second one:
add_filter( 'woocommerce_product_single_add_to_cart_text', 'custom_add_to_cart_price', 20, 2 ); // Single product pages

Can can be removed if you only want it applied to the shop pages.

Then you can disable the default price display in Customizer > Layout > Woocommerce

Hi David,

Thanks for getting back to me so quickly.

I don't think I explained that very well. The code on Stackoverflow puts the price inside the Add to Basket button. What I'd like is something hopefully much simpler. I just want the price to be stacked directly above the button, but outside the a href attribute that wraps the image and product title.

For example the loop is displaying like this...

<a href>
<img /> - Product image here
<h2>Product Title</h2> - this is the title
<span class="price">£200</span> - this is the price
</a>

<a href="link/?add-to-cart">Add To Basket</a> - this is the button

So the loop has wrapped the image, product title and price together, and the add to basket button is separate.

And I'd like it like this...

<a href>
<img /> - Product image here
<h2>Product Title</h2> - this is the title
</a>

<span class="price">£200</span> - this is the price
<a href="link/?add-to-cart">Add To Basket</a> - this is the button

I've added a private link to see the staging site. If you scroll down the page to where it says 'Save money with a report bundle' this is a typical product grid.

Thanks again

Gary

Most likely i didn't read the topic fully - sorry about that.
In that case you should be able to simply unhook the woocommerce_template_loop_price and hook it in before the add to cart:

remove_action( 'woocommerce_after_shop_loop_item_title', 'woocommerce_template_loop_price', 10 );
add_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_price', 9 );

This is a real handy guide on the Hooks in the woo shop template:

https://www.businessbloomer.com/woocommerce-visual-hook-guide-archiveshopcat-page/

Ah that bit of code has created 2 add to cart buttons stacked. There's no price now.

Also the thing I've just realised could be a spanner in the works for this method is we have certain pages where the layout needs to remain in its original form as there's 2 different styles of product card being used throughout the site, however, unfortunately they both use the same loop don't they.

Ah maybe this isn't doable afterall.

Doh - i am having one of those days ... updated the code above so it hooks back in the price ( not another button )

Thanks, David.

That's sorted it.

Phew ... glad we got there :)
Glad to be of help.