WooCommerce action hooks and overriding templates

Dmitry Shulga picture Dmitry Shulga · Aug 21, 2016 · Viewed 64.8k times · Source

I have started to learn how to create templates with WooCommerce and I had faced with a little problem. For instance, in the php file content-single-product.php of Woocommerce plugin I have strings like that:

     <?php
        /**
         * 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
         */
        do_action( 'woocommerce_single_product_summary' );

    ?>

And for example, when I want to edit this (delete some fields and change the structure) I try erase the string:

do_action( 'woocommerce_single_product_summary' );

and after that write like this:

<?php
        /**
         * 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
         */
        //do_action( 'woocommerce_single_product_summary' );
        do_action('woocommerce_template_single_title');
    ?>

Could you tell me please why this doesn't work?

What is the right way to edit like that?

Thanks

Answer

LoicTheAztec picture LoicTheAztec · Aug 21, 2016

First in reference below you will find how to override properly woocommerce templates via a theme (avoiding editing the plugin templates).

In your first code snippet, as you can see for woocommerce_single_product_summary hook, you have in order all the different templates that are @hooked in this hook location with do_action() WordPress function:

do_action( 'woocommerce_single_product_summary' ); 

So in your customized code (the 2nd code snippet) you have just replaced the hook, by the hooked template slug (that is NOT a hook) and will NOT work as an entry point action hook. See the references at the bottom of this answer for the list of WooCommerce actions and filters existing hooks

Consequences: All other hooked templates in the commented list code (beginning with @hooked) will be missing if you replace a hook by a template slug.


Explanations (How to):

HOW TO - Concrete example:

You want to customize woocommerce_template_single_title hooked template in woocommerce_single_product_summary hook.

THE HOOK NAME:  woocommerce_single_product_summary hook.

THE TEMPLATES HOOKED (+priority order number)  => corresponding template file name:    
— woocommerce_template_single_title       (5) => single-product/title.php
— woocommerce_template_single_rating     (10) => single-product/rating.php
— woocommerce_template_single_price      (10) => single-product/price.php
— woocommerce_template_single_excerpt    (20) => single-product/short-description.php
— woocommerce_template_single_add_to_cart(30) => single-product/add-to-cart/ (6 files depending on product type)
— woocommerce_template_single_meta       (40) => single-product/review-meta.php
— woocommerce_template_single_sharing -  (50) => single-product/share.php

Then you will need to edit the corresponding woocommerce_single_product_summary hook title.php located in single-product (sub folder)… Finally is not so complicated, once we understand the template structure files and the hooks in that templates.

The priority number, gives the order for the hooked templates: Smaller in first, bigger at the end…

See also: Hooks and their hooked functions execution queue in Wordpress and Woocommerce


Others ways:

You can also use all that existing templates hooks to target very specific changes or customizations, with custom functions located in the function.php file of your active child theme (or theme) or any plugin file too.

Example using add_action() WordPress function:

// define the woocommerce_single_product_summary callback function

function my_custom_action() { 
    echo '<p>This is my custom action function</p>';
};     
add_action( 'woocommerce_single_product_summary', 'my_custom_action', 15 ); 

This function has a priority number of 15 and will display "This is my custom action function" string text, between the product price and the product short description

Optional arguments of this hooked function for this hook:
- The template slug (string).
- The priority (int).


References: