Changing the order on a Woocommerce Product page
We have just completed a WordPress site for client using Woocommerce where the design requirement meant that the order of the elements on the typical Woocommerce product page had to rearranged. In this case the price needed to be moved below the product short description.
Using the built in hooks and functions of Woocommerce this was easy to achieve by adding the following code into the functions.php of the theme we were building:
/* Move price below short description */ remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 ); add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 25 );
To explain what is going on here, we are removing the price function from its current position setting of 10 (the number at the end). We are then re-adding this action as a number 25. The number at the end relates to the order of the items and how they appear on the page with the lowest number items appearing first. By changing the number to a 25 we are abel to position the price after the short desacription which as a value of 20. All of which will stay if you update Woocommerce as it is built into your themes functions.
As a reference to the order of items and how they appear please find below a list of the items and their priority number
* @hooked woocommerce_template_single_title - 5 * @hooked woocommerce_template_single_price - 10 * @hooked woocommerce_template_single_excerpt - 20 * @hooked woocommerce_template_single_add_to_cart - 30 * @hooked woocommerce_template_single_meta - 40 * @hooked woocommerce_template_single_sharing - 50
As always, please back up your themes functions.php before attempting any changes