Follow these steps to customize the default product layout with additional components:
- Log in to the WordPress Dashboard as an administrator.
- Click the Products menu item from the left-hand menu.
- Click the View button of one of the products to see the product page on the frontend.
- Copy the content-single-product.php template from the woocommerce/templates/ folder and add it to the woocommerce folder of the child theme.
- Open the added content-single-product.php template to view the code. The following code is extracted from the content-single-product.php file after removing any comments and unnecessary components for this recipe:
<?php do_action( 'woocommerce_before_single_product' ); ?><div id="product-<?php the_ID(); ...