Understanding woocommerce theming - using my own theme - php

Question

NEWS:
After the answer above, I could change a little more, but I still couldn't change all I need. The big question now is:
How can I remove contents of a action (#hooked) and put it in a new hook. Can I do that? For example:
woocommerce_single_product_summary brings
* woocommerce_single_product_summary hook.
*
* #hooked woocommerce_template_single_title - 5
* #hooked woocommerce_template_single_rating - 10
* #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
* #hooked WC_Structured_Data::generate_product_data() - 60
I'd like to remove (I know I have to use remove(action) to make it. And put this contents in a new hook:
woocommerce_single_product_summary brings with
* #hooked woocommerce_template_single_title - 5
* #hooked woocommerce_template_single_rating - 10
* #hooked woocommerce_template_single_price - 10
And a new hook "woocommerce_single_product_NEW with
* #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
How can I do it?
My page now looks like this:
Thanks!
I'm a jr guy learning PHP to make my own Wordpress theme. Today, it's not a big deal, but I have a new project and I've trying to use woocommerce plugin.
My header, sidebar and my footer are working just fine, but I couldn't undestand exacly how to add my own theme to design the single product page and the others woocommerce pages because I didn't know how hooks and that functions bring the content.
My goals:
1) Change all itens of my single page products from this:
MY CODE:
<?php
/**
* woocommerce_before_main_content hook.
*
* #hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
* #hooked woocommerce_breadcrumb - 20
* #hooked WC_Structured_Data::generate_website_data() - 30
*/
do_action( 'woocommerce_before_main_content' );
?>
<!-- CLOSE - Shows the path of my site Inicio / Shop -->
<!-- PAge Title -->
<header class="woocommerce-products-header">
<?php if ( apply_filters( 'woocommerce_show_page_title', true ) ) : ?>
<h1 class="woocommerce-products-header__title page-title">
<?php woocommerce_page_title(); ?>
</h1>
<?php endif; ?>
<!-- Close PAge Title -->
<!-- Não mostra nada nesse momento -->
<?php
/**
* woocommerce_archive_description hook.
*
* #hooked woocommerce_taxonomy_archive_description - 10
* #hooked woocommerce_product_archive_description - 10
*/
do_action( 'woocommerce_archive_description' );
?>
<!-- Fecha - Não mostra nada nesse momento -->
</header>
<?php if ( have_posts() ) : ?>
<?php
/**
* woocommerce_before_shop_loop hook.
*
* #hooked wc_print_notices - 10
* #hooked woocommerce_result_count - 20
* #hooked woocommerce_catalog_ordering - 30
*/
do_action( 'woocommerce_before_shop_loop' );
?>
<?php woocommerce_product_loop_start(); ?>
<?php woocommerce_product_subcategories(); ?>
<?php while ( have_posts() ) : the_post(); ?>
<?php
/**
* woocommerce_shop_loop hook.
*
* #hooked WC_Structured_Data::generate_product_data() - 10
*/
do_action( 'woocommerce_shop_loop' );
?>
<?php wc_get_template_part( 'content', 'product' ); ?>
<?php endwhile; // end of the loop. ?>
<?php woocommerce_product_loop_end(); ?>
<?php
/**
* woocommerce_after_shop_loop hook.
*
* #hooked woocommerce_pagination - 10
*/
do_action( 'woocommerce_after_shop_loop' );
?>
<?php elseif ( ! woocommerce_product_subcategories( array( 'before' => woocommerce_product_loop_start( false ), 'after' => woocommerce_product_loop_end( false ) ) ) ) : ?>
<?php
/**
* woocommerce_no_products_found hook.
*
* #hooked wc_no_products_found - 10
*/
do_action( 'woocommerce_no_products_found' );
?>
<?php endif; ?>
<?php
/**
* woocommerce_after_main_content hook.
*
* #hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)
*/
do_action( 'woocommerce_after_main_content' );
?>
<?php get_footer( 'shop' ); ?>
To something like that:
I already known wich part brings the content, but I'd like to understand how to change each peace of it.
If someone can help me or just link here some documentation, I would apreciate that so much.
Tks!

Answer 1

if you want to modify woocommerce into your theme just follow instructions.
first of all add woocommerce support into your theme.
add_theme_support( 'woocommerce' );
The WooCommerce plugin comes with a number of front-end HTML templates as well as email templates. Instead of editing these files directly within the plugin (which is a very bad idea because once update the plugin and all of your changes will be lost!), you can copy them into your theme:
In your theme directory, make a new folder called “woocommerce.”
Navigate to the WooCommerce plugin directory and open the "templates" folder. The templates folder has a lot of subfolders with all of the different templates that WooCommerce uses. Fortunately, the template file structure and naming in WooCommerce is easy to follow.
In your newly created "woocommerce" folder, copy the template file that you want to edit. Remember to keep the directory structure the same here. If the template you want to edit is within a subfolder then remember to create that subfolder within your theme's directory.
Edit the file from within your “woocommerce” folder and save the changes.
Then Let's say that we want to change some of the HTML within the “My Orders” screen of WooCommerce.
The first thing we need to do is locate the correct template. In this case, the “My Orders” section is under “My Account” in WooCommerce. The directory structure looks like the following:
/wp-content/plugins/woocommerce/templates/myaccount/my-orders.php
Next, make a folder within your theme called “woocommerce” and within that folder make a second folder called “myaccount.” After that, copy the my-orders.php file into that directory.
You should be left with the following:
/wp-content/themes/yourtheme/woocommerce/myaccount/my-orders.php
Any changes made to this file will now override the original.
help links:
https://code.tutsplus.com/articles/an-introduction-to-theming-woocommerce-for-wordpress--wp-31577
https://slicejack.com/creating-custom-woocommerce-themes/